Global Variables Page created

src/frontend/src/pages/GlobalVariablesPage/index.tsx

@@ -0,0 +1,23 @@
+import IconComponent from "../../components/genericIconComponent";
+import { Button } from "../../components/ui/button";
+
+import PageLayout from "../../components/pageLayout";
+
+export default function GlobalVariablesPage() {
+  return (
+    <PageLayout
+      title="Global Variables"
+      description="Manage and assign global variables to default fields."
+      button={
+        <>
+          <Button data-testid="api-key-button-store" variant="primary">
+            <IconComponent name="Plus" className="mr-2 w-4" />
+            Add Global Variables
+          </Button>
+        </>
+      }
+    >
+      <div className="flex h-full w-full flex-col justify-between">Page</div>
+    </PageLayout>
+  );
+}

src/frontend/src/routes.tsx

@@ -17,6 +17,7 @@ import ViewPage from "./pages/ViewPage";
 import DeleteAccountPage from "./pages/deleteAccountPage";
 import LoginPage from "./pages/loginPage";
 import SignUp from "./pages/signUpPage";
+import GlobalVariablesPage from "./pages/GlobalVariablesPage";
 
 const Router = () => {
   const navigate = useNavigate();
@@ -126,6 +127,14 @@ const Router = () => {
           </ProtectedAdminRoute>
         }
       />
+      <Route
+        path="/global-variables"
+        element={
+          <ProtectedRoute>
+            <GlobalVariablesPage />
+          </ProtectedRoute>
+        }
+      />
 
       <Route path="/account">
         <Route