Internationalize system theme mode

public/locales/en.json

@@ -404,6 +404,7 @@
       "client": "Client",
       "close": "Close",
       "copied_clipboard": "Copied to clipboard",
+      "dark": "Dark",
       "default": "Default",
       "desktop": "Desktop",
       "disabled": "Disabled",
@@ -419,6 +420,7 @@
       "horizontal": "Horizontal",
       "info": "Information",
       "left": "Left",
+      "light": "Light",
       "links": "Links",
       "load_in_progress": "Still loading required data…",
       "loading": "Loading…",
@@ -439,6 +441,7 @@
       "standard": "Standard",
       "started": "Started",
       "success": "Success",
+      "system": "System",
       "type": "Type",
       "unknown": "Unknown",
       "username": "Username",

src/modules/settings/screens/Appearance.tsx

@@ -103,13 +103,13 @@ export const Appearance = () => {
                     }}
                 >
                     <MenuItem key={ThemeMode.SYSTEM} value={ThemeMode.SYSTEM}>
-                        System
+                        {t('global.label.system')}
                     </MenuItem>
                     <MenuItem key={ThemeMode.DARK} value={ThemeMode.DARK}>
-                        Dark
+                        {t('global.label.dark')}
                     </MenuItem>
                     <MenuItem key={ThemeMode.LIGHT} value={ThemeMode.LIGHT}>
-                        Light
+                        {t('global.label.light')}
                     </MenuItem>
                 </Select>
             </ListItem>