i18n

src/features/tournaments/components/upcoming-tournament/index.tsx

@@ -1,4 +1,5 @@
 import { Suspense, useMemo } from "react";
+import { Trans, useLingui } from "@lingui/react/macro";
 import { Tournament } from "../../types";
 import { useAuth } from "@/contexts/auth-context";
 import { Box, Divider, Paper, SimpleGrid, Stack, Text } from "@mantine/core";
@@ -27,6 +28,7 @@ const UpcomingTournament: React.FC<{ tournament: Tournament }> = ({
 }) => {
   const { user, roles } = useAuth();
   const navigate = useNavigate();
+  const { t } = useLingui();
 
   const isAdmin = useMemo(() => roles.includes("Admin"), [roles]);
   const userTeam = useMemo(
@@ -63,7 +65,7 @@ const UpcomingTournament: React.FC<{ tournament: Tournament }> = ({
 
       <Box>
         <SectionHeading
-          label="Enrollment"
+          label={t`Enrollment`}
           action={
             isEnrollmentOpen ? (
               <Countdown date={enrollmentDeadline} />
@@ -75,7 +77,7 @@ const UpcomingTournament: React.FC<{ tournament: Tournament }> = ({
             <Stack gap="sm">
               {!isUserEnrolled && !isEnrollmentOpen && (
                 <Text fw={600} c="dimmed" size="sm">
-                  Enrollment has been closed for this tournament.
+                  <Trans>Enrollment has been closed for this tournament.</Trans>
                 </Text>
               )}
 
@@ -87,7 +89,7 @@ const UpcomingTournament: React.FC<{ tournament: Tournament }> = ({
                         tournamentId={tournament.id}
                         onSubmit={handleSubmit}
                       />
-                      <Divider my={0} label="or" />
+                      <Divider my={0} label={t`or`} />
                     </>
                   )}
                   <EnrollFreeAgent
@@ -138,14 +140,14 @@ const UpcomingTournament: React.FC<{ tournament: Tournament }> = ({
           <SimpleGrid cols={3} spacing="sm" verticalSpacing="sm">
             {isAdmin && (
               <NavTile
-                label="Manage"
+                label={t`Manage`}
                 Icon={UsersIcon}
                 onClick={() =>
                   navigate({ to: `/admin/tournaments/${tournament.id}` })
                 }
               />
             )}
-            <NavTile label="Bracket" Icon={TreeStructureIcon} disabled />
+            <NavTile label={t`Bracket`} Icon={TreeStructureIcon} disabled />
             {tournament.regional === true ? (
               (tournament.teams && tournament.teams.length > 0) ? (
                 <TeamListButton teams={tournament.teams} isRegional={true} />