feat: update AppLogo component to use pathsConfig for home navigation
This commit is contained in:
@@ -8,7 +8,10 @@ import { z } from 'zod';
|
|||||||
|
|
||||||
import { UserWorkspaceContextProvider } from '@kit/accounts/components';
|
import { UserWorkspaceContextProvider } from '@kit/accounts/components';
|
||||||
import { AppLogo } from '@kit/shared/components/app-logo';
|
import { AppLogo } from '@kit/shared/components/app-logo';
|
||||||
import { personalAccountNavigationConfig } from '@kit/shared/config';
|
import {
|
||||||
|
pathsConfig,
|
||||||
|
personalAccountNavigationConfig,
|
||||||
|
} from '@kit/shared/config';
|
||||||
import { Page, PageMobileNavigation, PageNavigation } from '@kit/ui/page';
|
import { Page, PageMobileNavigation, PageNavigation } from '@kit/ui/page';
|
||||||
import { SidebarProvider } from '@kit/ui/shadcn-sidebar';
|
import { SidebarProvider } from '@kit/ui/shadcn-sidebar';
|
||||||
|
|
||||||
@@ -92,7 +95,7 @@ function MobileNavigation({
|
|||||||
}) {
|
}) {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<AppLogo />
|
<AppLogo href={pathsConfig.app.home} />
|
||||||
|
|
||||||
<HomeMobileNavigation workspace={workspace} cart={cart} />
|
<HomeMobileNavigation workspace={workspace} cart={cart} />
|
||||||
</>
|
</>
|
||||||
|
|||||||
@@ -1,27 +1,35 @@
|
|||||||
import Link from 'next/link';
|
import Link from 'next/link';
|
||||||
|
|
||||||
|
import { createI18nServerInstance } from '@/lib/i18n/i18n.server';
|
||||||
|
import { pathsConfig } from '@/packages/shared/src/config';
|
||||||
|
import { formatCurrency } from '@/packages/shared/src/utils';
|
||||||
|
import { SIDEBAR_WIDTH_PROPERTY } from '@/packages/ui/src/shadcn/constants';
|
||||||
|
import { StoreCart } from '@medusajs/types';
|
||||||
import { ShoppingCart } from 'lucide-react';
|
import { ShoppingCart } from 'lucide-react';
|
||||||
|
|
||||||
import { Trans } from '@kit/ui/trans';
|
|
||||||
import { AppLogo } from '@kit/shared/components/app-logo';
|
import { AppLogo } from '@kit/shared/components/app-logo';
|
||||||
import { ProfileAccountDropdownContainer } from '@kit/shared/components/personal-account-dropdown-container';
|
import { ProfileAccountDropdownContainer } from '@kit/shared/components/personal-account-dropdown-container';
|
||||||
import { Search } from '@kit/shared/components/ui/search';
|
import { Search } from '@kit/shared/components/ui/search';
|
||||||
import { SIDEBAR_WIDTH_PROPERTY } from '@/packages/ui/src/shadcn/constants';
|
|
||||||
import { Button } from '@kit/ui/button';
|
import { Button } from '@kit/ui/button';
|
||||||
|
import { Card } from '@kit/ui/shadcn/card';
|
||||||
|
import { Trans } from '@kit/ui/trans';
|
||||||
|
|
||||||
import { UserNotifications } from '../_components/user-notifications';
|
import { UserNotifications } from '../_components/user-notifications';
|
||||||
import { type UserWorkspace } from '../_lib/server/load-user-workspace';
|
import { type UserWorkspace } from '../_lib/server/load-user-workspace';
|
||||||
import { StoreCart } from '@medusajs/types';
|
|
||||||
import { formatCurrency } from '@/packages/shared/src/utils';
|
|
||||||
import { createI18nServerInstance } from '@/lib/i18n/i18n.server';
|
|
||||||
|
|
||||||
export async function HomeMenuNavigation(props: { workspace: UserWorkspace, cart: StoreCart | null }) {
|
export async function HomeMenuNavigation(props: {
|
||||||
|
workspace: UserWorkspace;
|
||||||
|
cart: StoreCart | null;
|
||||||
|
}) {
|
||||||
const { language } = await createI18nServerInstance();
|
const { language } = await createI18nServerInstance();
|
||||||
const { workspace, user, accounts } = props.workspace;
|
const { workspace, user, accounts } = props.workspace;
|
||||||
const totalValue = props.cart?.total ? formatCurrency({
|
const totalValue = props.cart?.total
|
||||||
currencyCode: props.cart.currency_code,
|
? formatCurrency({
|
||||||
locale: language,
|
currencyCode: props.cart.currency_code,
|
||||||
value: props.cart.total,
|
locale: language,
|
||||||
}) : 0;
|
value: props.cart.total,
|
||||||
|
})
|
||||||
|
: 0;
|
||||||
|
|
||||||
const cartItemsCount = props.cart?.items?.length ?? 0;
|
const cartItemsCount = props.cart?.items?.length ?? 0;
|
||||||
const hasCartItems = cartItemsCount > 0;
|
const hasCartItems = cartItemsCount > 0;
|
||||||
@@ -29,8 +37,7 @@ export async function HomeMenuNavigation(props: { workspace: UserWorkspace, cart
|
|||||||
return (
|
return (
|
||||||
<div className={'flex w-full flex-1 items-center justify-between gap-3'}>
|
<div className={'flex w-full flex-1 items-center justify-between gap-3'}>
|
||||||
<div className={`flex items-center ${SIDEBAR_WIDTH_PROPERTY}`}>
|
<div className={`flex items-center ${SIDEBAR_WIDTH_PROPERTY}`}>
|
||||||
<AppLogo />
|
<AppLogo href={pathsConfig.app.home} />
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<Search
|
<Search
|
||||||
className="flex grow"
|
className="flex grow"
|
||||||
@@ -38,15 +45,27 @@ export async function HomeMenuNavigation(props: { workspace: UserWorkspace, cart
|
|||||||
/>
|
/>
|
||||||
|
|
||||||
<div className="flex items-center justify-end gap-3">
|
<div className="flex items-center justify-end gap-3">
|
||||||
|
<Card className="px-6 py-2">
|
||||||
|
<span>€ {Number(0).toFixed(2).replace('.', ',')}</span>
|
||||||
|
</Card>
|
||||||
{hasCartItems && (
|
{hasCartItems && (
|
||||||
<Button className='relative px-4 py-2 h-10 border-1 mr-0 cursor-pointer' variant='ghost'>
|
<Button
|
||||||
<span className='flex items-center text-nowrap'>{totalValue}</span>
|
className="relative mr-0 h-10 cursor-pointer border-1 px-4 py-2"
|
||||||
|
variant="ghost"
|
||||||
|
>
|
||||||
|
<span className="flex items-center text-nowrap">{totalValue}</span>
|
||||||
</Button>
|
</Button>
|
||||||
)}
|
)}
|
||||||
<Link href='/home/cart'>
|
<Link href="/home/cart">
|
||||||
<Button variant="ghost" className='relative px-4 py-2 h-10 border-1 mr-0 cursor-pointer' >
|
<Button
|
||||||
|
variant="ghost"
|
||||||
|
className="relative mr-0 h-10 cursor-pointer border-1 px-4 py-2"
|
||||||
|
>
|
||||||
<ShoppingCart className="stroke-[1.5px]" />
|
<ShoppingCart className="stroke-[1.5px]" />
|
||||||
<Trans i18nKey="common:shoppingCartCount" values={{ count: cartItemsCount }} />
|
<Trans
|
||||||
|
i18nKey="common:shoppingCartCount"
|
||||||
|
values={{ count: cartItemsCount }}
|
||||||
|
/>
|
||||||
</Button>
|
</Button>
|
||||||
</Link>
|
</Link>
|
||||||
<UserNotifications userId={user.id} />
|
<UserNotifications userId={user.id} />
|
||||||
|
|||||||
@@ -1,6 +1,9 @@
|
|||||||
import { useMemo } from 'react';
|
import { useMemo } from 'react';
|
||||||
|
|
||||||
import { getTeamAccountSidebarConfig } from '@/packages/shared/src/config';
|
import {
|
||||||
|
getTeamAccountSidebarConfig,
|
||||||
|
pathsConfig,
|
||||||
|
} from '@/packages/shared/src/config';
|
||||||
|
|
||||||
import { AppLogo } from '@kit/shared/components/app-logo';
|
import { AppLogo } from '@kit/shared/components/app-logo';
|
||||||
import { ProfileAccountDropdownContainer } from '@kit/shared/components/personal-account-dropdown-container';
|
import { ProfileAccountDropdownContainer } from '@kit/shared/components/personal-account-dropdown-container';
|
||||||
@@ -47,7 +50,7 @@ export function TeamAccountNavigationMenu(props: {
|
|||||||
return (
|
return (
|
||||||
<div className={'flex w-full flex-1 justify-between'}>
|
<div className={'flex w-full flex-1 justify-between'}>
|
||||||
<div className={'flex items-center space-x-8'}>
|
<div className={'flex items-center space-x-8'}>
|
||||||
<AppLogo />
|
<AppLogo href={pathsConfig.app.home} />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className={'flex items-center justify-end gap-2 space-x-2.5'}>
|
<div className={'flex items-center justify-end gap-2 space-x-2.5'}>
|
||||||
|
|||||||
@@ -5,19 +5,21 @@ import { cookies } from 'next/headers';
|
|||||||
import { z } from 'zod';
|
import { z } from 'zod';
|
||||||
|
|
||||||
import { AppLogo } from '@kit/shared/components/app-logo';
|
import { AppLogo } from '@kit/shared/components/app-logo';
|
||||||
import { getTeamAccountSidebarConfig } from '@kit/shared/config';
|
import { getTeamAccountSidebarConfig, pathsConfig } from '@kit/shared/config';
|
||||||
import {
|
import {
|
||||||
CompanyGuard,
|
CompanyGuard,
|
||||||
TeamAccountWorkspaceContextProvider,
|
TeamAccountWorkspaceContextProvider,
|
||||||
} from '@kit/team-accounts/components';
|
} from '@kit/team-accounts/components';
|
||||||
import { Page, PageMobileNavigation, PageNavigation } from '@kit/ui/page';
|
import { Page, PageMobileNavigation, PageNavigation } from '@kit/ui/page';
|
||||||
import { SidebarProvider } from '@kit/ui/shadcn-sidebar';
|
import { SidebarProvider } from '@kit/ui/shadcn-sidebar';
|
||||||
|
|
||||||
|
import { withI18n } from '~/lib/i18n/with-i18n';
|
||||||
|
|
||||||
// local imports
|
// local imports
|
||||||
import { TeamAccountLayoutMobileNavigation } from './_components/team-account-layout-mobile-navigation';
|
import { TeamAccountLayoutMobileNavigation } from './_components/team-account-layout-mobile-navigation';
|
||||||
import { TeamAccountLayoutSidebar } from './_components/team-account-layout-sidebar';
|
import { TeamAccountLayoutSidebar } from './_components/team-account-layout-sidebar';
|
||||||
import { TeamAccountNavigationMenu } from './_components/team-account-navigation-menu';
|
import { TeamAccountNavigationMenu } from './_components/team-account-navigation-menu';
|
||||||
import { loadTeamWorkspace } from './_lib/server/team-account-workspace.loader';
|
import { loadTeamWorkspace } from './_lib/server/team-account-workspace.loader';
|
||||||
import { withI18n } from '~/lib/i18n/with-i18n';
|
|
||||||
|
|
||||||
type TeamWorkspaceLayoutProps = React.PropsWithChildren<{
|
type TeamWorkspaceLayoutProps = React.PropsWithChildren<{
|
||||||
params: Promise<{ account: string }>;
|
params: Promise<{ account: string }>;
|
||||||
@@ -66,7 +68,7 @@ function SidebarLayout({
|
|||||||
</PageNavigation>
|
</PageNavigation>
|
||||||
|
|
||||||
<PageMobileNavigation className={'flex items-center justify-between'}>
|
<PageMobileNavigation className={'flex items-center justify-between'}>
|
||||||
<AppLogo />
|
<AppLogo href={pathsConfig.app.home} />
|
||||||
|
|
||||||
<div className={'flex space-x-4'}>
|
<div className={'flex space-x-4'}>
|
||||||
<TeamAccountLayoutMobileNavigation
|
<TeamAccountLayoutMobileNavigation
|
||||||
@@ -109,7 +111,7 @@ function HeaderLayout({
|
|||||||
</PageNavigation>
|
</PageNavigation>
|
||||||
|
|
||||||
<PageMobileNavigation className={'flex items-center justify-between'}>
|
<PageMobileNavigation className={'flex items-center justify-between'}>
|
||||||
<AppLogo />
|
<AppLogo href={pathsConfig.app.home} />
|
||||||
|
|
||||||
<div className={'group-data-[mobile:hidden]'}>
|
<div className={'group-data-[mobile:hidden]'}>
|
||||||
<TeamAccountLayoutMobileNavigation
|
<TeamAccountLayoutMobileNavigation
|
||||||
@@ -134,7 +136,7 @@ function HeaderLayout({
|
|||||||
<PageMobileNavigation
|
<PageMobileNavigation
|
||||||
className={'flex items-center justify-between'}
|
className={'flex items-center justify-between'}
|
||||||
>
|
>
|
||||||
<AppLogo />
|
<AppLogo href={pathsConfig.app.home} />
|
||||||
<div className={'flex space-x-4'}>
|
<div className={'flex space-x-4'}>
|
||||||
<TeamAccountLayoutMobileNavigation
|
<TeamAccountLayoutMobileNavigation
|
||||||
userId={data.user.id}
|
userId={data.user.id}
|
||||||
|
|||||||
Reference in New Issue
Block a user