'use client'
import UserTabContent from "@/app/user/profile/_partials/UserTabContent"
import BreadCrumbNav from "@/components/(dashboard)/common/BreadCumbNav/BreadCrumbNav"
import DataTable from "@/components/(dashboard)/common/DataTable/DataTable"
import ContentContainer from "@/components/(dashboard)/elements/ContentContainer"
import { PageHeading } from "@/components/(dashboard)/ui/title"
import CommonContainer from "@/components/elements/CommonContainer"
import AppContextProvider from "@/helpers/context/AppContextProvider"
import { defaultFetcher } from "@/helpers/fetch.helper"
import { routes } from "@/lib/routes"
import { APP_BASE_URL } from "@/utils/constants"
import AdminView from "@/views/AdminView"
import useSWR from "swr"
import UserTable from "./_partials/UserTable"

const UsersIndexPage = () => {
  const UserListURL = `${APP_BASE_URL}/api/admin/stats/userDetail`
  const { data : UsersList , mutate , isLoading} = useSWR(UserListURL , defaultFetcher);


  console.log(UsersList)

  return(
    <>
      <AppContextProvider>
        <AdminView>
          <CommonContainer>
            <PageHeading>Users</PageHeading>
            <BreadCrumbNav breadCrumbItems={[
                {
                  title : 'Dashboard',
                  href : routes.DASHBOARD_ROUTE
                },
                {
                  title : 'Course',
                  href : routes.COURSE_INDEX_PAGE
                },
              ]}/>
              <ContentContainer>
                <div>
                  <UserTable
                    userData={CourseList?.course}
                    mutate={mutate}
                    isLoading={isLoading}
                  />
                </div>
              </ContentContainer>
          </CommonContainer>
        </AdminView>
      </AppContextProvider>
    </>
  )
}

export default UsersIndexPage