-
Message by {{ message.data.username }} removed
+
{{ $t("chat.removed", { username: message.data.username }) }}
-
{{ message.data.username }} has just resubbed for {{ message.data.months }} months!
+
{{ $t("chat.resub", { username: message.data.username, duration : message.data.months }) }}
diff --git a/src/i18n.ts b/src/i18n.ts
new file mode 100644
index 0000000..5f8af86
--- /dev/null
+++ b/src/i18n.ts
@@ -0,0 +1,12 @@
+import { createI18n } from 'vue-i18n'
+import en from '@/locales/en.json'
+
+export default createI18n({
+ legacy: false,
+ locale: import.meta.env.VUE_APP_I18N_LOCALE || 'en',
+ fallbackLocale: import.meta.env.VUE_APP_I18N_FALLBACK_LOCALE || 'en',
+ globalInjection: true,
+ messages: {
+ 'en': en,
+ }
+})
diff --git a/src/main.ts b/src/main.ts
index 7e76d93..eb7dbba 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -2,14 +2,15 @@ import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import './assets/index.css'
+import i18n from "./i18n"
-const app = createApp(App)
+const app = createApp(App).use(i18n)
// Add protocol variable
// For some reason, import.meta.env.VITE_HTTPS === "true"
// returns false, even if it is true.
// Making a copy of the variable seems to work
-const https = (import.meta.env.VITE_HTTPS.slice() === "true")
+const https = (import.meta.env.SAFETWITCH_HTTPS.slice() === "true")
app.provide('protocol', https ? 'https://' : 'http://')
diff --git a/src/views/CategoryView.vue b/src/views/CategoryView.vue
index 612a8bb..3425a10 100644
--- a/src/views/CategoryView.vue
+++ b/src/views/CategoryView.vue
@@ -20,7 +20,7 @@ export default {
async mounted() {
try {
const res = await fetch(
- `${this.protocol}${import.meta.env.VITE_BACKEND_DOMAIN}/api/discover/${this.game}`
+ `${this.protocol}${import.meta.env.SAFETWITCH_BACKEND_DOMAIN}/api/discover/${this.game}`
)
const rawData = await res.json()
if (rawData.status === "ok") {
@@ -46,7 +46,7 @@ export default {
const cursor = streams[streams.length - 1].cursor
if (!cursor) return
const res = await fetch(
- `${this.protocol}${import.meta.env.VITE_BACKEND_DOMAIN}/api/discover/${this.game}/?cursor=${cursor}`
+ `${this.protocol}${import.meta.env.SAFETWITCH_BACKEND_DOMAIN}/api/discover/${this.game}/?cursor=${cursor}`
)
if (!res.ok) {
throw new Error('Failed to fetch data')
@@ -89,8 +89,8 @@ export default {
-
Followers: {{ abbreviate(data.followers) }}
-
Viewers: {{ abbreviate(data.viewers) }}
+
{{ $t("main.followers") }}: {{ abbreviate(data.followers) }}
+
{{ $t("main.viewers") }}: {{ abbreviate(data.viewers) }}
@@ -109,8 +109,8 @@ export default {
-
Followers: {{ abbreviate(data.followers) }}
-
Viewers: {{ abbreviate(data.viewers) }}
+
{{ $t("main.followers") }}: {{ abbreviate(data.followers) }}
+
{{ $t("main.viewers") }}: {{ abbreviate(data.viewers) }}
diff --git a/src/views/HomepageView.vue b/src/views/HomepageView.vue
index 1094135..ad6fda5 100644
--- a/src/views/HomepageView.vue
+++ b/src/views/HomepageView.vue
@@ -51,7 +51,7 @@ export default {
const cursor = this.data[this.data.length - 1].cursor
if (!cursor) return
const res = await fetch(
- `${this.protocol}${import.meta.env.VITE_BACKEND_DOMAIN}/api/discover/?cursor=${cursor}`
+ `${this.protocol}${import.meta.env.SAFETWITCH_BACKEND_DOMAIN}/api/discover/?cursor=${cursor}`
)
if (!res.ok) {
throw new Error('Failed to fetch data')
@@ -76,7 +76,7 @@ export default {
}
try {
- const res = await fetch(`${this.protocol}${import.meta.env.VITE_BACKEND_DOMAIN}/api/discover`)
+ const res = await fetch(`${this.protocol}${import.meta.env.SAFETWITCH_BACKEND_DOMAIN}/api/discover`)
const rawData = await res.json()
if (rawData.status === 'ok') {
@@ -118,19 +118,19 @@ export default {
-
Discover
-
Sort through popular categories
+
{{ $t("home.discover") }}
+
{{ $t("home.discoverDescription") }}
-
Filter by tag
+
{{ $t("home.tagDescription") }}
{{ data.username }}
- {{ abbreviate(data.followers) }} Followers
+ {{ abbreviate(data.followers) }} {{ $t("main.live") }}
@@ -144,13 +144,13 @@ export default {
-
{{ abbreviate(data.followers) }} Followers
+
{{ abbreviate(data.followers) }} {{ $t("main.followers") }}
- About
+ {{ $t("streamer.about") }}
{{ data.about }}
diff --git a/vite.config.ts b/vite.config.ts
index bb8a0e0..a9e9539 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -2,10 +2,17 @@ import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
+import VueI18nPlugin from '@intlify/unplugin-vue-i18n/vite'
+import { dirname, resolve } from 'node:path'
// https://vitejs.dev/config/
export default defineConfig({
- plugins: [vue()],
+ plugins: [
+ vue(),
+ VueI18nPlugin({
+ include: resolve(dirname(fileURLToPath(import.meta.url)), './src/locales/**'),
+ })
+ ],
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url))
@@ -21,5 +28,6 @@ export default defineConfig({
}
}
}
- }
+ },
+ envPrefix: 'SAFETWITCH_',
})