From 5f35714b67508d04ff1bd4e652d135f8064b67f1 Mon Sep 17 00:00:00 2001
From: "Kalle (Sendou)" <38327916+Sendouc@users.noreply.github.com>
Date: Tue, 8 Dec 2020 16:45:19 +0200
Subject: [PATCH] translate modes in mode selector

---
 components/plans/StageSelector.tsx | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/components/plans/StageSelector.tsx b/components/plans/StageSelector.tsx
index 92c292de7..766137c13 100644
--- a/components/plans/StageSelector.tsx
+++ b/components/plans/StageSelector.tsx
@@ -123,7 +123,7 @@ const StageSelector: React.FC<StageSelectorProps> = ({
         <>
           <HStack justifyContent="center" my={4}>
             {(["SZ", "TC", "RM", "CB"] as const).map((mode) => (
-              <Flex flexDir="column" alignItems="center">
+              <Flex key={mode} flexDir="column" alignItems="center">
                 <Box
                   style={{
                     filter:
@@ -135,7 +135,6 @@ const StageSelector: React.FC<StageSelectorProps> = ({
                   mb="-6px"
                 >
                   <ModeImage
-                    key={mode}
                     onClick={() => changeMode(mode)}
                     mode={mode}
                     size={32}
@@ -143,7 +142,7 @@ const StageSelector: React.FC<StageSelectorProps> = ({
                 </Box>
                 {currentBackground.mode === mode ? (
                   <SubText>
-                    <Trans>{mode}</Trans>
+                    <Trans>{i18n._(mode)}</Trans>
                   </SubText>
                 ) : (
                   <Box h={4} />