i18n

src/components/countdown.tsx

@@ -1,6 +1,7 @@
 import useNow from '@/hooks/use-now';
 import { Text, Group } from '@mantine/core';
 import { useMemo } from 'react';
+import { useLingui } from '@lingui/react/macro';
 import classes from './countdown.module.css';
 
 interface CountdownProps {
@@ -34,6 +35,7 @@ function calculateTimeLeft(targetDate: Date, currentTime = new Date()): TimeLeft
 const pad = (num: number) => num.toString().padStart(2, '0');
 
 export function Countdown({ date, label, color }: CountdownProps) {
+  const { t } = useLingui();
   const now = useNow();
   const timeLeft = useMemo(() => calculateTimeLeft(date, now), [date, now]);
 
@@ -45,7 +47,7 @@ export function Countdown({ date, label, color }: CountdownProps) {
 
   const prefix =
     timeLeft.days > 0
-      ? `${timeLeft.days}d ${pad(timeLeft.hours)}:${pad(timeLeft.minutes)}:`
+      ? `${t`${timeLeft.days}d`} ${pad(timeLeft.hours)}:${pad(timeLeft.minutes)}:`
       : `${pad(timeLeft.hours)}:${pad(timeLeft.minutes)}:`;
 
   return (