feat(MED-97): fix display account name instead of slug

app/home/[account]/billing/_components/health-benefit-form.tsx

@@ -78,7 +78,7 @@ const HealthBenefitForm = ({
             <h4>
               <Trans
                 i18nKey="billing:pageTitle"
-                values={{ companyName: account.slug }}
+                values={{ companyName: account.name }}
               />
             </h4>
             <p className="text-muted-foreground text-sm">

app/home/[account]/members/page.tsx

@@ -22,7 +22,6 @@ import { Trans } from '@kit/ui/trans';
 import { createI18nServerInstance } from '~/lib/i18n/i18n.server';
 import { withI18n } from '~/lib/i18n/with-i18n';
 
-// local imports
 import { TeamAccountLayoutPageHeader } from '../_components/team-account-layout-page-header';
 import { loadMembersPageData } from './_lib/server/members-page.loader';
 
@@ -56,8 +55,7 @@ async function TeamAccountMembersPage({ params }: TeamAccountMembersPageProps) {
     <>
       <TeamAccountLayoutPageHeader
         title={<Trans i18nKey={'common:routes.members'} />}
-        description={<AppBreadcrumbs />}
-        account={account.slug}
+        description={<AppBreadcrumbs values={{ [account.slug]: account.name }}/>}
       />
 
       <PageBody>

app/home/[account]/settings/page.tsx

@@ -8,7 +8,6 @@ import { Trans } from '@kit/ui/trans';
 
 import { createI18nServerInstance } from '~/lib/i18n/i18n.server';
 
-// local imports
 import { TeamAccountLayoutPageHeader } from '../_components/team-account-layout-page-header';
 
 export const generateMetadata = async () => {
@@ -48,9 +47,8 @@ async function TeamAccountSettingsPage(props: TeamAccountSettingsPageProps) {
   return (
     <>
       <TeamAccountLayoutPageHeader
-        account={account.slug}
         title={<Trans i18nKey={'teams:settings.pageTitle'} />}
-        description={<AppBreadcrumbs />}
+        description={<AppBreadcrumbs values={{ [account.slug]: account.name }} />}
       />
 
       <PageBody>