list public spaces on the connect index

Author: nikgraf

apps/connect/src/routes/index.tsx

@@ -2,6 +2,7 @@ import { CreateSpaceCard } from '@/components/CreateSpaceCard';
 import { SpacesCard } from '@/components/SpacesCard';
 import { Loading } from '@/components/ui/Loading';
 import { usePrivateSpaces } from '@/hooks/use-private-spaces';
+import { usePublicSpaces } from '@/hooks/use-public-spaces';
 import { useIdentityToken } from '@privy-io/react-auth';
 import { createFileRoute } from '@tanstack/react-router';
 
@@ -27,15 +28,24 @@ function Index() {
 
 function Authorized() {
   const { isPending: privateSpacesPending, error: privateSpacesError, data: privateSpacesData } = usePrivateSpaces();
+  const {
+    isPending: publicSpacesPending,
+    error: publicSpacesError,
+    data: publicSpacesData,
+  } = usePublicSpaces(import.meta.env.VITE_HYPERGRAPH_API_URL);
 
   return (
     <div className="flex grow flex-col items-center justify-center">
       <div className="grid w-xl max-w-full flex-col gap-6 lg:w-4xl lg:grid-cols-2 lg:gap-8 2xl:w-6xl">
         <div className="relative min-h-80 lg:row-span-2">
           <SpacesCard
-            spaces={privateSpacesData ?? []}
+            spaces={[...(privateSpacesData ?? []), ...(publicSpacesData ?? [])]}
             status={
-              privateSpacesPending ? 'loading' : privateSpacesError ? { error: privateSpacesError.message } : undefined
+              privateSpacesPending || publicSpacesPending
+                ? 'loading'
+                : privateSpacesError || publicSpacesError
+                  ? { error: privateSpacesError?.message || publicSpacesError?.message || 'Unknown error' }
+                  : undefined
             }
             className="lg:absolute lg:inset-0"
           />