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

interface Email {
  id: number;
  grp_bereichid: string;
  usr_mail: string;
}

const emailsAdapter = createEntityAdapter<Email>();

export const fetchEmails = createAsyncThunk(
  'fetch_emails',
  async (ergID: number) => {
    const r = await axios.get(`c/${ergID}/emails`);

    return { comments: r.data as Email[], ergID };
  }
);

const slice = createSlice({
  name: 'data/emails',
  initialState: emailsAdapter.getInitialState({ open: false, ergID: null }),
  reducers: {
    openEmailDialog(state) {
      state.open = true;
    },
    closeEmailDialog(state) {
      state.open = false;
    }
  },
  extraReducers: (builder) => {
    builder.addCase(fetchEmails.fulfilled, (state, { payload }) => {
      emailsAdapter.upsertMany(state, payload.comments);
      state.open = true;
      state.ergID = payload.ergID;
    });
  }
});

export const { openEmailDialog, closeEmailDialog } = slice.actions;
export const emailsSelectors = emailsAdapter.getSelectors(
  (s: RootState) => s.emails
);
export default slice.reducer;
