add translation keys (#246)

* Fix i18n tsc issue

"t" can return null by default.
This was already disabled in the config, but it had no effect on tsc.

* Fix translation in "DefaultNavBar"

key was missing and since this is a constant the translation wouldn't update in case the language got changed after first load.

* Enable typing for i18n translation keys

* Add translation keys

src/components/SourceCard.tsx

@@ -13,6 +13,7 @@ import CardContent from '@mui/material/CardContent';
 import Typography from '@mui/material/Typography';
 import { Box, styled } from '@mui/system';
 import React from 'react';
+import { useTranslation } from 'react-i18next';
 import { Link, useHistory } from 'react-router-dom';
 import { langCodeToName } from 'util/language';
 import useLocalStorage from 'util/useLocalStorage';
@@ -41,6 +42,8 @@ interface IProps {
 }
 
 const SourceCard: React.FC<IProps> = (props: IProps) => {
+    const { t } = useTranslation();
+
     const {
         source: { id, name, lang, iconUrl, supportsLatest, isNsfw },
     } = props;
@@ -110,18 +113,18 @@ const SourceCard: React.FC<IProps> = (props: IProps) => {
                         <MobileWidthButtons>
                             {supportsLatest && (
                                 <Button variant="outlined" onClick={(e) => redirectTo(e, `/sources/${id}/latest/`)}>
-                                    Latest
+                                    {t('global.button.latest')}
                                 </Button>
                             )}
                         </MobileWidthButtons>
                         <WiderWidthButtons>
                             {supportsLatest && (
                                 <Button component={Link} to={`/sources/${id}/latest/`} variant="outlined">
-                                    Latest
+                                    {t('global.button.latest')}
                                 </Button>
                             )}
                             <Button component={Link} to={`/sources/${id}/popular/`} variant="outlined">
-                                Browse
+                                {t('global.button.browse')}
                             </Button>
                         </WiderWidthButtons>
                     </>