eslint & prettier update; api fetching from static server

src/store.ts

@@ -1,9 +1,16 @@
-import { IStockData, IStore } from './types';
+import {
+  IVehiclesAPI,
+  ICarWagon,
+  ILocomotive,
+  ICargo,
+  IVehicle,
+  IStock,
+  IRealComposition,
+} from './types';
 import { defineStore } from 'pinia';
 import {
-  acceptableMass as acceptableWeight,
+  acceptableWeight,
   carDataList,
-  chosenRealStock,
   isTrainPassenger,
   locoDataList,
   maxStockSpeed,
@@ -11,57 +18,97 @@ import {
   totalWeight,
 } from './utils/vehicleUtils';
 import http from './http';
+import i18n from './i18n-setup';
 
 export const useStore = defineStore({
   id: 'store',
-  state: () =>
-    ({
-      chosenCar: null,
-      chosenLoco: null,
-      chosenCargo: null,
-      chosenVehicle: null,
+  state: () => ({
+    chosenCar: null as ICarWagon | null,
+    chosenLoco: null as ILocomotive | null,
+    chosenCargo: null as ICargo | null,
+    chosenVehicle: null as IVehicle | null,
 
-      isColdStart: false,
-      isDoubleManned: false,
+    isColdStart: false,
+    isDoubleManned: false,
 
-      showSupporter: false,
-      imageLoading: false,
+    imageLoading: false,
 
-      chosenLocoPower: 'loco-e',
-      chosenCarUseType: 'car-passenger',
+    chosenLocoPower: 'loco-e',
+    chosenCarUseType: 'car-passenger',
 
-      stockList: [],
-      cargoOptions: [],
+    stockList: [] as IStock[],
+    cargoOptions: [] as any[][],
 
-      readyStockList: [],
+    swapVehicles: false,
 
-      swapVehicles: false,
+    chosenStockListIndex: -1,
 
-      chosenStockListIndex: -1,
-      chosenRealStockName: undefined,
+    vehiclePreviewSrc: '',
 
-      vehiclePreviewSrc: '',
+    stockSectionMode: 'stock-list',
 
-      stockSectionMode: 'stock-list',
+    isRandomizerCardOpen: false,
+    isRealStockListCardOpen: false,
 
-      isRandomizerCardOpen: false,
-      isRealStockListCardOpen: false,
+    vehiclesAPIData: undefined as IVehiclesAPI | undefined,
 
-      stockData: undefined,
-
-      lastFocusedElement: null,
-    }) as IStore,
+    lastFocusedElement: null as HTMLElement | null,
+  }),
 
   getters: {
-    locoDataList: (state) => locoDataList(state),
-    carDataList: (state) => carDataList(state),
-    vehicleDataList: (state) => [...locoDataList(state), ...carDataList(state)],
-    totalWeight: (state) => totalWeight(state),
-    totalLength: (state) => totalLength(state),
-    maxStockSpeed: (state) => maxStockSpeed(state),
-    isTrainPassenger: (state) => isTrainPassenger(state),
-    chosenRealStock: (state) => chosenRealStock(state),
-    acceptableWeight: (state) => acceptableWeight(state),
+    locoDataList: (state) => locoDataList(state.vehiclesAPIData),
+    carDataList: (state) => carDataList(state.vehiclesAPIData),
+    vehicleDataList: (state) => [
+      ...locoDataList(state.vehiclesAPIData),
+      ...carDataList(state.vehiclesAPIData),
+    ],
+    totalWeight: (state) => totalWeight(state.stockList),
+    totalLength: (state) => totalLength(state.stockList),
+    maxStockSpeed: (state) => maxStockSpeed(state.stockList),
+    isTrainPassenger: (state) => isTrainPassenger(state.stockList),
+    acceptableWeight: (state) => acceptableWeight(state.stockList),
+
+    // chosenRealStock: (state) => {
+    //   const currentStockString = state.stockList
+    //     .reduce((acc, stock) => {
+    //       for (let i = 0; i < stock.count; i++) acc.push(stock.type);
+    //       return acc;
+    //     }, [] as string[])
+    //     .join(';');
+
+    //   // const realStockObj = vehilcesData.realCompositions.find((readyStock) => readyStock.stockString == currentStockString);
+
+    //   // state.chosenRealStockName = realStockObj?.stockId ?? undefined;
+
+    //     state
+
+    //   // return state.r.find((readyStock) => readyStock.stockString == currentStockString);
+    // },
+
+    realCompositionList: (state) => {
+      if (!state.vehiclesAPIData) return [];
+
+      return Object.keys(state.vehiclesAPIData.realCompositions).reduce<IRealComposition[]>(
+        (acc, key) => {
+          const [type, number, ...name] = key.split(' ');
+
+          const obj = {
+            number: number.replace(/_/g, '/'),
+            name: name.join(' '),
+            stockString: state.vehiclesAPIData!.realCompositions[key],
+            type,
+          };
+
+          acc.push({
+            stockId: `${obj.type} ${obj.number} ${obj.name}`,
+            ...obj,
+          });
+
+          return acc;
+        },
+        []
+      );
+    },
 
     stockSupportsColdStart: (state) => {
       if (state.stockList.length == 0) return false;
@@ -69,7 +116,11 @@ export const useStore = defineStore({
 
       const headingLoco = state.stockList[0];
 
-      return state.stockData?.props.find((stock) => stock.type == headingLoco.constructionType)?.coldStart ?? false;
+      return (
+        state.vehiclesAPIData?.vehicleProps.find(
+          (stock) => stock.type == headingLoco.constructionType
+        )?.coldStart ?? false
+      );
     },
 
     stockSupportsDoubleManning: (state) => {
@@ -78,14 +129,34 @@ export const useStore = defineStore({
 
       const headingLoco = state.stockList[0];
 
-      return state.stockData?.props.find((stock) => stock.type == headingLoco.constructionType)?.doubleManned ?? false;
+      return (
+        state.vehiclesAPIData?.vehicleProps.find(
+          (stock) => stock.type == headingLoco.constructionType
+        )?.doubleManned ?? false
+      );
     },
   },
 
   actions: {
-    async fetchStockInfoData() {
-      const stockData = (await http.get<IStockData>('td2/data/stockInfo.json')).data;
-      this.stockData = stockData;
+    async fetchVehiclesAPI() {
+      try {
+        const vehiclesData = (await http.get<IVehiclesAPI>('/vehicles.json')).data;
+        this.vehiclesAPIData = vehiclesData;
+      } catch (error) {
+        console.error(error);
+      }
+    },
+
+    async setupAPIData() {
+      await this.fetchVehiclesAPI();
+      this.mergeBackendTranslations();
+    },
+
+    async mergeBackendTranslations() {
+      if (!this.vehiclesAPIData) return;
+
+      i18n.global.mergeLocaleMessage('pl', this.vehiclesAPIData.vehicleLocales.pl);
+      i18n.global.mergeLocaleMessage('en', this.vehiclesAPIData.vehicleLocales.en);
     },
 
     handleRouting() {