feat(i18n): add new translations for billing plan details

Add new translation keys for billing plan details in English, Spanish, and Portuguese to support localized text for credit plan, custom plan, seat purchase, and contact sales. Also, update the `current-plan-details.tsx` component to use these translations for better internationalization support.

worklenz-frontend/public/locales/en/admin-center/current-bill.json

@@ -109,5 +109,13 @@
   "expiredDaysAgo": "{{days}} days ago",
   
   "continueWith": "Continue with {{plan}}",
-  "changeToPlan": "Change to {{plan}}"
+  "changeToPlan": "Change to {{plan}}",
+  "creditPlan": "Credit Plan",
+  "customPlan": "Custom Plan",
+  "planValidTill": "Your plan is valid till {{date}}",
+  "purchaseSeatsText": "To continue, you'll need to purchase additional seats.",
+  "currentSeatsText": "You currently have {{seats}} seats available.",
+  "selectSeatsText": "Please select the number of additional seats to purchase.",
+  "purchase": "Purchase",
+  "contactSales": "Contact sales"
 }

worklenz-frontend/public/locales/es/admin-center/current-bill.json

@@ -101,5 +101,13 @@
   
   "expirestoday": "hoy",
   "expirestomorrow": "mañana",
-  "expiredDaysAgo": "hace {{days}} días"
+  "expiredDaysAgo": "hace {{days}} días",
+  "creditPlan": "Plan de Crédito",
+  "customPlan": "Plan Personalizado",
+  "planValidTill": "Su plan es válido hasta {{date}}",
+  "purchaseSeatsText": "Para continuar, deberá comprar asientos adicionales.",
+  "currentSeatsText": "Actualmente tiene {{seats}} asientos disponibles.",
+  "selectSeatsText": "Seleccione el número de asientos adicionales a comprar.",
+  "purchase": "Comprar",
+  "contactSales": "Contactar ventas"
 }

worklenz-frontend/public/locales/pt/admin-center/current-bill.json

@@ -101,5 +101,13 @@
   
   "expirestoday": "hoje",
   "expirestomorrow": "amanhã",
-  "expiredDaysAgo": "há {{days}} dias"
+  "expiredDaysAgo": "há {{days}} dias",
+  "creditPlan": "Plano de Crédito",
+  "customPlan": "Plano Personalizado",
+  "planValidTill": "Seu plano é válido até {{date}}",
+  "purchaseSeatsText": "Para continuar, você precisará comprar assentos adicionais.",
+  "currentSeatsText": "Atualmente você tem {{seats}} assentos disponíveis.",
+  "selectSeatsText": "Selecione o número de assentos adicionais para comprar.",
+  "purchase": "Comprar",
+  "contactSales": "Fale com vendas"
 }

worklenz-frontend/src/components/admin-center/billing/current-plan-details/current-plan-details.tsx

@@ -246,7 +246,7 @@ const CurrentPlanDetails = () => {
 
   const renderFreePlan = () => (
     <Flex vertical>
-      <Typography.Text strong>Free Plan</Typography.Text>
+      <Typography.Text strong>{t('freePlan')}</Typography.Text>
       <Typography.Text>
         <br />-{' '}
         {freePlanSettings?.team_member_limit === 0
@@ -309,16 +309,16 @@ const CurrentPlanDetails = () => {
 
   const renderCreditSubscriptionInfo = () => {
     return <Flex vertical>
-      <Typography.Text strong>Credit Plan</Typography.Text>
+      <Typography.Text strong>{t('creditPlan','Credit Plan')}</Typography.Text>
     </Flex>
-  };  
+  };
 
   const renderCustomSubscriptionInfo = () => {
     return <Flex vertical>
-      <Typography.Text strong>Custom Plan</Typography.Text>
-      <Typography.Text>Your plan is valid till {billingInfo?.valid_till_date}</Typography.Text>
+      <Typography.Text strong>{t('customPlan','Custom Plan')}</Typography.Text>
+      <Typography.Text>{t('planValidTill','Your plan is valid till {{date}}',{date: billingInfo?.valid_till_date})}</Typography.Text>
     </Flex>
-  }; 
+  };
 
   return (
     <Card
@@ -381,15 +381,15 @@ const CurrentPlanDetails = () => {
         >
           <Flex vertical gap="middle" style={{ marginTop: '8px' }}>
             <Typography.Paragraph style={{ fontSize: '16px', margin: '0 0 16px 0', fontWeight: 500 }}>
-              To continue, you'll need to purchase additional seats.
+              {t('purchaseSeatsText','To continue, you\'ll need to purchase additional seats.')}
             </Typography.Paragraph>
             
             <Typography.Paragraph style={{ margin: '0 0 16px 0' }}>
-              You currently have {billingInfo?.total_seats} seats available.
+              {t('currentSeatsText','You currently have {{seats}} seats available.',{seats: billingInfo?.total_seats})}
             </Typography.Paragraph>
             
             <Typography.Paragraph style={{ margin: '0 0 24px 0' }}>
-              Please select the number of additional seats to purchase.
+              {t('selectSeatsText','Please select the number of additional seats to purchase.')}
             </Typography.Paragraph>
             
             <div style={{ marginBottom: '24px' }}>
@@ -416,14 +416,14 @@ const CurrentPlanDetails = () => {
                     borderRadius: '2px'
                   }}
                 >
-                  Purchase
+                  {t('purchase','Purchase')}
                 </Button>
               ) : (
                 <Button 
                   type="primary" 
                   size="middle"
                 >
-                  Contact sales
+                  {t('contactSales','Contact sales')}
                 </Button>
               )}
             </Flex>