From d16d842fa3c37b21dc06ce1d0ca329862ce7d931 Mon Sep 17 00:00:00 2001
From: Cohen Erickson <cohenerickson@gmail.com>
Date: Fri, 22 Dec 2023 15:29:32 -0600
Subject: [PATCH] Add spanish translations

---
 src/i18n.ts                 |  4 ++++
 src/locales/en.json         |  3 ++-
 src/locales/es.json         | 42 +++++++++++++++++++++++++++++++++++++
 src/locales/ja.json         |  3 ++-
 src/pages/Settings/Misc.tsx |  7 ++++---
 5 files changed, 54 insertions(+), 5 deletions(-)
 create mode 100644 src/locales/es.json

diff --git a/src/i18n.ts b/src/i18n.ts
index c5e5090..0546094 100644
--- a/src/i18n.ts
+++ b/src/i18n.ts
@@ -3,12 +3,16 @@ import { initReactI18next } from "react-i18next";
 import LanguageDetector from "i18next-browser-languagedetector";
 
 import translationEN from "./locales/en.json";
+import translationES from "./locales/es.json";
 import translationJA from "./locales/ja.json";
 
 const resources = {
   en: {
     translation: translationEN
   },
+  es: {
+    translation: translationES
+  },
   ja: {
     translation: translationJA
   }
diff --git a/src/locales/en.json b/src/locales/en.json
index 8a71fec..82358c7 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -35,7 +35,8 @@
       "title": "Language",
       "subtitle": "Choose your preferred language",
       "japanese": "Japanese",
-      "english": "English"
+      "english": "English",
+      "spanish": "Spanish"
     }
   }
 }
diff --git a/src/locales/es.json b/src/locales/es.json
new file mode 100644
index 0000000..0b5a3fb
--- /dev/null
+++ b/src/locales/es.json
@@ -0,0 +1,42 @@
+{
+  "header": {
+    "title": "nebula.",
+    "games": "Juegos",
+    "settings": "Ajustes",
+    "discord": "¿Quieres más enlaces?"
+  },
+  "404": {
+    "text": "Este servicio Nebula ha sido deshabilitado.",
+    "return": "De vuelta a casa"
+  },
+  "home": {
+    "placeholder": "Busca en la web libremente"
+  },
+  "discord": {
+    "title": "Nebula's Discord Servidor",
+    "sub": "¿Le gustaría abrir esto a través de proxy?",
+    "button1": "Abierto normalmente",
+    "button2": "Usa proxy"
+  },
+  "settings": {
+    "tabs": {
+      "proxy": "Proxy",
+      "tab": "Pestaña",
+      "custom": "Personalización",
+      "misc": "Misc"
+    },
+    "proxy": {
+      "title": "Proxy",
+      "subtitle": "Elige el proxy que se ajuste a tus necesidades",
+      "automatic": "Automática",
+      "buggyWarning": "(CALESA)"
+    },
+    "languages": {
+      "title": "Idioma",
+      "subtitle": "Elige tu idioma preferido",
+      "japanese": "Japonés",
+      "english": "Inglés",
+      "spanish": "Español"
+    }
+  }
+}
diff --git a/src/locales/ja.json b/src/locales/ja.json
index 714782b..7b0ea81 100644
--- a/src/locales/ja.json
+++ b/src/locales/ja.json
@@ -35,7 +35,8 @@
       "title": "言語",
       "subtitle": "好きな言語を選んでください",
       "japanese": "日本語",
-      "english": "英語"
+      "english": "英語",
+      "spanish": "スペイン語"
     }
   }
 }
diff --git a/src/pages/Settings/Misc.tsx b/src/pages/Settings/Misc.tsx
index 6074c94..6bc1a22 100644
--- a/src/pages/Settings/Misc.tsx
+++ b/src/pages/Settings/Misc.tsx
@@ -7,8 +7,9 @@ const Misc = ({ id, active }) => {
   const { t } = useTranslation();
 
   const languages = [
-    { id: "ja", label: t("settings.languages.japanese") },
-    { id: "en-US", label: t("settings.languages.english") }
+    { id: "en-US", label: t("settings.languages.english") },
+    { id: "es", label: t("settings.languages.spanish") },
+    { id: "ja", label: t("settings.languages.japanese") }
   ];
 
   return (
@@ -24,7 +25,7 @@ const Misc = ({ id, active }) => {
         variants={settingsPageVariant}
         className="content-card flex flex-row flex-wrap justify-around"
       >
-        <div class="bg-lighter flex h-64 w-80 flex-col flex-wrap content-center items-center rounded-lg border border-input-border-color p-7 text-center">
+        <div class="flex h-64 w-80 flex-col flex-wrap content-center items-center rounded-lg border border-input-border-color bg-lighter p-7 text-center">
           <div class="text-3xl">{t("settings.languages.title")}</div>
           <div class="text-md">{t("settings.languages.subtitle")}</div>
           <Dropdown