import React from "react";
import {
  checkAccessTokenIsValid,
  retrievePageList,
  retrievePagebyUrl,
} from "@/apicalls/cookies/token";
import { redirect } from "next/navigation";
import { retrievePage } from "@/components/NavigatePages";
import LeftMenu from "@/components/menu/leftMenu";

export default async function DashboardLayout({
  searchParams,
}: {
  searchParams: Promise<{ [key: string]: string | undefined }>;
}) {
  const token_is_valid = await checkAccessTokenIsValid();
  const siteUrlsList = (await retrievePageList()) || [];
  if (!token_is_valid) {
    redirect("/auth/login");
  }
  const lang = "tr";
  const searchParamsInstance = await searchParams;
  const pageToDirect = await retrievePagebyUrl("/dashboard");
  const PageComponent = retrievePage(pageToDirect);

  return (
    <>
      <div className="min-h-screen min-w-screen flex h-screen w-screen overflow-hidden">
        {/* Sidebar */}
        <aside className="w-1/4 border-r p-4 overflow-y-auto">
          <LeftMenu
            pageUuidList={siteUrlsList}
            lang={lang}
            searchParams={searchParamsInstance}
          />
        </aside>

        {/* Main Content Area */}
        <div className="flex flex-col w-3/4">
          {/* Sticky Header */}
          <header className="sticky top-0 bg-white shadow-md z-10 p-4 flex justify-between items-center">
            <h1 className="text-2xl font-semibold">Dashboard</h1>
            <div className="flex items-center space-x-4">
              <input
                type="text"
                placeholder="Search..."
                className="border px-3 py-2 rounded-lg"
              />
              <div className="w-10 h-10 bg-gray-300 rounded-full"></div>
            </div>
          </header>
          <PageComponent lang={lang} queryParams={searchParamsInstance} />
        </div>
      </div>
    </>
  );
}