import { ReactNode } from "react";
import type { LayoutProps, ParallelSlots } from '@/core/types/common';

import { auth } from "@/auth";
import { permanentRedirect } from "next/navigation";
import { getInitialServerPathname } from "@/core/utils/helpers/cookies";

import ProfileHeader from '@/core/common/ProfileHeader';
import ServiceWorkerRegister from "@/core/components/ServiceWorkerRegister";
import NotificationTest from "@/app/(profile)/profile/home/_components/NotificationTest/index";

export const dynamic = "force-dynamic";
/**
 * Profile layout. It's specifics to authorized users to manage their account & personal data.\
 *
 * @param {LayoutProps & ParallelSlots<"sidebar">} props   common {@link LayoutProps} props object containing `children`
 *                                                         and the extended {@link ParallelSlots} to allow the parallel
 *                                                         slots in the layout segment.
 * @return {Promise<React.ReactNode>}
 * @constructor
 */


export default async function Layout({ children, modal }: LayoutProps & ParallelSlots<"modal">): Promise<ReactNode | never> {
  const pathname = await getInitialServerPathname();
  const session = await auth();

  if (!session) {
    return permanentRedirect("/auth/sign-in");
  }

  return (
    <div
      className={`
        h-screen flex flex-col w-screen
        items-center bg-[#F6F6F6] min-w-[1024px] !overflow-hidden
      `}
    >
      <div className={"flex flex-col justify-between w-full h-screen max-w-[1440px] min-w-[1024px] pt-5"}>
        <ServiceWorkerRegister />
        <NotificationTest />
        <ProfileHeader session={session}
          initialPathname={pathname} />
        <section className={"flex-grow justify-center"}>
          <div>
            {modal}
          </div>
          <div className={"h-[calc(100vh-180px)] pt-[160px]"}>
            {children}
          </div>
        </section>
      </div>
    </div>
  );
}
