Fix: remove admin page and signout on flow page

src/frontend/src/components/authAdminGuard/index.tsx

@@ -3,8 +3,14 @@ import { Navigate } from "react-router-dom";
 import { AuthContext } from "../../contexts/authContext";
 
 export const ProtectedAdminRoute = ({ children }) => {
-  const { isAdmin, isAuthenticated, logout, getAuthentication, userData, autoLogin } =
+  const {
-    useContext(AuthContext);
+    isAdmin,
+    isAuthenticated,
+    logout,
+    getAuthentication,
+    userData,
+    autoLogin,
+  } = useContext(AuthContext);
   useEffect(() => {
     if (!isAuthenticated && !getAuthentication()) {
       window.location.replace("/login");
@@ -16,7 +22,7 @@ export const ProtectedAdminRoute = ({ children }) => {
     return <Navigate to="/login" replace />;
   }
 
-  if (userData && !isAdmin || autoLogin) {
+  if ((userData && !isAdmin) || autoLogin) {
     return <Navigate to="/" replace />;
   }
 

src/frontend/src/components/headerComponent/index.tsx

@@ -31,22 +31,25 @@ export default function Header(): JSX.Element {
         {flows.findIndex((f) => tabId === f.id) !== -1 && tabId !== "" && (
           <MenuBar flows={flows} tabId={tabId} />
         )}
-        {autoLogin === false && (
+        {!autoLogin && location.pathname !== `/flow/${tabId}` && (
           <Button
             onClick={() => {
               logout();
               navigate("/login");
             }}
-            className="text-sm font-medium text-muted-foreground transition-colors hover:text-primary cursor-pointer mx-5"
+            className="mx-5 cursor-pointer text-sm font-medium text-muted-foreground transition-colors hover:text-primary"
             variant="outline"
           >
             Sign out
           </Button>
         )}
 
-        {isAdmin && !autoLogin && location.pathname !== "/admin" && (
+        {isAdmin &&
+          !autoLogin &&
+          location.pathname !== "/admin" &&
+          location.pathname !== `/flow/${tabId}` && (
             <Button
-            className="text-sm font-medium text-muted-foreground transition-colors hover:text-primary cursor-pointer"
+              className="cursor-pointer text-sm font-medium text-muted-foreground transition-colors hover:text-primary"
               onClick={() => navigate("/admin")}
               variant="outline"
             >

src/frontend/src/constants/constants.ts

@@ -621,15 +621,18 @@ export const FETCH_ERROR_DESCRIPION =
 
 export const BASE_URL_API = "/api/v1/";
 
-export const SIGN_UP_SUCCESS =
+export const SIGN_UP_SUCCESS = "Account created! Await admin activation. ";
-  "Account created! Await admin activation. ";
 
-export const API_PAGE_PARAGRAPH_1 = "Your secret API keys are listed below. Please note that we do not display your secret API keys again after you generate them.";
+export const API_PAGE_PARAGRAPH_1 =
+  "Your secret API keys are listed below. Please note that we do not display your secret API keys again after you generate them.";
 
-export const API_PAGE_PARAGRAPH_2 = "Do not share your API key with others, or expose it in the browser or other client-side code.";
+export const API_PAGE_PARAGRAPH_2 =
+  "Do not share your API key with others, or expose it in the browser or other client-side code.";
 
-export const API_PAGE_USER_KEYS = "This user does not have any keys assigned at the moment."
+export const API_PAGE_USER_KEYS =
+  "This user does not have any keys assigned at the moment.";
 
 export const LAST_USED_SPAN_1 = "The last time this key was used.";
 
-export const LAST_USED_SPAN_2 = "Accurate to within the hour from the most recent usage.";
+export const LAST_USED_SPAN_2 =
+  "Accurate to within the hour from the most recent usage.";

src/frontend/src/contexts/authContext.tsx

@@ -98,7 +98,6 @@ export function AuthProvider({ children }): React.ReactElement {
     setIsAuthenticated(false);
   }
 
-
   return (
     // !! to convert string to boolean
     <AuthContext.Provider

src/frontend/src/contexts/darkContext.tsx

@@ -1,6 +1,6 @@
 import { createContext, useEffect, useState } from "react";
-import { darkContextType } from "../types/typesContext";
 import { getRepoStars } from "../controllers/API";
+import { darkContextType } from "../types/typesContext";
 
 const initialValue = {
   dark: {},

src/frontend/src/contexts/tabsContext.tsx

@@ -121,8 +121,7 @@ export function TabsProvider({ children }: { children: ReactNode }) {
         try {
           processDBData(DbData);
           updateStateWithDbData(DbData);
-          } catch (e) {
+        } catch (e) {}
-          }
       }
     });
   }
@@ -150,8 +149,7 @@ export function TabsProvider({ children }: { children: ReactNode }) {
         }
         processFlowEdges(flow);
         processFlowNodes(flow);
-      } catch (e) {
+      } catch (e) {}
-      }
     });
   }
 

src/frontend/src/controllers/API/api.tsx

@@ -102,5 +102,4 @@ function ApiInterceptor() {
   return null;
 }
 
-
 export { ApiInterceptor, api };

src/frontend/src/controllers/API/index.ts

@@ -490,7 +490,6 @@ export async function createApiKey(name:string) {
   }
 }
 
-
 export async function deleteApiKey(api_key: string) {
   try {
     const res = await api.delete(`${BASE_URL_API}api_key/${api_key}`);
@@ -502,4 +501,3 @@ export async function deleteApiKey(api_key: string) {
     throw error;
   }
 }
-

src/frontend/src/index.tsx

@@ -1,10 +1,8 @@
 import ReactDOM from "react-dom/client";
-import { BrowserRouter } from "react-router-dom";
 import App from "./App";
 import ContextWrapper from "./contexts";
 import reportWebVitals from "./reportWebVitals";
 
-import { ApiInterceptor } from "./controllers/API/api";
 // @ts-ignore
 import "./style/index.css";
 // @ts-ignore

src/frontend/src/modals/SecretKeyModal/index.tsx

@@ -21,7 +21,7 @@ export default function SecretKeyModal({
   children,
   icon,
   data,
-  onCloseModal
+  onCloseModal,
 }: ApiKeyType) {
   const Icon: any = nodeIconsLucide[icon];
   const [open, setOpen] = useState(false);
@@ -44,8 +44,7 @@ export default function SecretKeyModal({
     if (open) {
       setRenderKey(false);
       resetForm();
-    }
+    } else {
-    else{
       onCloseModal();
     }
   }, [open]);

src/frontend/src/modals/UserManagementModal/index.tsx

@@ -286,7 +286,6 @@ export default function UserManagementModal({
             <Form.Submit asChild>
               <Button className="mt-8">{confirmationText}</Button>
             </Form.Submit>
-
           </div>
         </Form.Root>
       </BaseModal.Content>

src/frontend/src/modals/flowSettingsModal/index.tsx

@@ -3,7 +3,6 @@ import EditFlowSettings from "../../components/EditFlowSettingsComponent";
 import IconComponent from "../../components/genericIconComponent";
 import { Button } from "../../components/ui/button";
 import { SETTINGS_DIALOG_SUBTITLE } from "../../constants/constants";
-import { alertContext } from "../../contexts/alertContext";
 import { TabsContext } from "../../contexts/tabsContext";
 import { FlowSettingsPropsType } from "../../types/components";
 import BaseModal from "../baseModal";

src/frontend/src/modals/formModal/index.tsx

@@ -23,10 +23,10 @@ import {
 } from "../../components/ui/dialog";
 import { Textarea } from "../../components/ui/textarea";
 import { CHAT_FORM_DIALOG_SUBTITLE } from "../../constants/constants";
+import { AuthContext } from "../../contexts/authContext";
 import { TabsContext } from "../../contexts/tabsContext";
 import { TabsState } from "../../types/tabs";
 import { validateNodes } from "../../utils/reactflowUtils";
-import { AuthContext } from "../../contexts/authContext";
 
 export default function FormModal({
   flow,

src/frontend/src/pages/AdminPage/index.tsx

@@ -4,6 +4,7 @@ import { useContext, useEffect, useRef, useState } from "react";
 import PaginatorComponent from "../../components/PaginatorComponent";
 import ShadTooltip from "../../components/ShadTooltipComponent";
 import IconComponent from "../../components/genericIconComponent";
+import Header from "../../components/headerComponent";
 import { Button } from "../../components/ui/button";
 import { Checkbox } from "../../components/ui/checkbox";
 import { Input } from "../../components/ui/input";
@@ -26,7 +27,6 @@ import {
 import ConfirmationModal from "../../modals/ConfirmationModal";
 import UserManagementModal from "../../modals/UserManagementModal";
 import { UserInputType } from "../../types/components";
-import Header from "../../components/headerComponent";
 
 export default function AdminPage() {
   const [inputValue, setInputValue] = useState("");
@@ -194,7 +194,9 @@ export default function AdminPage() {
                       Welcome back!
                     </h2>
                     <p className="text-muted-foreground">
-                    Navigate through this section to efficiently oversee all application users. From here, you can seamlessly manage user accounts.
+                      Navigate through this section to efficiently oversee all
+                      application users. From here, you can seamlessly manage
+                      user accounts.
                     </p>
                   </div>
                   <div className="flex items-center space-x-2"></div>

src/frontend/src/pages/ApiKeysPage/index.tsx

@@ -18,8 +18,14 @@ import SecretKeyModal from "../../modals/SecretKeyModal";
 
 import moment from "moment";
 import Header from "../../components/headerComponent";
+import {
+  API_PAGE_PARAGRAPH_1,
+  API_PAGE_PARAGRAPH_2,
+  API_PAGE_USER_KEYS,
+  LAST_USED_SPAN_1,
+  LAST_USED_SPAN_2,
+} from "../../constants/constants";
 import { ApiKey } from "../../types/components";
-import { API_PAGE_PARAGRAPH_1, API_PAGE_PARAGRAPH_2, API_PAGE_USER_KEYS, LAST_USED_SPAN_1, LAST_USED_SPAN_2 } from "../../constants/constants";
 
 export default function ApiKeysPage() {
   const [loadingKeys, setLoadingKeys] = useState(true);
@@ -71,7 +77,8 @@ export default function ApiKeysPage() {
     return (
       <div className="text-xs">
         <span>
-          {LAST_USED_SPAN_1}<br></br> {LAST_USED_SPAN_2}
+          {LAST_USED_SPAN_1}
+          <br></br> {LAST_USED_SPAN_2}
         </span>
       </div>
     );
@@ -91,7 +98,8 @@ export default function ApiKeysPage() {
                       API keys
                     </h2>
                     <p className="text-muted-foreground">
-                      {API_PAGE_PARAGRAPH_1}<br />
+                      {API_PAGE_PARAGRAPH_1}
+                      <br />
                       {API_PAGE_PARAGRAPH_2}
                     </p>
                   </div>
@@ -103,9 +111,7 @@ export default function ApiKeysPage() {
                   !loadingKeys && (
                     <>
                       <div className="flex items-center justify-between">
-                        <h2>
+                        <h2>{API_PAGE_USER_KEYS}</h2>
-                          {API_PAGE_USER_KEYS}
-                        </h2>
                       </div>
                     </>
                   )}

src/frontend/src/types/components/index.ts

@@ -276,7 +276,6 @@ export type ApiKeyType = {
   icon: string;
   data?: any;
   onCloseModal: () => void;
-
 };
 
 export type ApiKeyInputType = {