import { defineStore } from 'pinia';
import { AuthState, ILoginResponse, IStore, IUser, SceneryRowItem } from './types/types';
import axios from 'axios';

export const baseURL = import.meta.env[`VITE_API_URL${import.meta.env.DEV ? '_DEV' : ''}`];

export const useStore = defineStore('store', {
  state: () =>
    ({
      dataState: 'LOADING',
      authState: AuthState.LOADING,

      unsavedChanges: false,
      stationList: [],
      backupList: [],
      stationsToRemove: [],
      searchedSceneryName: '',
      changeList: [],
      newStationsCount: 0,
      routesModalVisible: true,
      currentStation: null,
      selectedStationName: '',
      user: null,
      notifyDiscord: true,

      alertMessage: '',
      confirmMessage: '',

      maxVisibleResults: 15,

      changesResponse: [],
    } as IStore),

  actions: {
    fetchSceneriesData() {
      this.dataState = 'LOADING';

      const data = axios.get<SceneryRowItem[]>(`api/getSceneries`, {
        baseURL,
      });

      data
        .then((res) => {
          this.dataState = 'LOADED';
          this.backupList = JSON.parse(JSON.stringify(res.data));
          this.stationList = res.data;
          this.unsavedChanges = false;
          this.changeList = [];
        })
        .catch(() => {
          this.dataState = 'ERROR';
        });
    },

    async updateSceneriesData(mappedChangeList: any[]) {
      console.log(mappedChangeList);

      const response = await axios.post(
        '/manager/updateSceneryList',
        {
          changeList: mappedChangeList,
          notify: this.notifyDiscord,
        },
        {
          baseURL,
          withCredentials: true,
        }
      );

      return response;
    },
  },

  getters: {
    sortedStationList(state) {
      return state.stationList
        .filter((station) => station.name.toLowerCase().startsWith(state.searchedSceneryName.toLowerCase()))
        .sort((a, b) => (a.name > b.name ? 1 : -1))
        .filter((_, i) => i < state.maxVisibleResults);
    },
  },
});