MED-151: add profile view and working smoking dashboard card (#71)

* MED-151: add profile view and working smoking dashboard card

* update zod

* move some components to shared

* move some components to shared

* remove console.logs

* remove unused password form components

* only check null for variant

* use pathsconfig

app/home/(user)/settings/page.tsx

@@ -1,28 +1,11 @@
-import { use } from 'react';
-
-import { PersonalAccountSettingsContainer } from '@kit/accounts/personal-account-settings';
-import {
-  authConfig,
-  featureFlagsConfig,
-  pathsConfig,
-} from '@kit/shared/config';
 import { PageBody } from '@kit/ui/page';
 
 import { createI18nServerInstance } from '~/lib/i18n/i18n.server';
-import { requireUserInServerComponent } from '~/lib/server/require-user-in-server-component';
 import { withI18n } from '~/lib/i18n/with-i18n';
 
-const features = {
-  enableAccountDeletion: featureFlagsConfig.enableAccountDeletion,
-  enablePasswordUpdate: authConfig.providers.password,
-};
-
-const callbackPath = pathsConfig.auth.callback;
-const accountHomePath = pathsConfig.app.accountHome;
-
-const paths = {
-  callback: callbackPath + `?next=${accountHomePath}`,
-};
+import { loadCurrentUserAccount } from '../_lib/server/load-user-account';
+import AccountSettingsForm from './_components/account-settings-form';
+import SettingsSectionHeader from './_components/settings-section-header';
 
 export const generateMetadata = async () => {
   const i18n = await createI18nServerInstance();
@@ -33,17 +16,18 @@ export const generateMetadata = async () => {
   };
 };
 
-function PersonalAccountSettingsPage() {
-  const user = use(requireUserInServerComponent());
-
+async function PersonalAccountSettingsPage() {
+  const account = await loadCurrentUserAccount();
   return (
     <PageBody>
-      <div className={'flex w-full flex-1 flex-col lg:max-w-2xl'}>
-        <PersonalAccountSettingsContainer
-          userId={user.id}
-          features={features}
-          paths={paths}
-        />
+      <div className="mx-auto w-full bg-white p-6">
+        <div className="space-y-6">
+          <SettingsSectionHeader
+            titleKey="account:accountTabLabel"
+            descriptionKey="account:accountTabDescription"
+          />
+          <AccountSettingsForm account={account} />
+        </div>
       </div>
     </PageBody>
   );