Spaces:

Hans-R-D
/

Web.Auth.Nexus

Sleeping

App Files Files Community

ChandimaPrabath commited on Jan 23, 2025

Commit

3acdbcc

1 Parent(s): b780a2e

patch

Browse files

Files changed (6) hide show

frontend/app/components/NexusAuth.js +3 -1
frontend/app/components/SplashScreen.js +3 -3
frontend/app/layout.js +36 -43
frontend/app/lib/Nexus_Auth_API.js +1 -1
frontend/app/lib/ToastContext.js +22 -0
frontend/app/su/[access_level]/page.js +12 -2

frontend/app/components/NexusAuth.js CHANGED Viewed

@@ -3,6 +3,7 @@ import './NexusAuth.css';
 import { useState, useEffect } from 'react';
 import NexusAuthApi from '@/app/lib/Nexus_Auth_API';
 import SplashScreen from '@/app/components/SplashScreen';
 import { CheckCircleIcon } from '@heroicons/react/20/solid';
 const SignupForm = ({ onSignup }) => {
@@ -179,10 +180,11 @@ const LoginForm = ({ onLogin }) => {
     );
 };
-export const NexusAuthWrapper = ({ children, toast }) => {
     const [isLoggedIn, setIsLoggedIn] = useState(false);
     const [isSignup, setIsSignup] = useState(false);
     const [isLoading, setIsLoading] = useState(true);
     useEffect(() => {
         const validateUserSession = async () => {

 import { useState, useEffect } from 'react';
 import NexusAuthApi from '@/app/lib/Nexus_Auth_API';
 import SplashScreen from '@/app/components/SplashScreen';
+import { useToast } from '@/app/lib/ToastContext';
 import { CheckCircleIcon } from '@heroicons/react/20/solid';
 const SignupForm = ({ onSignup }) => {
     );
 };
+export const NexusAuthWrapper = ({ children }) => {
     const [isLoggedIn, setIsLoggedIn] = useState(false);
     const [isSignup, setIsSignup] = useState(false);
     const [isLoading, setIsLoading] = useState(true);
+    const toast = useToast();
     useEffect(() => {
         const validateUserSession = async () => {

frontend/app/components/SplashScreen.js CHANGED Viewed

@@ -8,7 +8,7 @@ const SplashScreen = () => {
     useEffect(() => {
         // Optionally update the loading message over time
-        const messages = ["Warming up engines...", "Fetching data...", "Almost ready!"];
         let index = 0;
         const interval = setInterval(() => {
             setLoadingMessage(messages[index]);
@@ -32,8 +32,8 @@ const SplashScreen = () => {
     };
     const logoStyle = {
-        width: "200px",
-        height: "200px",
         marginBottom: "1rem",
         borderRadius: "50%",
         animation: "pulse 2s infinite",

     useEffect(() => {
         // Optionally update the loading message over time
+        const messages = ["Loading...", "Please wait...", "Almost there..."];
         let index = 0;
         const interval = setInterval(() => {
             setLoadingMessage(messages[index]);
     };
     const logoStyle = {
+        width: "400px",
+        height: "400px",
         marginBottom: "1rem",
         borderRadius: "50%",
         animation: "pulse 2s infinite",

frontend/app/layout.js CHANGED Viewed

@@ -1,27 +1,19 @@
 'use client';
-import { Geist, Geist_Mono } from "next/font/google";
 import "./globals.css";
 import { useState } from "react";
 import { NexusAuthWrapper } from "@/app/components/NexusAuth";
-import { ToastContainer, toast, Flip } from 'react-toastify';
 import { CheckCircleIcon, InformationCircleIcon, ExclamationCircleIcon } from '@heroicons/react/20/solid';
 import Sidebar from "@/app/components/Sidebar";
-const geistSans = Geist({
-  variable: "--font-geist-sans",
-  subsets: ["latin"],
-});
-const geistMono = Geist_Mono({
-  variable: "--font-geist-mono",
-  subsets: ["latin"],
-});
 export default function RootLayout({ children }) {
   const [isCollapsed, setIsCollapsed] = useState(true);
   const toggleSidebar = () => {
     setIsCollapsed(!isCollapsed);
   };
   const contentStyle = {
     padding: "30px",
     flexGrow: 1,
@@ -31,7 +23,7 @@ export default function RootLayout({ children }) {
     transition: "margin-left 0.3s ease",
   };
-    const headerStyle = {
     marginBottom: "30px",
     display: "flex",
     justifyContent: "center",
@@ -39,40 +31,41 @@ export default function RootLayout({ children }) {
   return (
     <html lang="en">
-      <body className={`${geistSans.variable} ${geistMono.variable}`}>
-        <ToastContainer
-          transition={Flip}
-          theme="dark"
-          icon={({ type, theme }) => {
-            // theme is not used in this example but you could
-            switch (type) {
-              case 'info':
-                return <InformationCircleIcon className="text-indigo-400" />;
-              case 'error':
-                return <InformationCircleIcon className="text-red-500" />;
-              case 'success':
-                return <CheckCircleIcon className="h-5 w-5 text-green-500" />;
-              case 'warning':
-                return <ExclamationCircleIcon className="text-yellow-500" />;
-              default:
-                return null;
-            }
-          }}
-        />
-        <NexusAuthWrapper toast={toast}>
-          <div className="dashboard-container">
-            <Sidebar isCollapsed={isCollapsed} toggleSidebar={toggleSidebar} />
-            <div style={contentStyle}>
-              <header style={headerStyle}>
-                <h1>Welcome to Nexus Dashboard</h1>
-              </header>
-              <div className="main-content">
-              {children}
               </div>
             </div>
-          </div>
-        </NexusAuthWrapper>
       </body>
     </html>
   );

 'use client';
 import "./globals.css";
 import { useState } from "react";
 import { NexusAuthWrapper } from "@/app/components/NexusAuth";
+import { ToastContainer, Flip } from 'react-toastify';
 import { CheckCircleIcon, InformationCircleIcon, ExclamationCircleIcon } from '@heroicons/react/20/solid';
 import Sidebar from "@/app/components/Sidebar";
+import { ToastProvider } from "@/app/lib/ToastContext"; // Update with your file path
 export default function RootLayout({ children }) {
   const [isCollapsed, setIsCollapsed] = useState(true);
   const toggleSidebar = () => {
     setIsCollapsed(!isCollapsed);
   };
   const contentStyle = {
     padding: "30px",
     flexGrow: 1,
     transition: "margin-left 0.3s ease",
   };
+  const headerStyle = {
     marginBottom: "30px",
     display: "flex",
     justifyContent: "center",
   return (
     <html lang="en">
+      <body>
+        <ToastProvider>
+          <ToastContainer
+            transition={Flip}
+            theme="dark"
+            icon={({ type, theme }) => {
+              switch (type) {
+                case 'info':
+                  return <InformationCircleIcon className="text-indigo-400" />;
+                case 'error':
+                  return <InformationCircleIcon className="text-red-500" />;
+                case 'success':
+                  return <CheckCircleIcon className="h-5 w-5 text-green-500" />;
+                case 'warning':
+                  return <ExclamationCircleIcon className="text-yellow-500" />;
+                default:
+                  return null;
+              }
+            }}
+          />
+          <NexusAuthWrapper>
+            <div className="dashboard-container">
+              <Sidebar isCollapsed={isCollapsed} toggleSidebar={toggleSidebar} />
+              <div style={contentStyle}>
+                <header style={headerStyle}>
+                  <h1>Welcome to Nexus Dashboard</h1>
+                </header>
+                <div className="main-content">
+                  {children}
+                </div>
               </div>
             </div>
+          </NexusAuthWrapper>
+        </ToastProvider>
       </body>
     </html>
   );

frontend/app/lib/Nexus_Auth_API.js CHANGED Viewed

@@ -139,7 +139,7 @@ const NexusAuthApi = {
         params: { user_id: adminId, token }
       });
       debugLog("Fetch all users successful", response.data);
-      return response.data;
     } catch (error) {
       debugLog("Fetch all users failed", error.response?.data || error.message);
       throw error.response?.data || error.message;

         params: { user_id: adminId, token }
       });
       debugLog("Fetch all users successful", response.data);
+      return response;
     } catch (error) {
       debugLog("Fetch all users failed", error.response?.data || error.message);
       throw error.response?.data || error.message;

frontend/app/lib/ToastContext.js ADDED Viewed

	@@ -0,0 +1,22 @@

+'use client';
+import { createContext, useContext } from "react";
+import { toast } from "react-toastify";
+const ToastContext = createContext();
+export function ToastProvider({ children }) {
+  return (
+    <ToastContext.Provider value={toast}>
+      {children}
+    </ToastContext.Provider>
+  );
+}
+export function useToast() {
+  const context = useContext(ToastContext);
+  if (!context) {
+    throw new Error("useToast must be used within a ToastProvider");
+  }
+  return context;
+}

frontend/app/su/[access_level]/page.js CHANGED Viewed

@@ -3,10 +3,12 @@
 import { useState, useEffect } from 'react';
 import { useParams, useRouter } from 'next/navigation';
 import NexusAuthApi from '@/app/lib/Nexus_Auth_API';
 export default function SuperUser() {
   const router = useRouter();
   const { access_level } = useParams();
   const [userDetails, setUserDetails] = useState({
     username: null,
@@ -47,6 +49,7 @@ export default function SuperUser() {
         window.location.reload();
       })
       .catch((error) => {
         console.error('Logout failed', error);
       });
   };
@@ -54,11 +57,18 @@ export default function SuperUser() {
   const getAllUsers = () => {
     const { userID, token } = userDetails;
     NexusAuthApi.getAllUsers(userID, token)
-      .then((fetchedUsers) => {
-        setUsers(fetchedUsers);
       })
       .catch((error) => {
         console.error('Get all users failed', error);
       });
   };

 import { useState, useEffect } from 'react';
 import { useParams, useRouter } from 'next/navigation';
 import NexusAuthApi from '@/app/lib/Nexus_Auth_API';
+import { useToast } from '@/app/lib/ToastContext';
 export default function SuperUser() {
   const router = useRouter();
   const { access_level } = useParams();
+  const toast = useToast();
   const [userDetails, setUserDetails] = useState({
     username: null,
         window.location.reload();
       })
       .catch((error) => {
+        toast.error('Logout failed');
         console.error('Logout failed', error);
       });
   };
   const getAllUsers = () => {
     const { userID, token } = userDetails;
     NexusAuthApi.getAllUsers(userID, token)
+      .then((response) => {
+        if (response.status === 200) {
+          setUsers(response.data);
+        }
+        else if (response.status === 401) {
+          console.info('Insuffient permissions to get all users');
+          toast.error('Insuffient permissions to get all users');
+        }
       })
       .catch((error) => {
         console.error('Get all users failed', error);
+        toast.error('Get all users failed');
       });
   };