Merge branch 'release-v1.0.5' into impl/app-image-pull

kloudlite · Mar 14, 2024 · ce163de · ce163de
2 parents 83df995 + 890719a
commit ce163de
Show file tree

Hide file tree

Showing 14 changed files with 314 additions and 224 deletions.
diff --git a/.editorconfig b/.editorconfig
diff --git a/lib/app-setup/root.tsx b/lib/app-setup/root.tsx
@@ -32,6 +32,7 @@ import tailwindBase from '~/design-system/tailwind-base.js';
 import { ReloadIndicator } from '~/lib/client/components/reload-indicator';
 import { isDev } from '~/lib/client/helpers/log';
 import { getClientEnv, getServerEnv } from '../configs/base-url.cjs';
+import { useDataFromMatches } from '../client/hooks/use-custom-matches';
 
 export const links: LinksFunction = () => [
   { rel: 'stylesheet', href: stylesUrl },
@@ -167,6 +168,8 @@ const Root = ({
 }) => {
   const env = useLoaderData();
 
+  const error = useDataFromMatches('error', '');
+
   return (
     <html lang="en" className="bg-surface-basic-subdued text-text-default">
       <head>
@@ -235,9 +238,13 @@ const Root = ({
             <ReloadIndicator />
             <NonIdleProgressBar />
             <ToastContainer position="bottom-left" />
-            <Wrapper>
-              <Outlet />
-            </Wrapper>
+            {error ? (
+              <div>{JSON.stringify(error)}</div>
+            ) : (
+              <Wrapper>
+                <Outlet />
+              </Wrapper>
+            )}
           </ProgressContainer>
         </Tooltip.Provider>
         <Scripts />

diff --git a/lib/client/components/logger/index.tsx b/lib/client/components/logger/index.tsx
@@ -669,7 +669,7 @@ const LogComp = ({
     }
   }, [fullScreen]);
 
-  const { logs, subscribed, errors } = useSocketLogs(websocket);
+  const { logs, subscribed, errors, isLoading } = useSocketLogs(websocket);
 
   const [isClientSide, setIsClientSide] = useState(false);
 
@@ -744,7 +744,7 @@ const LogComp = ({
         </Pulsable>
       )}
 
-      {!subscribed && logs.length === 0 && <LoadingComp />}
+      {isLoading && <LoadingComp />}
 
       {errors.length ? (
         <pre>{JSON.stringify(errors)}</pre>

diff --git a/lib/client/helpers/log.ts b/lib/client/helpers/log.ts
@@ -1,7 +1,4 @@
-// import axios from 'axios';
-// import { consoleBaseUrl } from '../../configs/base-url.cjs';
 import { serverError } from '../../server/helpers/server-error';
-// import { parseError } from '../../utils/common';
 
 const getNodeEnv = () => {
   const env = (() => {
@@ -19,52 +16,13 @@ const getNodeEnv = () => {
   return 'development';
 };
 
-/* eslint-disable no-unused-vars */
-/* eslint-disable @typescript-eslint/no-unused-vars */
-export const PostErr = async (message: string, source: string) => {
-  // try {
-  //   await axios.post(
-  //     'https://hooks.slack.com/services/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',
-  //     {
-  //       body: {
-  //         channel: source === 'server' ? '#bugs' : '#web-errors',
-  //         username:
-  //           typeof window === 'undefined' ? 'server-error' : 'web-error',
-  //         text: message,
-  //         icon_emoji: ':ghost:',
-  //       },
-  //     }
-  //   );
-  // } catch (err) {
-  //   console.log(parseError(err).message);
-  // }
-  return {};
-};
-
-const PostToHook = (message: string) => {
-  // if (typeof window === 'undefined') {
-  //   return PostErr(message, 'server');
-  // }
-  //
-  // try {
-  //   axios.post(`${consoleBaseUrl}/api/error`, {
-  //     body: { error: message },
-  //   });
-  // } catch (err) {
-  //   console.log(err);
-  // }
-  return {};
-};
-
 export const isDev = getNodeEnv() === 'development';
 
 const logger = {
   time: isDev ? console.time : () => {},
   timeEnd: isDev ? console.timeEnd : () => {},
   log: isDev ? console.log : () => {},
 
-  // log: console.log,
-
   warn: console.warn,
   trace: (...args: any[]) => {
     let err;
@@ -90,14 +48,16 @@ const logger = {
     }
 
     if (err) {
-      console.log(err);
       if (!isDev) {
-        PostToHook(`\`\`\`${err}\`\`\``);
+        console.trace(`\n\n${args}\n\n`);
+        return;
       }
-    } else {
-      console.trace(args);
+      console.error(`\n\n${err}\n\n`);
+      return;
     }
 
+    console.trace(`\n\n${args}\n\n`);
+
     if (isDev && typeof window === 'undefined') {
       serverError(args);
     }

diff --git a/lib/client/helpers/socket/context.tsx b/lib/client/helpers/socket/context.tsx
@@ -62,8 +62,8 @@ export const useSubscribe = <T extends IData>(
   const {
     sendMsg,
     responses,
-    infos: i,
-    errors: e,
+    infos: mInfos,
+    errors: mErrors,
     clear,
   } = useContext(Context);
 
@@ -85,9 +85,10 @@ export const useSubscribe = <T extends IData>(
           const m = msg[k];
 
           tr.push(...(responses[m.for]?.[m.data.id || 'default'] || []));
-          terr.push(...(e[m.for]?.[m.data.id || 'default'] || []));
-          ti.push(...(i[m.for]?.[m.data.id || 'default'] || []));
+          terr.push(...(mErrors[m.for]?.[m.data.id || 'default'] || []));
+          ti.push(...(mInfos[m.for]?.[m.data.id || 'default'] || []));
         }
+
         setResp(tr);
         setErrors(terr);
         setInfos(ti);
@@ -97,16 +98,19 @@ export const useSubscribe = <T extends IData>(
         }
         return;
       }
+      const tempResp = responses[msg.for]?.[msg.data.id || 'default'] || [];
+      setResp(tempResp);
+
+      setErrors(mErrors[msg.for]?.[msg.data.id || 'default'] || []);
 
-      setResp(responses[msg.for]?.[msg.data.id || 'default'] || []);
-      setErrors(e[msg.for]?.[msg.data.id || 'default'] || []);
-      setInfos(i[msg.for]?.[msg.data.id || 'default'] || []);
+      const tempInfo = mInfos[msg.for]?.[msg.data.id || 'default'] || [];
+      setInfos(tempInfo);
 
-      if (resp.length || i[msg.for]?.[msg.data.id || 'default']?.length) {
+      if (tempResp.length || tempInfo.length) {
         setSubscribed(true);
       }
     })();
-  }, [responses]);
+  }, [responses, mInfos, mErrors]);
 
   useDebounce(
     () => {
@@ -236,7 +240,7 @@ export const SockProvider = ({ children }: ChildrenProps) => {
               };
 
               w.onerror = (e) => {
-                console.error(e);
+                console.error('socket closed:', e);
                 if (!rejected) {
                   rejected = true;
                   rej(e);

diff --git a/lib/client/helpers/socket/useSockLogs.tsx b/lib/client/helpers/socket/useSockLogs.tsx
@@ -11,7 +11,7 @@ interface IuseLog {
 
 export const useSocketLogs = ({ account, cluster, trackingId }: IuseLog) => {
   const [logs, setLogs] = useState<ISocketResp<ILog>[]>([]);
-  const { responses, subscribed, errors } = useSubscribe(
+  const { responses, infos, subscribed, errors } = useSubscribe(
     {
       for: 'logs',
       data: {
@@ -26,16 +26,6 @@ export const useSocketLogs = ({ account, cluster, trackingId }: IuseLog) => {
     []
   );
 
-  const [isLoading, setIsLoading] = useState(true);
-
-  useEffect(() => {
-    if (subscribed && isLoading) {
-      setIsLoading(false);
-    } else if (!subscribed && !isLoading) {
-      setIsLoading(true);
-    }
-  }, []);
-
   useEffect(() => {
     const sorted = responses.sort((a, b) => {
       const resp = b.data.podName.localeCompare(a.data.podName);
@@ -55,7 +45,7 @@ export const useSocketLogs = ({ account, cluster, trackingId }: IuseLog) => {
   return {
     logs,
     errors,
-    isLoading,
+    isLoading: !subscribed && (logs.length === 0 || infos.length === 0),
     subscribed,
   };
 };
diff --git a/lib/client/hooks/use-custom-loader-data.tsx b/lib/client/hooks/use-custom-loader-data.tsx
@@ -0,0 +1,10 @@
+import { useLoaderData } from '@remix-run/react';
+
+type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (
+  k: infer I
+) => void
+  ? I
+  : never;
+
+export const useExtLoaderData = <T extends (...args: any) => Promise<any>>() =>
+  useLoaderData() as UnionToIntersection<Awaited<ReturnType<T>>>;
diff --git a/lib/server/helpers/execute-query-with-context.ts b/lib/server/helpers/execute-query-with-context.ts
@@ -112,12 +112,12 @@ export const ExecuteQueryWithContext = (
         return { ...resp.data, data };
       } catch (err) {
         if ((err as AxiosError).response) {
-          console.trace('ErrorIn:', apiName, (err as Error).name);
+          console.log('\nErrorIn:', apiName, (err as Error).name, '\n');
 
           return (err as AxiosError).response?.data;
         }
 
-        console.trace('ErrorIn:', apiName, (err as Error).message);
+        console.log('\nErrorIn:', apiName, (err as Error).message, '\n');
 
         return {
           data: null,

diff --git a/lib/utils/common.tsx b/lib/utils/common.tsx
@@ -1,10 +1,27 @@
 import { toast } from '~/components/molecule/toast';
 import logger from '../client/helpers/log';
 
-export const handleError = (e: unknown): void => {
+export const handleError = (
+  e: unknown
+): {
+  error?: {
+    message: string;
+  };
+} => {
   const err = e as Error;
+
+  if (typeof window === 'undefined') {
+    return {
+      error: {
+        message: err.message,
+      },
+    };
+  }
+
   toast.error(err.message);
   logger.error(e);
+
+  return {};
 };
 
 export const parseError = (e: unknown): Error => {
@@ -27,8 +44,9 @@ export const Truncate = ({
 };
 
 export function sleep(time: number) {
-  // eslint-disable-next-line no-promise-executor-return
-  return new Promise((resolve) => setTimeout(resolve, time));
+  return new Promise((resolve) => {
+    setTimeout(resolve, time);
+  });
 }
 
 export const anyUndefined: any = undefined;
diff --git a/src/apps/auth/routes/_main+/logout.tsx b/src/apps/auth/routes/_main+/logout.tsx
@@ -1,19 +1,34 @@
-import { getCookie } from '~/root/lib/app-setup/cookies';
-import withContext from '~/root/lib/app-setup/with-contxt';
-import { useNavigate, useLoaderData } from '@remix-run/react';
-import { useEffect } from 'react';
+import { useNavigate } from '@remix-run/react';
 import { BrandLogo } from '~/components/branding/brand-logo';
-import { IExtRemixCtx } from '~/root/lib/types/common';
+import { handleError, sleep } from '~/root/lib/utils/common';
+import { useAuthApi } from '~/auth/server/gql/api-provider';
+import { toast } from 'react-toastify';
+import useDebounce from '~/root/lib/client/hooks/use-debounce';
 
 const LogoutPage = () => {
   const navigate = useNavigate();
-  const { done } = useLoaderData();
+  const api = useAuthApi();
 
-  useEffect(() => {
-    if (done) {
-      navigate('/');
-    }
-  }, [done]);
+  useDebounce(
+    () => {
+      (async () => {
+        try {
+          const { errors } = await api.logout({});
+          if (errors) {
+            throw errors[0];
+          }
+
+          toast.warn('Logged out successfully');
+          await sleep(1000);
+          navigate('/login');
+        } catch (error) {
+          handleError(error);
+        }
+      })();
+    },
+    1000,
+    []
+  );
   return (
     <div className="flex flex-col items-center justify-center gap-7xl h-full">
       <BrandLogo detailed={false} size={100} />
@@ -22,21 +37,4 @@ const LogoutPage = () => {
   );
 };
 
-export const loader = async (ctx: IExtRemixCtx) => {
-  const cookie = getCookie(ctx);
-
-  const keys = Object.keys(cookie.getAll());
-
-  for (let i = 0; i < keys.length; i += 1) {
-    const key = keys[i];
-    if (key === 'hotspot-session') {
-      cookie.remove(key);
-    }
-  }
-
-  return withContext(ctx, {
-    done: 'true',
-  });
-};
-
 export default LogoutPage;
diff --git a/src/apps/auth/routes/_main+/verify-email.tsx b/src/apps/auth/routes/_main+/verify-email.tsx
@@ -46,6 +46,7 @@ const VerifyEmail = () => {
     (async () => {
       try {
         if (!email) {
+          // TODO: handle this case, by taking email from user
           toast.error('Something went wrong! Please try again.');
           return;
         }
@@ -137,8 +138,9 @@ export const loader = async (ctx: IRemixCtx) => {
   const query = getQueries(ctx);
   const { data, errors } = await GQLServerHandler(ctx.request).whoAmI();
   if (errors) {
-    console.error(errors[0].message);
-    return redirect('/');
+    return {
+      query,
+    };
   }
   const { email, verified } = data || {};