Feat await gql client (#152)

* fixing google and github signin

* remove clg

* await gql client

* adding comment

apps/console/src/app/providers.tsx

@@ -7,19 +7,26 @@ import { useSession } from 'next-auth/react'
 import { ThemeProvider } from '@/providers/theme'
 import { usePathname } from 'next/navigation'
 import { ReactNode, useEffect, useState } from 'react'
+import { Loading } from '@/components/shared/loading/loading'
 
 interface ProvidersProps {
   children: ReactNode
 }
 
+//IF YOU ADD PUBLIC PAGE, ITS REQUIRED TO CHANGE IT IN middleware.tsx
+const publicPages = ['/login', '/verify', '/resend-verify', '/waitlist', '/invite']
+
 const Providers = ({ children }: ProvidersProps) => {
   const { data: session, status } = useSession()
   const pathname = usePathname()
   const [client, setClient] = useState<Client | null>(null)
   const [accessToken, setAccessToken] = useState<string | null>(null)
 
+  const isPublicPage = publicPages.includes(pathname)
+
   useEffect(() => {
     const tokenChanged = session?.user.accessToken && session?.user.accessToken !== accessToken
+
     if (status === 'authenticated' && tokenChanged) {
       setAccessToken(session?.user.accessToken)
       setClient(createClient(session))
@@ -28,11 +35,25 @@ const Providers = ({ children }: ProvidersProps) => {
     }
   }, [session?.user.accessToken, status, pathname, accessToken])
 
-  if (status === 'loading' || (status === 'authenticated' && !client)) return null
+  if (status === 'loading') {
+    return <Loading />
+  }
+
+  if (isPublicPage) {
+    return (
+      <ThemeProvider attribute="class" defaultTheme="system" enableSystem disableTransitionOnChange>
+        {children}
+      </ThemeProvider>
+    )
+  }
+
+  if (!client) {
+    return <Loading />
+  }
 
   return (
     <ThemeProvider attribute="class" defaultTheme="system" enableSystem disableTransitionOnChange>
-      {client ? <GraphqlProvider value={client}>{children}</GraphqlProvider> : children}
+      <GraphqlProvider value={client}>{children}</GraphqlProvider>
     </ThemeProvider>
   )
 }

apps/console/src/middleware.ts

@@ -58,6 +58,8 @@ export const config = {
      * - waitlist (waitlist page)
      * - invite (invite verify page)
      */
+
+    //IF YOU ADD PUBLIC PAGE, ITS REQUIRED TO CHANGE IT IN Providers.tsx
     '/((?!api|[_next/static]|[_next/image]|favicon.ico|backgrounds|backgrounds/|icons|icons/|login|verify|resend-verify|waitlist|invite).*)',
   ],
 }