B2B-36: add personal dashboard (#20)

* B2B-36: add dashboard cards

* B2B-36: add dashboard cards

* card variants, some improvements, gen db types

* add menus to home page

* update db types

* remove unnecessary card variant

---------

Co-authored-by: Helena <helena@Helenas-MacBook-Pro.local>

app/home/(user)/_components/home-menu-navigation.tsx

@@ -1,65 +1,43 @@
-import {
-  BorderedNavigationMenu,
-  BorderedNavigationMenuItem,
-} from '@kit/ui/bordered-navigation-menu';
-import { If } from '@kit/ui/if';
+import { ShoppingCart } from 'lucide-react';
+
+import { Button } from '@kit/ui/button';
+import { Trans } from '@kit/ui/trans';
+import { cn } from '@kit/ui/utils';
 
 import { AppLogo } from '~/components/app-logo';
 import { ProfileAccountDropdownContainer } from '~/components/personal-account-dropdown-container';
-import featuresFlagConfig from '~/config/feature-flags.config';
-import { personalAccountNavigationConfig } from '~/config/personal-account-navigation.config';
+import { Search } from '~/components/ui/search';
 
+import { SIDEBAR_WIDTH } from '../../../../packages/ui/src/shadcn/constants';
 // home imports
-import { HomeAccountSelector } from '../_components/home-account-selector';
 import { UserNotifications } from '../_components/user-notifications';
 import { type UserWorkspace } from '../_lib/server/load-user-workspace';
 
 export function HomeMenuNavigation(props: { workspace: UserWorkspace }) {
-  const { workspace, user, accounts } = props.workspace;
-
-  const routes = personalAccountNavigationConfig.routes.reduce<
-    Array<{
-      path: string;
-      label: string;
-      Icon?: React.ReactNode;
-      end?: boolean | ((path: string) => boolean);
-    }>
-  >((acc, item) => {
-    if ('children' in item) {
-      return [...acc, ...item.children];
-    }
-
-    if ('divider' in item) {
-      return acc;
-    }
-
-    return [...acc, item];
-  }, []);
+  const { workspace, user } = props.workspace;
 
   return (
-    <div className={'flex w-full flex-1 justify-between'}>
-      <div className={'flex items-center space-x-8'}>
+    <div className={'flex w-full flex-1 items-center justify-between gap-3'}>
+      <div className={cn('flex items-center', `w-[${SIDEBAR_WIDTH}]`)}>
         <AppLogo />
-
-        <BorderedNavigationMenu>
-          {routes.map((route) => (
-            <BorderedNavigationMenuItem {...route} key={route.path} />
-          ))}
-        </BorderedNavigationMenu>
       </div>
+      <Search
+        className="flex grow"
+        startElement={<Trans i18nKey="common:search" values={{ end: '...' }} />}
+      />
 
-      <div className={'flex justify-end space-x-2.5'}>
+      <div className="flex items-center justify-end gap-3">
+        <Button variant="outline">
+          <ShoppingCart className="stroke-[1.5px]" />
+          <Trans i18nKey="common:shoppingCart" /> (0)
+        </Button>
         <UserNotifications userId={user.id} />
 
-        <If condition={featuresFlagConfig.enableTeamAccounts}>
-          <HomeAccountSelector userId={user.id} accounts={accounts} />
-        </If>
-
         <div>
           <ProfileAccountDropdownContainer
             user={user}
             account={workspace}
-            showProfileName={false}
+            showProfileName
           />
         </div>
       </div>