refactor(client): optimize suspense components

Signed-off-by: Noa Virellia <noa@requiem.garden>

client/src/routes/__root.tsx

@@ -4,7 +4,24 @@ import { ThemeProvider } from '@/components/theme-provider';
 import { Toaster } from '@/components/ui/sonner';
 import '@/index.css';
 
-const queryClient = new QueryClient();
+const queryClient = new QueryClient({
+  defaultOptions: {
+    queries: {
+      retry: (failureCount, error: any) => {
+        // eslint-disable-next-line ts/no-unsafe-assignment
+        const status
+          // eslint-disable-next-line ts/no-unsafe-member-access
+          = error?.response?.status ?? error?.status;
+
+        if (status >= 400 && status < 500) {
+          return false;
+        }
+
+        return failureCount < 3;
+      },
+    },
+  },
+});
 
 function RootLayout() {
   return (

client/src/routes/_sidebarLayout/index.tsx

@@ -13,18 +13,16 @@ export const Route = createFileRoute('/_sidebarLayout/')({
   },
 });
 
-function SectionCards() {
-  return (
-    <div className="*:data-[slot=card]:from-primary/5 *:data-[slot=card]:to-card dark:*:data-[slot=card]:bg-card grid grid-cols-1 gap-4 px-4 *:data-[slot=card]:bg-gradient-to-t *:data-[slot=card]:shadow-xs lg:px-6 @xl/main:grid-cols-2 @5xl/main:grid-cols-4">
-      <CheckinCard />
-    </div>
-  );
-}
-
 function Index() {
   return (
     <div className="flex flex-col gap-4 py-4 md:gap-6 md:py-6">
-      <SectionCards />
+      {/* Section Cards */}
+      <div className="*:data-[slot=card]:from-primary/5 *:data-[slot=card]:to-card dark:*:data-[slot=card]:bg-card
+        grid grid-cols-1 gap-4 px-4 auto-rows-[minmax(175px,auto)] items-stretch
+        *:data-[slot=card]:bg-linear-to-t *:data-[slot=card]:shadow-xs lg:px-6 @xl/main:grid-cols-2 @5xl/main:grid-cols-4"
+      >
+        <CheckinCard />
+      </div>
     </div>
   );
 }