lifestyle development

app/home/(user)/(dashboard)/life-style/page.tsx

@@ -0,0 +1,84 @@
+import React from 'react';
+
+import { createUserAnalysesApi } from '@/packages/features/user-analyses/src/server/api';
+import { getSupabaseServerClient } from '@/packages/supabase/src/clients/server-client';
+import { Circle } from 'lucide-react';
+
+import { cn } from '@kit/ui/lib/utils';
+import { PageBody } from '@kit/ui/makerkit/page';
+import { Trans } from '@kit/ui/makerkit/trans';
+import { Skeleton } from '@kit/ui/shadcn/skeleton';
+
+import { createI18nServerInstance } from '~/lib/i18n/i18n.server';
+import { withI18n } from '~/lib/i18n/with-i18n';
+import {
+  PageViewAction,
+  createPageViewLog,
+} from '~/lib/services/audit/pageView.service';
+
+import { HomeLayoutPageHeader } from '../../_components/home-page-header';
+import { loadLifeStyle } from '../../_lib/server/load-life-style';
+import { loadCurrentUserAccount } from '../../_lib/server/load-user-account';
+
+export async function generateMetadata() {
+  const { t } = await createI18nServerInstance();
+
+  return {
+    title: t('common:lifeStyle.title'),
+  };
+}
+
+async function LifeStylePage() {
+  const supabaseClient = getSupabaseServerClient();
+  const userAnalysesApi = createUserAnalysesApi(supabaseClient);
+
+  const analysisResponses = await userAnalysesApi.getAllUserAnalysisResponses();
+  console.log('analysisResponses', analysisResponses);
+  const { account } = await loadCurrentUserAccount();
+  if (!account) {
+    return null;
+  }
+  const data = await loadLifeStyle(account);
+
+  await createPageViewLog({
+    accountId: account.id,
+    action: PageViewAction.VIEW_LIFE_STYLE,
+  });
+
+  if (!data.lifestyle) {
+    return <Skeleton className="mt-10 h-10 w-full" />;
+  }
+
+  return (
+    <>
+      <HomeLayoutPageHeader
+        title={<Trans i18nKey={'common:lifeStyle.title'} />}
+        description=""
+      />
+
+      <PageBody>
+        <div className="mt-8">
+          {data.lifestyle.map(({ title, description, score }, index) => (
+            <React.Fragment key={`${index}-${title}`}>
+              <div
+                key={`${index}-${title}`}
+                className="flex items-center gap-2"
+              >
+                <h3>{title}</h3>
+                <Circle
+                  className={cn('text-success fill-success size-6', {
+                    'text-warning fill-warning': score === 1,
+                    'text-destructive fill-destructive': score === 2,
+                  })}
+                />
+              </div>
+              <p className="font-regular py-4">{description}</p>
+            </React.Fragment>
+          ))}
+        </div>
+      </PageBody>
+    </>
+  );
+}
+
+export default withI18n(LifeStylePage);