More translation in FR & PT (#436)

Related to #210

apps/builder/src/features/analytics/components/AnalyticsGraphContainer.tsx

@@ -11,12 +11,13 @@ import React from 'react'
 import { useAnswersCount } from '../hooks/useAnswersCount'
 import { StatsCards } from './StatsCards'
 import { ChangePlanModal } from '@/features/billing/components/ChangePlanModal'
-import { LimitReached } from '@/features/billing/types'
 import { Graph } from '@/features/graph/components/Graph'
 import { GraphProvider } from '@/features/graph/providers/GraphProvider'
 import { GroupsCoordinatesProvider } from '@/features/graph/providers/GroupsCoordinateProvider'
+import { useI18n } from '@/locales'
 
 export const AnalyticsGraphContainer = ({ stats }: { stats?: Stats }) => {
+  const t = useI18n()
   const { isOpen, onOpen, onClose } = useDisclosure()
   const { typebot, publishedTypebot } = useTypebot()
   const { showToast } = useToast()
@@ -69,7 +70,7 @@ export const AnalyticsGraphContainer = ({ stats }: { stats?: Stats }) => {
       <ChangePlanModal
         onClose={onClose}
         isOpen={isOpen}
-        type={LimitReached.ANALYTICS}
+        type={t('billing.limitMessage.analytics')}
       />
       <StatsCards stats={stats} pos="absolute" top={10} />
     </Flex>

apps/builder/src/features/analytics/components/StatsCards.tsx

@@ -1,3 +1,4 @@
+import { useScopedI18n } from '@/locales'
 import {
   GridProps,
   SimpleGrid,
@@ -22,12 +23,13 @@ export const StatsCards = ({
   stats,
   ...props
 }: { stats?: Stats } & GridProps) => {
+  const scopedT = useScopedI18n('analytics')
   const bg = useColorModeValue('white', 'gray.900')
 
   return (
     <SimpleGrid columns={{ base: 1, md: 3 }} spacing="6" {...props}>
       <Stat bgColor={bg} p="4" rounded="md" boxShadow="md">
-        <StatLabel>Views</StatLabel>
+        <StatLabel>{scopedT('viewsLabel')}</StatLabel>
         {stats ? (
           <StatNumber>{stats.totalViews}</StatNumber>
         ) : (
@@ -35,7 +37,7 @@ export const StatsCards = ({
         )}
       </Stat>
       <Stat bgColor={bg} p="4" rounded="md" boxShadow="md">
-        <StatLabel>Starts</StatLabel>
+        <StatLabel>{scopedT('startsLabel')}</StatLabel>
         {stats ? (
           <StatNumber>{stats.totalStarts}</StatNumber>
         ) : (
@@ -43,7 +45,7 @@ export const StatsCards = ({
         )}
       </Stat>
       <Stat bgColor={bg} p="4" rounded="md" boxShadow="md">
-        <StatLabel>Completion rate</StatLabel>
+        <StatLabel>{scopedT('completionRateLabel')}</StatLabel>
         {stats ? (
           <StatNumber>
             {computeCompletionRate(stats.totalCompleted, stats.totalStarts)}