diff --git a/src/app/casos-activos/mapa/page.tsx b/src/app/casos-activos/mapa/page.tsx index b59e5e55..5aaea64f 100644 --- a/src/app/casos-activos/mapa/page.tsx +++ b/src/app/casos-activos/mapa/page.tsx @@ -1,6 +1,6 @@ 'use client'; -import { useState, useEffect } from 'react'; +import { useState, useEffect, Suspense } from 'react'; import { supabase } from '@/lib/supabase/client'; import SolicitudCard from '@/components/SolicitudCard'; import { useRouter, useSearchParams } from 'next/navigation'; @@ -8,7 +8,15 @@ import { tiposAyudaOptions } from '@/helpers/constants'; import Map, { PinMapa } from '@/components/map/map'; import PickupPoint from '@/components/PickupPoint'; -export default function Mapa() { +export default function MapaPage() { + return ( + + + + ); +} + +function Mapa() { const searchParams = useSearchParams(); const router = useRouter(); diff --git a/src/app/casos-activos/ofertas/page.js b/src/app/casos-activos/ofertas/page.js index 007cfcf3..3d7a58e7 100644 --- a/src/app/casos-activos/ofertas/page.js +++ b/src/app/casos-activos/ofertas/page.js @@ -1,6 +1,6 @@ 'use client'; -import { useEffect, useState } from 'react'; +import { Suspense, useEffect, useState } from 'react'; import { HeartHandshake } from 'lucide-react'; import { supabase } from '@/lib/supabase/client'; import Pagination from '@/components/Pagination'; @@ -9,10 +9,19 @@ import { useRouter, useSearchParams } from 'next/navigation'; import { useTowns } from '@/context/TownProvider'; import OfferCard from '@/components/OfferCard'; -export default function Ofertas() { +export default function OfertasPage() { + return ( + + + + ); +} + +function Ofertas() { const { towns } = useTowns(); const searchParams = useSearchParams(); const router = useRouter(); + const {} = router; const [loading, setLoading] = useState(true); const [error, setError] = useState(null); diff --git a/src/app/casos-activos/solicitudes/page.js b/src/app/casos-activos/solicitudes/page.js index 99853cba..e1b8acf0 100644 --- a/src/app/casos-activos/solicitudes/page.js +++ b/src/app/casos-activos/solicitudes/page.js @@ -1,6 +1,6 @@ 'use client'; -import { useEffect, useState } from 'react'; +import { Suspense, useEffect, useState } from 'react'; import { HeartHandshake } from 'lucide-react'; import { supabase } from '@/lib/supabase/client'; import SolicitudCard from '@/components/SolicitudCard'; @@ -14,7 +14,15 @@ import { useTowns } from '@/context/TownProvider'; const MODAL_NAME = 'solicitudes'; -export default function Solicitudes() { +export default function SolicitudesPage() { + return ( + + + + ); +} + +function Solicitudes() { const { getTownById, towns } = useTowns(); const searchParams = useSearchParams(); const router = useRouter(); diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 48aa29c9..56027f59 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -2,7 +2,6 @@ import './globals.css'; import 'leaflet/dist/leaflet.css'; import SidebarLayout from '@/components/layout/SidebarLayout'; import { ModalProvider } from '@/context/ModalProvider'; -import { createClient } from '@/lib/supabase/server'; import { SessionProvider } from '@/context/SessionProvider'; import { Toaster } from 'sonner'; import { PropsWithChildren } from 'react'; @@ -13,19 +12,12 @@ export const metadata = { description: 'Sistema de coordinación para emergencias en la Comunidad Valenciana', }; -const getSession = async () => { - const supabase = await createClient(); - const { data, error } = await supabase.auth.getUser(); - return data; -}; - export default async function RootLayout({ children }: PropsWithChildren) { - const session = await getSession(); return ( - + {children} diff --git a/src/app/ofertas/page.tsx b/src/app/ofertas/page.tsx index 38c01f7e..03405fb8 100644 --- a/src/app/ofertas/page.tsx +++ b/src/app/ofertas/page.tsx @@ -1,6 +1,6 @@ 'use client'; -import { useState, useEffect } from 'react'; +import { useState, useEffect, Suspense } from 'react'; import { HeartHandshake } from 'lucide-react'; import { supabase } from '@/lib/supabase/client'; import Pagination from '@/components/Pagination'; @@ -12,7 +12,15 @@ import OfferCard from '@/components/OfferCard'; import Link from 'next/link'; import { HelpRequestData } from '@/types/Requests'; -export default function ListaSolicitudes() { +export default function ListaSolicitudesPage() { + return ( + + + + ); +} + +function ListaSolicitudes() { const session = useSession(); const searchParams = useSearchParams(); diff --git a/src/context/SessionProvider.tsx b/src/context/SessionProvider.tsx index c94f7344..9629d3a6 100644 --- a/src/context/SessionProvider.tsx +++ b/src/context/SessionProvider.tsx @@ -1,6 +1,7 @@ 'use client'; -import React, { createContext, ReactNode, useContext } from 'react'; +import React, { createContext, ReactNode, useContext, useEffect, useState } from 'react'; import { User } from '@supabase/auth-js'; +import { supabase } from '@/lib/supabase/client'; const SessionContext = createContext({ user: null }); @@ -8,10 +9,29 @@ type UserSession = { user: User } | { user: null }; type SessionProviderProps = { children: ReactNode; - session: UserSession; }; -export const SessionProvider: React.FC = ({ children, session }) => { +export const SessionProvider: React.FC = ({ children }) => { + const [session, setSession] = useState(() => ({ user: null })); + + useEffect(() => { + // Fetch initial session + const fetchSession = async () => { + const { data } = await supabase.auth.getUser(); + setSession(data); + }; + fetchSession(); + + // Subscribe to session changes + const { data: authListener } = supabase.auth.onAuthStateChange((event, session) => { + setSession(() => ({ user: session?.user ?? null })); // Update the session in state + }); + + // Clean up listener on component unmount + return () => { + authListener?.subscription.unsubscribe(); + }; + }, []); return {children}; };