refactor sublayout and profile page

src/app/[locale]/(private)/profile/page.tsx

@@ -1,18 +1,56 @@
 import { getContacts, getContactTypes } from '@/actions/profile.actions';
-import { Profile } from '@/app/[locale]/(private)/profile/profile';
 import { getTranslations } from 'next-intl/server';
+import { SubLayout } from '@/app/[locale]/(private)/sub-layout';
+import { getUserDetails } from '@/actions/auth.actions';
+import { Heading1 } from '@/components/typography/headers';
+import { Paragraph } from '@/components/typography/paragraph';
+import { InfoBlock } from '@/app/[locale]/(private)/profile/components/info-block';
+import { Card, CardContent } from '@/components/ui/card';
+import { Contacts } from '@/app/[locale]/(private)/profile/components/contacts';
+import { Show } from '@/components/utils/show';
+import { IntellectAgreement } from '@/app/[locale]/(private)/profile/components/intellect-agreement';
+import { IntellectPublicationInfo } from '@/app/[locale]/(private)/profile/components/intellect-publication-info';
+import { CodeOfHonor } from '@/app/[locale]/(private)/profile/components/code-of-honor';
+
+const INTL_NAMESPACE = 'private.profile';
 
 export async function generateMetadata() {
-  const t = await getTranslations({ namespace: 'private.profile' });
+  const t = await getTranslations(INTL_NAMESPACE);
 
   return {
     title: t('title'),
   };
 }
 
 export default async function Page() {
+  const t = await getTranslations(INTL_NAMESPACE);
+
+  const user = await getUserDetails();
+
   const contacts = await getContacts();
   const contactTypes = await getContactTypes();
 
-  return <Profile contacts={contacts} contactTypes={contactTypes} />;
+  const isEmployee = !!user?.employeeProfile;
+
+  return (
+    <SubLayout pageTitle={t('title')}>
+      <div className="col-span-12">
+        <Heading1>{t('title')}</Heading1>
+        <Paragraph className="text-neutral-700">{t('subtitle')}</Paragraph>
+        <div className="flex flex-col gap-5 xl:flex-row">
+          <InfoBlock className="h-fit w-full" />
+          <Card className="h-fit w-full">
+            <CardContent className="flex flex-col gap-6 space-y-1.5 p-9">
+              <Contacts contacts={contacts} contactTypes={contactTypes} />
+              <Show when={isEmployee}>
+                <IntellectAgreement />
+                <IntellectPublicationInfo />
+              </Show>
+              <CodeOfHonor />
+            </CardContent>
+          </Card>
+        </div>
+      </div>
+    </SubLayout>
+  );
 }

src/app/[locale]/(private)/sub-layout.tsx

@@ -1,4 +1,3 @@
-'use client';
 import {
   Breadcrumb,
   BreadcrumbItem,
@@ -8,10 +7,9 @@ import {
   BreadcrumbSeparator,
 } from '@/components/ui/breadcrumb';
 import { cn } from '@/lib/utils';
-import { useTranslations } from 'next-intl';
 import React from 'react';
-import { useLocalStorage } from '@/hooks/use-storage';
-import { User } from '@/types/user';
+import { getTranslations } from 'next-intl/server';
+import { getUserDetails } from '@/actions/auth.actions';
 import CodeOfHonorAlert from '@/components/code-of-honor-alert';
 
 interface SubLayoutProps {
@@ -21,9 +19,9 @@ interface SubLayoutProps {
   className?: string;
 }
 
-export const SubLayout = ({ children, breadcrumbs = [], pageTitle, className }: SubLayoutProps) => {
-  const t = useTranslations('global.menu');
-  const [user] = useLocalStorage<User>('user');
+export const SubLayout = async ({ children, breadcrumbs = [], pageTitle, className }: SubLayoutProps) => {
+  const t = await getTranslations('global.menu');
+  const user = await getUserDetails();
 
   if (!user?.codeOfHonorSignDate) {
     return <CodeOfHonorAlert />;