i18n

src/features/core/hooks/use-links.ts

@@ -1,27 +1,30 @@
 import { HouseIcon, RankingIcon, ShieldIcon, TrophyIcon, UserCircleIcon } from "@phosphor-icons/react";
 import { useMemo } from "react";
+import { useLingui } from "@lingui/react/macro";
 
-export const useLinks = (userId: string | undefined, roles: string[]) =>
-  useMemo(() => {
+export const useLinks = (userId: string | undefined, roles: string[]) => {
+  const { t } = useLingui();
+
+  return useMemo(() => {
     const links = [
       {
-        label: 'Home',
+        label: t`Home`,
         href: '/',
         Icon: HouseIcon
       },
       {
-        label: 'Statistics',
+        label: t`Statistics`,
         href: '/stats',
         Icon: RankingIcon
       },
       {
-        label: 'Tournaments',
+        label: t`Tournaments`,
         href: '/tournaments',
         Icon: TrophyIcon,
         exclude: ['/admin/tournaments']
       },
       {
-        label: 'Profile',
+        label: t`Profile`,
         href: `/profile/${userId}`,
         Icon: UserCircleIcon,
         include: ['/settings']
@@ -30,11 +33,12 @@ export const useLinks = (userId: string | undefined, roles: string[]) =>
 
     if (roles.includes('Admin')) {
       links.push({
-        label: 'Admin',
+        label: t`Admin`,
         href: '/admin',
         Icon: ShieldIcon
       })
     }
 
     return links;
-  }, [userId, roles]);
+  }, [userId, roles, t]);
+};