From 5c6910df63e90abeb65a130443ffa366255b6a1e Mon Sep 17 00:00:00 2001
From: Spythere <spythere@protonmail.com>
Date: Mon, 27 Jan 2025 15:09:01 +0100
Subject: [PATCH] chore: add api data status info

---
 src/App.vue             | 4 ++++
 src/stores/api.store.ts | 7 +++++--
 src/types/api.types.ts  | 6 ++++++
 3 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 8bc1a3c..59ba941 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -16,9 +16,11 @@
           name="trains"
           id="trains-select"
           class="bg-zinc-800 p-1 rounded-md print:hidden w-full"
+          :disabled="apiStore.activeDataStatus != DataStatus.SUCCESS"
           v-model="selectedTrainId"
           @change="selectTrain"
         >
+          <option value="" disabled>{{ apiStore.activeDataStatus == DataStatus.LOADING ? 'Ładowanie danych...' : 'Wybierz pociąg z listy' }}</option>
           <option :value="train.id" v-for="train in activeTimetableTrains">
             {{ train.driverName }} | {{ train.timetable?.category }} {{ train.trainNo }}
           </option>
@@ -245,6 +247,7 @@ import type { ActiveTrain } from './types/common.types';
 import { version } from '../package.json';
 import { PrinterIcon, ArrowPathIcon, ExclamationTriangleIcon } from '@heroicons/vue/16/solid';
 import { useApiStore } from './stores/api.store';
+import { DataStatus } from './types/api.types';
 
 interface StopRow {
   pointName: string;
@@ -290,6 +293,7 @@ export default defineComponent({
     version,
 
     apiMode: import.meta.env.VITE_API_MODE,
+    DataStatus,
   }),
 
   mounted() {
diff --git a/src/stores/api.store.ts b/src/stores/api.store.ts
index c8e93cb..dc0b3b4 100644
--- a/src/stores/api.store.ts
+++ b/src/stores/api.store.ts
@@ -1,7 +1,7 @@
 import type { AxiosInstance } from 'axios';
 import axios from 'axios';
 import { defineStore } from 'pinia';
-import type { ActiveDataResponse, SceneriesDataResponse } from '../types/api.types';
+import { DataStatus, type ActiveDataResponse, type SceneriesDataResponse } from '../types/api.types';
 import type { ActiveData, SceneryData } from '../types/common.types';
 
 export const useApiStore = defineStore('api', {
@@ -11,6 +11,8 @@ export const useApiStore = defineStore('api', {
       
       activeData: null as ActiveData | null,
       sceneryData: null as SceneryData[] | null,
+
+      activeDataStatus: DataStatus.LOADING
     };
   },
 
@@ -34,7 +36,7 @@ export const useApiStore = defineStore('api', {
       this.client = axios.create({
         baseURL,
       });
-
+      
       this.fetchSceneriesData();
       this.fetchActiveData();
 
@@ -48,6 +50,7 @@ export const useApiStore = defineStore('api', {
         const response = (await this.client!.get<ActiveDataResponse>('/api/getActiveData')).data;
 
         this.activeData = response;
+        this.activeDataStatus = DataStatus.SUCCESS;
       } catch (error) {
         console.error(error);
       }
diff --git a/src/types/api.types.ts b/src/types/api.types.ts
index bfdd2d3..1f0c3a3 100644
--- a/src/types/api.types.ts
+++ b/src/types/api.types.ts
@@ -3,3 +3,9 @@ import type { ActiveData, SceneryData } from './common.types';
 export type ActiveDataResponse = ActiveData;
 
 export type SceneriesDataResponse = SceneryData[];
+
+export enum DataStatus {
+  'LOADING' = 0,
+  'SUCCESS' = 1,
+  'ERROR' = 2,
+}