feat: using static json file for text content in header component

cardano-foundation · Aug 18, 2023 · 8883d85 · 8883d85
1 parent 9eddb8b
commit 8883d85
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 9 deletions.
diff --git a/ui/summit-2023/src/components/common/Header/Header.tsx b/ui/summit-2023/src/components/common/Header/Header.tsx
@@ -15,6 +15,7 @@ import {
 } from '@mui/material';
 import MenuIcon from '@mui/icons-material/Menu';
 import './Header.scss';
+import {i18n} from '../../../i18n';
 
 const Header: React.FC = () => {
   const [drawerOpen, setDrawerOpen] = useState(false);
@@ -34,23 +35,23 @@ const Header: React.FC = () => {
       <ListItem
         onClick={() => setDrawerOpen(false)}
         component={NavLink}
-        to="/categorias"
+        to="/categories"
       >
-        Categories
+          {i18n.t('header.menu.categories')}
       </ListItem>
       <ListItem
         onClick={() => setDrawerOpen(false)}
         component={NavLink}
         to="/leaderboard"
       >
-        Leaderboard
+          {i18n.t('header.menu.leaderboard')}
       </ListItem>
       <ListItem
         onClick={() => setDrawerOpen(false)}
         component={NavLink}
         to="/user-guide"
       >
-        User Guide
+          {i18n.t('header.menu.userGuide')}
       </ListItem>
     </List>
   );
@@ -76,7 +77,7 @@ const Header: React.FC = () => {
                 className="connect-button"
                 color="inherit"
               >
-                Connect Wallet
+                  {i18n.t('header.connectWalletButton')}
               </Button>
             </>
           ) : (
@@ -97,27 +98,27 @@ const Header: React.FC = () => {
                   to="/categorias"
                   className="nav-link"
                 >
-                  Categories
+                    {i18n.t('header.menu.categories')}
                 </NavLink>
                 <NavLink
                   to="/leaderboard"
                   className="nav-link"
                 >
-                  Leaderboard
+                    {i18n.t('header.menu.leaderboard')}
                 </NavLink>
                 <NavLink
                   to="/user-guide"
                   className="nav-link"
                 >
-                  User Guide
+                    {i18n.t('header.menu.userGuide')}
                 </NavLink>
               </Grid>
               <Grid item>
                 <Button
                   className="connect-button"
                   color="inherit"
                 >
-                  Connect Wallet
+                    {i18n.t('header.connectWalletButton')}
                 </Button>
               </Grid>
             </Grid>

diff --git a/ui/summit-2023/src/i18n/locales/en/en.json b/ui/summit-2023/src/i18n/locales/en/en.json
@@ -1,4 +1,12 @@
 {
+  "header": {
+    "menu": {
+      "categories": "Categories",
+      "leaderboard": "Leaderboard",
+      "userGuide": "User Guide"
+    },
+    "connectWalletButton": "Connect Wallet"
+  },
   "landing": {
     "title": "Vote for the Cardano Summit Awards",
     "description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Tempor commodo ullamcorper a lacus vestibulum sed arcu non. Commodo elit at imperdiet dui accumsan.",