import {
  PayloadAction,
  createAsyncThunk,
  createSelector,
  createSlice
} from '@reduxjs/toolkit';
import { RootState } from './rootReducer';
import axios from 'B/axios';

interface Task {
  agb_id: number;
  agb_name: string;
  agb_gruppenid: number;
  agb_typ: string;
  grp_name: string;
}

const taskListSelector = (s: RootState) => s.newTaskList.taskList;
const taskSearchSelector = (s: RootState) => s.newTaskList.searchStr;
export const filteredListSelector = createSelector(
  taskListSelector,
  taskSearchSelector,
  (taskList, searchStr) =>
    taskList.filter(
      (t) => t.agb_name.concat(t.grp_name).toLocaleLowerCase().indexOf(searchStr) != -1
    )
);

export const fetchTaskList = createAsyncThunk('tasklist', async (_arg, thunkAPI) => {
  const s =  thunkAPI.getState() as RootState;
  const isFolder = s.node.type === 'GRP' || s.node.type === 'department';
  if (isFolder === false) {
    return [];
  }

  const uid = s.node.uid;
  const { data }: { data: Task[] } = await axios.get(`c/newtasks?q=${uid}`);

  return data;
});

interface State {
  isOpen: boolean;
  taskList: Task[];
  searchStr: string;
}
const initialState: State = {
  isOpen: false,
  taskList: [],
  searchStr: ''
};
const slice = createSlice({
  name: 'monitor/table',
  initialState,
  reducers: {
    openTaskList(state) {
      state.isOpen = true;
    },
    closeTaskList(state) {
      state.isOpen = false;
      state.searchStr = '';
      state.taskList = [];
    },
    updateSearchString(state, { payload }: PayloadAction<string>) {
      state.searchStr = payload;
    }
  },
  extraReducers: (builder) => {
    builder.addCase(fetchTaskList.fulfilled, (state, { payload }) => {
      const haveNoTask = payload.length === 0;
      if (haveNoTask) {
        return;
      }

      state.taskList = payload;
    });
  }
});

export const {
  openTaskList,
  closeTaskList,
  updateSearchString
} = slice.actions;

export default slice.reducer;