feat(MED-122): use <Trans> instead of t()

app/select-package/page.tsx

@@ -2,6 +2,7 @@ import Link from 'next/link';
 
 import { CaretRightIcon } from '@radix-ui/react-icons';
 import { Scale } from 'lucide-react';
+import { Trans } from '@kit/ui/trans';
 
 import { Button } from '@kit/ui/button';
 
@@ -22,17 +23,17 @@ export const generateMetadata = async () => {
 };
 
 async function SelectPackagePage() {
-  const { t } = await createI18nServerInstance();
-
   return (
     <div className="container mx-auto my-24 flex flex-col items-center space-y-12">
       <MedReportLogo />
       <div className="space-y-3 text-center">
-        <h3>{t('marketing:selectPackage')}</h3>
+        <h3>
+          <Trans i18nKey={'marketing:selectPackage'} />
+        </h3>
         <ComparePackagesModal
           triggerElement={
             <Button variant="secondary" className="gap-2">
-              {t('marketing:comparePackages')}
+              <Trans i18nKey={'marketing:comparePackages'} />
               <Scale className="size-4 stroke-[1.5px]" />
             </Button>
           }
@@ -41,7 +42,7 @@ async function SelectPackagePage() {
       <SelectAnalysisPackages />
       <Link href={pathsConfig.app.home}>
         <Button variant="secondary" className="align-center">
-          {t('marketing:notInterestedInAudit')}{' '}
+          <Trans i18nKey={'marketing:notInterestedInAudit'} />{' '}
           <CaretRightIcon className="size-4" />
         </Button>
       </Link>