changes the locales structure making english strings as keys

Previously they were stored according to the format
'src/locales/{{lng}}/translation.json'
and after review, they are stored according to the following:
'src/locales/{{lng}}.json'
Also, the english strings are used as the keys/identifier in
translation files to make it easy to understand and implement.

Signed-off-by: Sudhanshu Gautam <me@sudhanshug.com>

src/components/header.js

@@ -28,10 +28,10 @@ export default function Header() {
   return (
     <AppBar position="static">
       <Toolbar>
-        <Typography edge="start" variant="h6">OpenWrt Firmware Selector Wizard</Typography>
+        <Typography edge="start" variant="h6">{t('OpenWrt Firmware Selector Wizard')}</Typography>
         <div style={{flexGrow: 1}}></div>
         <Button aria-describedby={id} color="secondary"  variant="contained" onClick={openChangeLanguagePopper}>
-          {t('components.changeLanguage')} &nbsp;
+          {t('Change Language')} &nbsp;
           <LanguageIcon />
         </Button>
         <Popper 
@@ -53,8 +53,8 @@ export default function Header() {
                     value={value}
                     onChange={changeLanguage}
                   >
-                    <FormControlLabel value="en" control={<Radio />} label="English" />
-                    <FormControlLabel value="de" control={<Radio />} label="German" />
+                    <FormControlLabel value="en" control={<Radio />} label={t('English')} />
+                    <FormControlLabel value="de" control={<Radio />} label={t('German')} />
                   </RadioGroup>
                 </FormControl>
               </Paper>

src/containers/home/home.js

@@ -140,17 +140,17 @@ class Home extends React.Component {
       <Container className="home-container" onClick={this.toggleSearchIfIntended}>
         <Paper className="home-container-paper">
           <Typography variant="h5">
-            {this.props.t('appIntro.head')}
+            {this.props.t('Download OpenWrt firmware for your device!')}
           </Typography>
           <Typography>
-            {this.props.t('appIntro.para')}
+            {this.props.t('Please use the input below to download firmware for your device!')}
           </Typography>
           <br />
           <div className="search-container">
             <FormControl fullWidth>
               <SearchTextField
                 id="outlined-adornment-search-devices"
-                labeltext={this.props.t('components.search.label')}
+                labeltext={this.props.t('Search...')}
                 value={this.state.query}
                 onChange={this.search}
                 onClick={this.search}
@@ -186,7 +186,7 @@ class Home extends React.Component {
             (this.state.searchResults.length === 0 && this.state.showSearch) && (
               <Paper elevation={4} className="search-results">
                 <ListItem>
-                  <ListItemText primary={this.props.t('components.search.noResults')}></ListItemText>
+                  <ListItemText primary={this.props.t('No results')}></ListItemText>
                 </ListItem>
               </Paper>
             )
@@ -196,17 +196,17 @@ class Home extends React.Component {
             <table className="device-table">
               <tbody>
                 <tr>
-                  <td>{this.props.t('table.model')}</td>
+                  <td>{this.props.t('Model')}</td>
                   <td>{this.state.device.model}</td>
                 </tr>
                 <tr>
-                  <td>{this.props.t('table.vendor')}</td>
+                  <td>{this.props.t('Vendor')}</td>
                   <td>{this.state.device.vendor}</td>
                 </tr>
                 { 
                   this.state.device.variant === null || this.state.device.variant === '' ? '' : (
                     <tr>
-                      <td>{this.props.t('table.variant')}</td>
+                      <td>{this.props.t('Variant')}</td>
                       <td>{this.state.device.variant}</td>
                     </tr>
                   )

src/i18n.js

@@ -1,8 +1,8 @@
 import i18n from 'i18next';
 import { initReactI18next } from 'react-i18next';
 import LanguageDetector from 'i18next-browser-languagedetector';
-import translationEN from './locales/en/translation.json';
-import translationDE from './locales/de/translation.json';
+import translationEN from './locales/en.json';
+import translationDE from './locales/de.json';
 
 
 const resources = {

src/locales/de.json

@@ -0,0 +1,14 @@
+{
+    "English": "Englisch",
+    "German": "Deutsche",
+    "Submit": "Einreichen",
+    "Change Language": "Sprache ändern",
+    "Search your device": "Suchen Sie Ihr Gerät",
+    "No results": "Keine Ergebnisse",
+    "Model": "Modell",
+    "Vendor": "Verkäufer",
+    "Variant": "Variante",
+    "OpenWrt Firmware Selector Wizard": "OpenWrt Firmware Selector Wizard",
+    "Download OpenWrt firmware for your device!": "Laden Sie die OpenWrt-Firmware für Ihr Gerät herunter!",
+    "Please use the input below to download firmware for your device!": "Bitte benutzen Sie den unten stehenden Eingang, um die Firmware für Ihr Gerät herunterzuladen!"
+}

src/locales/de/translation.json

@@ -1,24 +0,0 @@
-{
-    "title": "OpenWrt Firmware Selector Wizard",
-    "appIntro": {
-        "head": "Laden Sie die OpenWrt-Firmware für Ihr Gerät herunter!",
-        "para": "Bitte benutzen Sie den unten stehenden Eingang, um die Firmware für Ihr Gerät herunterzuladen!"
-    },
-    "components": {
-        "submit": "einreichen",
-        "changeLanguage": "Sprache ändern",
-        "select": {
-            "placeholder": "Wählen...",
-            "noOptions": "Keine Optionen"
-        },
-        "search": {
-            "label": "Suchen Sie Ihr Gerät",
-            "noResults": "Keine Ergebnisse"
-        }
-    },
-    "table": {
-        "model": "Modell",
-        "vendor": "Verkäufer",
-        "variant": "Variante"
-    }
-}

src/locales/en.json

@@ -0,0 +1,14 @@
+{
+    "English": "English",
+    "German": "German",
+    "Submit": "Submit",
+    "Change Language": "Change Language",
+    "Search your device": "Search your device",
+    "No results": "No results",
+    "Model": "Model",
+    "Vendor": "Vendor",
+    "Variant": "Variant",
+    "OpenWrt Firmware Selector Wizard": "OpenWrt Firmware Selector Wizard",
+    "Download OpenWrt firmware for your device!": "Download OpenWrt firmware for your device!",
+    "Please use the input below to download firmware for your device!": "Please use the input below to download firmware for your device!"
+}

src/locales/en/translation.json

@@ -1,24 +0,0 @@
-{
-    "title": "OpenWrt Firmware Selector Wizard",
-    "appIntro": {
-        "head": "Download OpenWrt firmware for your device!",
-        "para": "Please use the input below to download firmware for your device!"
-    },
-    "components": {
-        "submit": "Submit",
-        "changeLanguage": "Change Language",
-        "select": {
-            "placeholder": "Select...",
-            "noOptions": "No options"
-        },
-        "search": {
-            "label": "Search your device",
-            "noResults": "No results"
-        }
-    },
-    "table": {
-        "model": "Model",
-        "vendor": "Vendor",
-        "variant": "Variant"
-    }
-}