add relay environment

app/javascript/src/App.tsx

@@ -1,7 +1,9 @@
 import type { FC } from "react";
-import React from "react";
+import React, { Suspense } from "react";
+import { RelayEnvironmentProvider } from "react-relay";
 import { BrowserRouter as Router } from "react-router-dom";
 
+import { environment } from "../relay/environment";
 import { Navbar } from "./components/Navbar";
 import { SideNav } from "./components/SideNav";
 import { AppContext } from "./contexts/AppContext";
@@ -10,18 +12,22 @@ import { Routes } from "./Routes";
 
 export const App: FC = () => {
   return (
-    <Router>
-      <AuthProvider>
-        <AppContext>
-          <main className="min-h-screen w-full bg-gray-50 flex flex-col">
-            <Navbar />
-            <div className="flex flex-grow">
-              <SideNav />
-              <Routes />
-            </div>
-          </main>
-        </AppContext>
-      </AuthProvider>
-    </Router>
+    <RelayEnvironmentProvider environment={environment}>
+      <Suspense fallback="Carregando...">
+        <Router>
+          <AuthProvider>
+            <AppContext>
+              <main className="min-h-screen w-full bg-gray-50 flex flex-col">
+                <Navbar />
+                <div className="flex flex-grow">
+                  <SideNav />
+                  <Routes />
+                </div>
+              </main>
+            </AppContext>
+          </AuthProvider>
+        </Router>
+      </Suspense>
+    </RelayEnvironmentProvider>
   );
 };