chore(app): added info bar about migration to a new domain

src/App.vue

@@ -5,9 +5,15 @@
       <UpdatePrompt v-if="needRefresh" @onUpdateClick="updateApp()" />
     </transition>
 
+    
     <!-- Content -->
     <Navbar v-if="!globalStore.fullscreenMode" />
     <MainContainer />
+    
+    <!-- Migrate Info -->
+    <transition name="slide-anim">
+      <MigrateInfo v-if="globalStore.isMigrationInfoOpen" />
+    </transition>
   </div>
 </template>
 
@@ -22,6 +28,7 @@ import { useGlobalStore } from './stores/global.store';
 import { useI18n } from 'vue-i18n';
 import { useRegisterSW } from 'virtual:pwa-register/vue';
 import { DataStatus } from './types/api.types';
+import MigrateInfo from './components/App/MigrateInfo.vue';
 
 const originalDocumentTitle = document.title;
 
@@ -34,6 +41,7 @@ const { needRefresh, updateServiceWorker } = useRegisterSW({ immediate: true });
 onMounted(async () => {
   setupLocale();
   setupDarkMode();
+  handleMigrationInfo();
   setupOfflineMode();
   loadStorageTimetables();
   setupAfterPrintClose();
@@ -112,4 +120,18 @@ function handleQueries() {
     }
   }
 }
+
+function handleMigrationInfo() {
+  // Show only on old domain
+  if (location.hostname !== 'srjp-td2.web.app' && location.hostname != 'localhost') return;
+
+  const showInfo = localStorage.getItem('showMigrationInfo');
+
+  // Do not show if already acknowledged
+  if (showInfo === 'false') return;
+
+  setTimeout(() => {
+    globalStore.isMigrationInfoOpen = true;
+  }, 2000);
+}
 </script>

src/components/App/MigrateInfo.vue

@@ -0,0 +1,30 @@
+<template>
+  <div class="fixed z-10 bottom-0 left-0 p-1 text-center w-full bg-yellow-400 text-black font-bold">
+    <div class="flex justify-center items-center flex-wrap gap-2">
+      <i18n-t keypath="migrate-info.line-1" for="migrate-info" tag="div">
+        <a href="https://srjp-td2.spythere.eu/" target="_blank" class="underline">
+          https://srjp-td2.spythere.eu/
+        </a>
+      </i18n-t>
+      <button
+        class="p-1 bg-zinc-700 text-white rounded-md hover:bg-zinc-500 focus-visible:bg-zinc-500"
+        @click="onAcceptButtonClick"
+      >
+        {{ t('migrate-info.accept-btn') }}
+      </button>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { useI18n } from 'vue-i18n';
+import { useGlobalStore } from '../../stores/global.store';
+
+const store = useGlobalStore();
+const { t } = useI18n();
+
+function onAcceptButtonClick() {
+  store.isMigrationInfoOpen = false;
+  localStorage.setItem('showMigrationInfo', 'false');
+}
+</script>

src/locales/en.json

@@ -26,6 +26,11 @@
     "relation": "Route"
   },
 
+  "migrate-info": {
+    "line-1": "Rozkładownik is being moved to a new domain - {0}! You can still use the current website, but it will no longer be updated and will be shut down in the nearest future!",
+    "accept-btn": "ROGER THAT!"
+  },
+
   "storage-empty-header": "ARCHIVED TIMETABLES SEARCH MODE",
   "storage-empty-info": "Timetables will be shown here after their archiving.",
   "storage-preview-title": "ARCHIVED TIMETABLES",

src/locales/pl.json

@@ -26,6 +26,11 @@
     "relation": "Relacja"
   },
 
+  "migrate-info": {
+    "line-1": "Rozkładownik zostaje przeniesiony na nową domenę - {0}! Możesz korzystać z obecnej strony, jednak nie będzie ona otrzymywać już aktualizacji i w przyszłości zostanie wyłączona!",
+    "accept-btn": "PRZYJĄŁEM!"
+  },
+
   "storage-empty-header": "TRYB WYSZUKIWANA ZAPISANYCH ROZKŁADÓW JAZDY",
   "storage-empty-info": "Użyj funkcji zapisu rozkładu jazdy, aby go tutaj wyświetlić.",
   "storage-preview-title": "ZAPISANE ROZKŁADY JAZDY",

src/stores/global.store.ts

@@ -35,7 +35,8 @@ export const useGlobalStore = defineStore('global', {
       route: ''
     },
 
-    showSettings: false
+    showSettings: false,
+    isMigrationInfoOpen: false
   }),
   getters: {
     activeTimetableTrains() {