diff --git a/src/app/classes/[id]/page.tsx b/src/app/classes/[id]/page.tsx index fed8122..482d78b 100644 --- a/src/app/classes/[id]/page.tsx +++ b/src/app/classes/[id]/page.tsx @@ -1,9 +1,9 @@ 'use client'; -import ClassScreen from '@/components/screens/ClassScreen'; +import ClassroomScreen from '@/components/screens/ClassroomScreen'; import { useParams } from 'next/navigation'; export default function ClassPage() { const { id } = useParams<{ id: string }>(); - return ; + return ; } diff --git a/src/app/classes/page.tsx b/src/app/classes/page.tsx index 71bb5c8..a680d75 100644 --- a/src/app/classes/page.tsx +++ b/src/app/classes/page.tsx @@ -1,5 +1,5 @@ -import ClassesScreen from '@/components/screens/ClassesScreen'; +import ClasroomsScreen from '@/components/screens/ClassroomsScreen'; export default function ClassesPage() { - return ; + return ; } diff --git a/src/components/providers/AuthProvider.tsx b/src/components/providers/AuthProvider.tsx index 03dba22..b293d57 100644 --- a/src/components/providers/AuthProvider.tsx +++ b/src/components/providers/AuthProvider.tsx @@ -1,11 +1,14 @@ 'use client'; +import { api } from '@/api/api'; import { authAtom, loadUser } from '@/store/auth'; +import { classroomsAtom } from '@/store/classrooms'; import { useAtom } from 'jotai'; import { useEffect } from 'react'; export default function AuthProvider({ children }: Readonly<{ children: React.ReactNode }>) { const [auth, setAuth] = useAtom(authAtom); + const [, setClassrooms] = useAtom(classroomsAtom); useEffect(() => { const initAuth = async () => { @@ -19,7 +22,19 @@ export default function AuthProvider({ children }: Readonly<{ children: React.Re }; initAuth(); - }, [auth.token, setAuth]); + + const fetchClassrooms = async () => { + try { + const data = await api.classroom.getAll(); + setClassrooms(data); + } catch (error) { + console.error('Failed to fetch classrooms:', error); + setClassrooms([]); + } + }; + + fetchClassrooms(); + }, [auth.token, setAuth, setClassrooms]); return <>{children}; } diff --git a/src/components/screens/ActivityScreen.tsx b/src/components/screens/ActivityScreen.tsx index 51fcf7d..120d887 100644 --- a/src/components/screens/ActivityScreen.tsx +++ b/src/components/screens/ActivityScreen.tsx @@ -194,7 +194,7 @@ export default function ActivityScreen({ > {activityTypeInfo[activity.type].label} - {classroom.name} + {classroom.name} ) { +export default function ClassroomScreen({ id }: Readonly<{ id: string }>) { const [classroom, setClassroom] = useState(null); const [isLoading, setIsLoading] = useState(true); const router = useRouter(); diff --git a/src/components/screens/ClassesScreen.tsx b/src/components/screens/ClassroomsScreen.tsx similarity index 98% rename from src/components/screens/ClassesScreen.tsx rename to src/components/screens/ClassroomsScreen.tsx index 6c93de3..cfea5b5 100644 --- a/src/components/screens/ClassesScreen.tsx +++ b/src/components/screens/ClassroomsScreen.tsx @@ -20,7 +20,7 @@ import ClassroomCard from '../general/ClassroomCard'; import CreateClassModal from '../modals/CreateClassModal'; import JoinClassModal from '../modals/JoinClassModal'; -export default function ClassesScreen() { +export default function ClasroomsScreen() { const { isOpen: isCreateOpen, onOpen: onCreateOpen, onClose: onCreateClose } = useDisclosure(); const { isOpen: isJoinOpen, onOpen: onJoinOpen, onClose: onJoinClose } = useDisclosure(); const [classrooms, setClassrooms] = useState([]); diff --git a/src/components/screens/IndexScreen.tsx b/src/components/screens/IndexScreen.tsx index 9933313..77e1564 100644 --- a/src/components/screens/IndexScreen.tsx +++ b/src/components/screens/IndexScreen.tsx @@ -1,32 +1,15 @@ 'use client'; -import { api } from '@/api/api'; -import type { IClassroom } from '@/types/IClassroomCard'; +import { classroomsAtom } from '@/store/classrooms'; import { Box, Button, Container, Flex, Heading, SimpleGrid, Spinner, Text } from '@chakra-ui/react'; +import { useAtom } from 'jotai'; import { useRouter } from 'next/navigation'; -import { useEffect, useState } from 'react'; import { FiBookOpen } from 'react-icons/fi'; import ClassroomCard from '../general/ClassroomCard'; export default function IndexScreen() { const router = useRouter(); - const [classrooms, setClassrooms] = useState([]); - const [isLoading, setIsLoading] = useState(true); - - useEffect(() => { - const fetchClassrooms = async () => { - try { - const data = await api.classroom.getAll(); - setClassrooms(data); - } catch (error) { - console.error('Failed to fetch classrooms:', error); - } finally { - setIsLoading(false); - } - }; - - fetchClassrooms(); - }, []); + const [classrooms] = useAtom(classroomsAtom); return ( @@ -83,7 +66,7 @@ export default function IndexScreen() { Clases Destacadas - {isLoading ? ( + {classrooms === null ? ( diff --git a/src/store/classrooms.ts b/src/store/classrooms.ts new file mode 100644 index 0000000..acd33af --- /dev/null +++ b/src/store/classrooms.ts @@ -0,0 +1,4 @@ +import type { IClassroom } from '@/types/IClassroomCard'; +import { atom } from 'jotai'; + +export const classroomsAtom = atom(null);