import { createSlice, createSelector } from "@reduxjs/toolkit";
import type { PayloadAction } from "@reduxjs/toolkit";

export enum ERetainingFunnel {
  Red = "red",
  Green = "green",
  Purple = "purple",
  Stay50 = "stay50",
}

interface IRetainingFunnel {
  funnel: ERetainingFunnel;
  cancellingSubscriptionId: string;
}

const initialState: IRetainingFunnel = {
  funnel: ERetainingFunnel.Red,
  cancellingSubscriptionId: "",
};

const retainingFunnelSlice = createSlice({
  name: "retainingFunnel",
  initialState,
  reducers: {
    setFunnel(state, action: PayloadAction<ERetainingFunnel>) {
      state.funnel = action.payload;
    },
    setCancellingSubscriptionId(state, action: PayloadAction<string>) {
      state.cancellingSubscriptionId = action.payload;
    },
    update(state, action: PayloadAction<Partial<IRetainingFunnel>>) {
      return { ...state, ...action.payload };
    },
  },
  extraReducers: (builder) => builder.addCase("reset", () => initialState),
});

export const { actions } = retainingFunnelSlice;
export const selectRetainingFunnel = createSelector(
  (state: { retainingFunnel: IRetainingFunnel }) => state.retainingFunnel.funnel,
  (retainingFunnel) => retainingFunnel
);
export const selectCancellingSubscriptionId = createSelector(
  (state: { retainingFunnel: IRetainingFunnel }) => state.retainingFunnel.cancellingSubscriptionId,
  (cancellingSubscriptionId) => cancellingSubscriptionId
);
export default retainingFunnelSlice.reducer;
