import React from "react"
import PageHeader from "@/sections/PageHeader"
import { cookies } from "next/headers"
import { getUserFromCookie } from "@/lib/auth"
import AccountContent from "@/sections/AccountContent"
import { redirect } from "next/navigation"
import pb from "@/lib/pocketbase"
import Background from "@/components/Utilities/Background"
import Footer from "@/components/Footer"
import Spacer from "@/components/Utilities/Spacer"

export default async function AccountPage() {
  const user = await getUserFromCookie(cookies())
  const cookie = cookies().get("pb_auth")
  //server side
  pb.authStore.loadFromCookie(cookie?.value || "")
  !pb.authStore.isValid && redirect("/")
  return (
    user && (
      <main
        id="content"
        role="main"
        className="h-full flex flex-col min-h-screen mx-auto w-screen overflow-hidden bg-base-100"
      >
        <Background className="min-h-screen flex">
          <div className="min-h-screen flex flex-col">
            <PageHeader title="Account" subtitle={<></>} />
            {/* <AccountContent user={user} /> */}
            <Spacer className="mt-auto mb-auto" />
            <Footer />
          </div>
        </Background>
      </main>
    )
  )
}