feat(MED-97): update benefit stats view in dashboards

app/home/[account]/_components/team-account-statistics.tsx

@@ -14,28 +14,19 @@ import { createPath, pathsConfig } from '@kit/shared/config';
 import { Card } from '@kit/ui/card';
 import { Trans } from '@kit/ui/makerkit/trans';
 import { Button } from '@kit/ui/shadcn/button';
-import { Calendar, DateRange } from '@kit/ui/shadcn/calendar';
-import {
-  Popover,
-  PopoverContent,
-  PopoverTrigger,
-} from '@kit/ui/shadcn/popover';
+import { DateRange } from '@kit/ui/shadcn/calendar';
 
+import { AccountBenefitStatistics } from '../_lib/server/load-team-account-benefit-statistics';
 import TeamAccountBenefitStatistics from './team-account-benefit-statistics';
 import TeamAccountHealthDetails from './team-account-health-details';
+import type { Account, AccountParams, BmiThresholds } from '@/packages/features/accounts/src/types/accounts';
 
 export interface TeamAccountStatisticsProps {
-  teamAccount: Database['medreport']['Tables']['accounts']['Row'];
-  memberParams: Pick<
-    Database['medreport']['Tables']['account_params']['Row'],
-    'weight' | 'height'
-  >[];
-  bmiThresholds: Omit<
-    Database['medreport']['Tables']['bmi_thresholds']['Row'],
-    'id'
-  >[];
+  teamAccount: Account;
+  memberParams: Pick<AccountParams, 'weight' | 'height'>[];
+  bmiThresholds: Omit<BmiThresholds, 'id'>[];
   members: Database['medreport']['Functions']['get_account_members']['Returns'];
-  companyParams: Database['medreport']['Tables']['company_params']['Row'];
+  accountBenefitStatistics: AccountBenefitStatistics;
 }
 
 export default function TeamAccountStatistics({
@@ -43,11 +34,12 @@ export default function TeamAccountStatistics({
   memberParams,
   bmiThresholds,
   members,
-  companyParams,
+  accountBenefitStatistics,
 }: TeamAccountStatisticsProps) {
+  const currentDate = new Date();
   const [date, setDate] = useState<DateRange | undefined>({
-    from: new Date(),
-    to: new Date(),
+    from: new Date(currentDate.getFullYear(), currentDate.getMonth(), 1),
+    to: new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0),
   });
   const {
     i18n: { language },
@@ -66,28 +58,16 @@ export default function TeamAccountStatistics({
           />
         </h4>
 
-        <Popover>
-          <PopoverTrigger asChild>
-            <Button variant="outline" data-empty={!date}>
-              <CalendarIcon />
-              {date?.from && date?.to ? (
-                `${format(date.from, 'd MMMM yyyy', dateFormatOptions)} - ${format(date.to, 'd MMMM yyyy', dateFormatOptions)}`
-              ) : (
-                <span>
-                  <Trans i18nKey="common:formField.selectDate" />
-                </span>
-              )}
-            </Button>
-          </PopoverTrigger>
-          <PopoverContent className="w-auto p-0">
-            <Calendar
-              mode="range"
-              selected={date}
-              onSelect={setDate}
-              locale={language === 'et' ? et : enGB}
-            />
-          </PopoverContent>
-        </Popover>
+        <Button variant="outline" data-empty={!date}>
+          <CalendarIcon />
+          {date?.from && date?.to ? (
+            `${format(date.from, 'd MMMM yyyy', dateFormatOptions)} - ${format(date.to, 'd MMMM yyyy', dateFormatOptions)}`
+          ) : (
+            <span>
+              <Trans i18nKey="common:formField.selectDate" />
+            </span>
+          )}
+        </Button>
       </div>
 
       <div
@@ -95,11 +75,7 @@ export default function TeamAccountStatistics({
           'animate-in fade-in flex flex-col space-y-4 pb-36 duration-500'
         }
       >
-        <TeamAccountBenefitStatistics
-          employeeCount={members.length}
-          accountSlug={teamAccount.slug || ''}
-          companyParams={companyParams}
-        />
+        <TeamAccountBenefitStatistics accountBenefitStatistics={accountBenefitStatistics} />
 
         <h5 className="mt-4 mb-2">
           <Trans i18nKey="teams:home.healthDetails" />
@@ -148,7 +124,7 @@ export default function TeamAccountStatistics({
                 redirect(
                   createPath(
                     pathsConfig.app.accountBilling,
-                    teamAccount.slug || '',
+                    teamAccount.slug!,
                   ),
                 )
               }