import { createSlice, createAsyncThunk } from '@reduxjs/toolkit';
import { getCities, getClusters } from './service';
import type { ClusterData, CityData } from './interface';
import { removeEmptyKeys } from '@/utills/helper';

// Define an initial state
const initialState = {
  cluster: [] as ClusterData[],
  cities: [] as CityData[],
  status: 'loading',
  error: '',
  meta: { current_page: '', per_page: '', total: 0 },
};

export const fetchCluster = createAsyncThunk('cluster/fetchCluster', async(searchQuery: any) => {
  const queryString = removeEmptyKeys(searchQuery);

  return await getClusters(queryString);
});

export const fetchCity = createAsyncThunk('city/fetchCity', async() => {
  return await getCities();
});

const clusterSlice = createSlice({
  name: 'cluster',
  initialState,
  reducers: {},
  extraReducers: (builder) => {
    builder
      .addCase(fetchCluster.pending, (state) => {
        state.status = 'loading';
      })
      .addCase(fetchCluster.fulfilled, (state, action) => {
        state.status = 'succeeded';
        state.cluster = action.payload.data;
        state.meta = action.payload.meta;
      })
      .addCase(fetchCluster.rejected, (state, action) => {
        state.status = 'failed';
        state.error = action.error.message ?? 'An error occurred';
      })
      .addCase(fetchCity.fulfilled, (state, action) => {
        state.status = 'succeeded';
        state.cities = action.payload.data.data;
      });
  },
});

export default clusterSlice.reducer;
