chore: update server health check

Slick-Telemetry · Apr 1, 2024 · 03a449c · 03a449c
1 parent f00dd68
commit 03a449c
Show file tree

Hide file tree

Showing 5 changed files with 49 additions and 13 deletions.
diff --git a/src/app/api/fetchHealth.ts b/src/app/api/fetchHealth.ts
@@ -0,0 +1,35 @@
+import { atomEffect } from 'jotai-effect';
+
+import { serverConnectedState, serverErrorState } from '@/state-mgmt/atoms';
+
+import { fetchAPI } from './fetch';
+
+// otherwise get the default schedule
+export const fetchHealth = atomEffect(
+  (get, set) => {
+    const serverError = get(serverErrorState);
+    if (serverError) {
+      return;
+    }
+
+    // Fetch event list from api
+    fetchAPI('health').then((res: { status: string } | ServerErrorResponse) => {
+      const error = res as ServerErrorResponse;
+
+      if ('status' in res) {
+        set(serverConnectedState, true);
+        return;
+      }
+
+      // *** If errors specific prop, detail, update serverErrorState
+      if (error.detail) {
+        set(serverErrorState, error.detail[0].msg);
+        return;
+      }
+
+      set(serverErrorState, 'No connection');
+    });
+  },
+  // Dependencies:
+  // serverErrorState
+);
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -8,8 +8,6 @@ import './globals.css';
 import { Footer } from '@/components/Footer';
 import { TopNav } from '@/components/TopNav';
 
-import { fetchAPI } from '../lib/helpers';
-
 const inter = Inter({ subsets: ['latin'] });
 
 export const metadata: Metadata = {
@@ -22,15 +20,9 @@ export default async function RootLayout({
 }: {
   children: React.ReactNode;
 }) {
-  const server = await fetchAPI('health');
-
   return (
     <html lang='en'>
-      <body
-        className={clsx('min-h-screen', inter.className, {
-          server: server,
-        })}
-      >
+      <body className={clsx('min-h-screen', inter.className)}>
         <Provider>
           <TopNav />
           {children}

diff --git a/src/components/Footer/index.tsx b/src/components/Footer/index.tsx
@@ -1,13 +1,21 @@
-import { fetchAPI } from '@/lib/helpers';
+'use client';
 
-async function Footer() {
-  const serverStatus = await fetchAPI('health');
+import { useAtom } from 'jotai';
+
+import { fetchHealth } from '@/app/api/fetchHealth';
+import { serverConnectedState, serverErrorState } from '@/state-mgmt/atoms';
+
+function Footer() {
+  useAtom(fetchHealth);
+  const [serverError] = useAtom(serverErrorState);
+  const [serverStatus] = useAtom(serverConnectedState);
 
   return (
     <div className='container min-h-24'>
       <p>Footer</p>
       <p>
-        <b>Server Status:</b> {serverStatus.status || 'Offline'}
+        <b>Server Status:</b>{' '}
+        {serverError || (serverStatus ? 'Connected' : 'Connecting')}
       </p>
     </div>
   );

diff --git a/src/lib/results.d.ts → src/results.d.ts b/src/lib/results.d.ts → src/results.d.ts
diff --git a/src/state-mgmt/atoms.ts b/src/state-mgmt/atoms.ts
@@ -29,6 +29,7 @@ const DriverStandingState = atom<DriverStandingSchema[]>([]);
 
 // Server Error
 export const serverErrorState = atom('');
+export const serverConnectedState = atom(false);
 
 export {
   ConstructorListState,