staff_data/apps/web/src/app/main/courses/student/page.tsx

44 lines
1.5 KiB
TypeScript

import { CourseList } from "@web/src/components/models/course/list/course-list";
import { api } from "@nice/client";
import { useState } from "react";
import { CourseCard } from "@web/src/components/models/course/card/CourseCard";
import { useAuth } from "@web/src/providers/auth-provider";
export default function StudentCoursesPage() {
const [currentPage, setCurrentPage] = useState(1);
const { user } = useAuth()
const { data: paginationRes, refetch } = api.course.findManyWithPagination.useQuery({
page: currentPage,
pageSize: 8,
where: {
enrollments: {
some: {
studentId: user?.id
}
}
}
});
const handlePageChange = (page: number) => {
setCurrentPage(page);
refetch()
};
return (
<div className="bg-slate-50 px-4 py-8 sm:px-6 lg:px-8">
<div className="mx-auto max-w-7xl">
<div className="mb-8">
<h1 className="text-3xl font-semibold text-slate-800 mb-4"></h1>
</div>
<CourseList
totalPages={paginationRes?.totalPages}
onPageChange={handlePageChange}
currentPage={currentPage}
courses={paginationRes?.items as any}
renderItem={(course) => <CourseCard course={course}></CourseCard>}>
</CourseList>
</div>
</div>
);
}