// resources\assets\ts\DataPage\cloneTaskSlice.ts
import {
  PayloadAction,
  createAsyncThunk,
  createEntityAdapter,
  createSlice,
} from '@reduxjs/toolkit';
import { RootState } from './rootReducer';
import { fetchAll } from './dataSlice';
import axios from 'B/axios';

interface Clone {
  agb_id: number;
  agb_name: string;
}

const clonesAdapter = createEntityAdapter<Clone>({ selectId: (v) => v.agb_id });
const initialState = clonesAdapter.getInitialState({
  open: false,
  ergID: null,
  checked: {},
  batchCount: {},
  isReservation: false,
});

export const fetchClones = createAsyncThunk(
  'fetch_clones',
  async (ergID: number) => {
    const r = await axios.get(`/ProceedTask/doAction/getClones/${ergID}`);
    return { clones: r.data as Clone[], ergID };
  }
);

async function postBatchRequest(state, ids) {
  return await axios.post('/c/batch-create/clone', {
    cloneid: ids.join(','),
    ergid: state.ergID,
    batchCount: state.batchCount,
  });
}
export const submit = createAsyncThunk(
  'submit_clones',
  async (_payload, thunkAPI) => {
    const rstate = thunkAPI.getState() as RootState;
    const state = rstate.clones;
    let ids = [];
    for (let cloneID in state.checked) {
      if (state.checked[cloneID] === false) continue;
      ids.push(cloneID);
    }

    const isBatchRequest = state.isReservation || false;
    if (isBatchRequest) {
      await postBatchRequest(state, ids);
      return;
    }

    await axios.post('/ProceedTask/doAction', {
      cloneid: ids.join(','),
      ergid: state.ergID,
      action: 'clone',
    });

        // ✅ ADD: Emit event for ContactsPage //CMS-prototype
    window.dispatchEvent(new CustomEvent('contactCloneTask', { 
      detail: { ergId: state.ergID, cloneIds: ids.join(',') } 
    }));


  }
);

const slice = createSlice({
  name: 'data/clones',
  initialState: initialState,
  reducers: {
    openCloneDialog(state) {
      state.open = true;
    },
    closeCloneDialog(state) {
      state.open = false;
    },
    check(state, { payload }: PayloadAction<{ id: string; checked: boolean }>) {
      // toggle checkbox
      const isUnchecked =
        state.checked[payload.id] === false ||
        state.checked[payload.id] === undefined;
      if (isUnchecked) {
        state.checked[payload.id] = true;
      } else {
        state.checked[payload.id] = false;
      }

      // handle batchCount
      if (state.batchCount[payload.id] === undefined) {
        state.batchCount[payload.id] = 1;
      } else {
        delete state.batchCount[payload.id];
      }
    },
    checkAll(state) {
      for (let cloneID in state.checked) {
        state.checked[cloneID] = true;
      }
    },
    setBatchCount(
      state,
      { payload }: PayloadAction<{ agbID: number; count: number }>
    ) {
      state.batchCount[payload.agbID] = payload.count;
    },
    setReservation(state, { payload }: PayloadAction<boolean>) {
      state.isReservation = payload;
    },
    reset() {
      return initialState;
    },
  },
  extraReducers: (builder) => {
    builder.addCase(fetchClones.fulfilled, (state, { payload }) => {
      clonesAdapter.upsertMany(state, payload.clones);
      for (let clone of payload.clones) {
        state.checked[clone.agb_id] = false;
      }
      state.open = true;
      state.ergID = payload.ergID;
    });

    builder.addCase(submit.fulfilled, (state) => {
      state.open = false;
      state.ergID = null;
      state.checked = {};
    });
  },
});

export const {
  openCloneDialog,
  closeCloneDialog,
  check,
  checkAll,
  setBatchCount,
  reset,
  setReservation,
} = slice.actions;
export const clonesSelector = clonesAdapter.getSelectors(
  (s: RootState) => s.clones
);

export default slice.reducer;