import { createSlice } from '@reduxjs/toolkit';

import { CLEAN_RULE_TYPE_NONE, REDUX_FIELD_NAME, TAB_GENERAL } from '../../constants';

import { validationScheme } from '../../helpers/validationScheme';
import createFormSlice from '@/modules/@common/Form/redux/slices';

const formSlice = createFormSlice(REDUX_FIELD_NAME, validationScheme);

export const { validateFields, validateSingleField } = formSlice;

const initialState = {
  id: null,
  accountOptions: null, // used in tab general and syndicate content tab
  // tab general
  account: null,
  name: '',
  domains: [], // [{ label: String, isDisabled: Boolean }]
  publish: false,
  // syndicate content tab
  includePublicContent: false, // include All Syndication Accounts
  accounts: [],
  // player self service
  selfService: false,
  templatePlayerLumX: null, // Intelligent Template
  templatePlayerLumXAmp: null, // Intelligent-AMP Template
  templatePlayerLumN: null, // Stories Template
  templatePlayerLumNAmp: null, // Stories-AMP Template
  templatePlayerVertical: null, // Vertical Template
  templatePlayerOutstream: null, // Outstream Template
  templatePlayerOptions: null,
  monetization: false,
  firstLook: false,
  cpm: 0,
  // marketplace self-service
  mpSelfService: false,
  demandAccountId: null,
  demandAccount: null,
  demandAccountsOptions: [],
  // advanced tab
  pageRefresh: false,
  refreshIntervalMinutes: 0,
  refreshTimesLimit: 0,
  ddSpecificPublisher: false,
  defaultRule: {
    cleanUrlRuleType: CLEAN_RULE_TYPE_NONE,
    cleanUrlRuleValue: '',
  }, // { id: 1, cleanOrder: 0, cleanUrl: <Name>, cleanUrlRuleRType: <Type>, cleanUrlRuleValue: '' },
  cleanUrl: [], // [{ cleanOrder: 0, cleanUrl: <Name>, cleanUrlRuleType: <Type>, cleanUrlRuleValue: '' }],

  activeTabId: TAB_GENERAL,

  ...formSlice.state,
};

export const slice = createSlice({
  name: '@@HUBS/EDITOR',
  initialState,
  reducers: {
    setAction: (state, action) => {
      Object.entries(action.payload).forEach(([key, value]) => {
        state[key] = value;
      });
    },
    setInitialAction: () => ({
      ...initialState,
    }),
    getItemAction: (state) => state,
    getAccountOptionsAction: (state) => state,
    getDemandAccountsOptionsAction: (state) => state,
    getTemplatePlayerOptionsAction: (state) => state,
    createItemAction: (state) => state,
    updateItemAction: (state) => state,

    setActiveTabIdAction: (state, action) => {
      state.activeTabId = action.payload;
    },

    setScrollToFieldNameAction: formSlice.actions.setScrollToFieldAction,
    setErrorByPropAction: formSlice.actions.updateValidationSchemeAction,
    removeErrorByPropAction: formSlice.actions.removeErrorByFieldNameAction,
  },
});

export const {
  setAction,
  setInitialAction,
  getItemAction,
  getAccountOptionsAction,
  getDemandAccountsOptionsAction,
  getTemplatePlayerOptionsAction,
  createItemAction,
  updateItemAction,

  setActiveTabIdAction,
  removeErrorByPropAction,
  setErrorByPropAction,
  setScrollToFieldNameAction,
} = slice.actions;

export default slice.reducer;
