suspense

Author: sdairs

apps/web/src/app/page.tsx

@@ -1,22 +1,15 @@
 "use client";
 
 import { useQueryState } from 'nuqs';
-import { useState, useEffect } from 'react';
+import { useState, useEffect, Suspense } from 'react';
 import { Card } from '@/components/ui/card';
 import Link from 'next/link';
 import { checkToolState, InvalidTokenError } from '@/lib/tinybird';
 import { TOOLS, type AppGridItem, type ToolState } from '@/lib/constants';
 import TokenPrompt from '@/components/token-prompt';
 import { SectionHeader } from '@/components/section-header';
-import { Suspense } from 'react';
 
-export default function Home() {
-  <Suspense>
-    <Page />
-  </Suspense>
-}
-
-function Page() {
+function HomeContent() {
   const [token, setToken] = useQueryState('token');
   const [toolStates, setToolStates] = useState<Record<string, ToolState>>({});
   const [isLoading, setIsLoading] = useState(false);
@@ -178,3 +171,11 @@ function AppCard({
     </Link>
   );
 }
+
+export default function Home() {
+  return (
+    <Suspense>
+      <HomeContent />
+    </Suspense>
+  );
+}