From 354148357ff8d548bf4801ef52ba33f37d3790c7 Mon Sep 17 00:00:00 2001
From: kittentm <aidenplayzroblox123@gmail.com>
Date: Sun, 19 Jul 2026 08:50:50 +0200
Subject: [PATCH] feat: locales in header & footer

---
 app/components/MainFooter.vue | 16 ++++++++++------
 app/components/TheHeader.vue  | 12 +++++++-----
 app/composables/useLocales.ts | 12 ++++++++++++
 app/locales/message-en.json   | 15 +++++++++++++++
 4 files changed, 44 insertions(+), 11 deletions(-)
 create mode 100644 app/composables/useLocales.ts
 create mode 100644 app/locales/message-en.json

diff --git a/app/components/MainFooter.vue b/app/components/MainFooter.vue
index 55a8ec8..46f5dce 100644
--- a/app/components/MainFooter.vue
+++ b/app/components/MainFooter.vue
@@ -1,4 +1,8 @@
-<script lang="ts" src="../composables/MainFooter.ts"></script>
+<script setup lang="ts">
+import { footerLinks } from '../composables/MainFooter'
+
+const { t } = useLocale()
+</script>
 
 <template>
   <UFooter>
@@ -16,12 +20,12 @@
               </span>
             </div>
             <div class="text-sm text-gray-400 space-y-1">
-              <p>Copyright 2026</p>
-              <p>Site maintained by Spacebar Network</p>
-              <p>Developed by our contributors</p>
+              <p>Copyright {{ new Date().getFullYear() }}</p>
+              <p>{{ t.footer?.siteMaintained }}</p>
+              <p>{{ t.footer?.developedBy }}</p>
 
               <p class="mt-4 max-w-[320px] leading-snug text-gray-500">
-                Spacebar Network (SPBR) is an extension of Splatfestival Network (SPFN), which aims to be a Nintendo Network recreation primarily for hosting Splatfests. Spacebar is separate from this purpose, though we remain partnered with Splatfestival.
+                {{ t.footer?.description }}
               </p>
             </div>
           </div>
@@ -31,7 +35,7 @@
 
     <template #left>
       <span class="text-sm text-gray-500">
-        © {{ new Date().getFullYear() }} Spacebar Network. All rights reserved.
+        © {{ new Date().getFullYear() }} {{ t.footer?.copyright }}
       </span>
     </template>
 
diff --git a/app/components/TheHeader.vue b/app/components/TheHeader.vue
index 257f41a..44ef2ac 100644
--- a/app/components/TheHeader.vue
+++ b/app/components/TheHeader.vue
@@ -12,17 +12,17 @@
       </RouterLink>
 
       <nav class="links">
-        <a href="#">Supported games</a>
-        <a href="#">Error Codes</a>
-        <a href="#">Discord Server</a>
-        <a href="#">Install SPBR</a>
+        <a href="#">{{ t.nav?.supportedGames }}</a>
+        <a href="#">{{ t.nav?.errorCodes }}</a>
+        <a href="#">{{ t.nav?.discordServer }}</a>
+        <a href="#">{{ t.nav?.installSpbr }}</a>
       </nav>
 
       <div class="search-box">
         <input
           v-model="query"
           type="text"
-          placeholder="Search"
+          :placeholder="t.nav?.searchPlaceholder"
         >
         <button class="search-btn">
           <Icon
@@ -40,6 +40,8 @@
 import { ref } from 'vue'
 
 const query = ref('')
+
+const { t } = useLocale()
 </script>
 
 <style scoped>
diff --git a/app/composables/useLocales.ts b/app/composables/useLocales.ts
new file mode 100644
index 0000000..2792cbf
--- /dev/null
+++ b/app/composables/useLocales.ts
@@ -0,0 +1,12 @@
+import { ref } from 'vue'
+import enMessages from '../locales/message-en.json'
+
+const messages = ref(enMessages)
+
+export const useLocale = () => {
+  // todo add changer
+
+  return {
+    t: messages
+  }
+}
diff --git a/app/locales/message-en.json b/app/locales/message-en.json
new file mode 100644
index 0000000..b485426
--- /dev/null
+++ b/app/locales/message-en.json
@@ -0,0 +1,15 @@
+{
+  "nav": {
+    "supportedGames": "Supported games",
+    "errorCodes": "Error Codes",
+    "discordServer": "Discord Server",
+    "installSpbr": "Install SPBR",
+    "searchPlaceholder": "Search"
+  },
+  "footer": {
+    "siteMaintained": "Site maintained by Spacebar Network",
+    "developedBy": "Developed by our contributors",
+    "description": "Spacebar Network (SPBR) is an extension of Splatfestival Network (SPFN), which aims to be a Nintendo Network recreation primarily for hosting Splatfests. Spacebar is separate from this purpose, though we remain partnered with Splatfestival.",
+    "copyright": "Spacebar Network. All rights reserved."
+  }
+}
\ No newline at end of file