How to use the @reduxjs/toolkit.createReducer function in @reduxjs/toolkit

To help you get started, we’ve selected a few @reduxjs/toolkit examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github insideout10 / wordlift-plugin / src / src / js / src / mappings / reducers / mapping-list-reducers.js View on Github external
import { MAPPING_LIST_CHANGED, MAPPING_ITEM_CATEGORY_CHANGED, MAPPING_LIST_BULK_SELECT, MAPPING_LIST_CHOOSEN_CATEGORY_CHANGED, MAPPING_ITEM_SELECTED, BULK_ACTION_SELECTION_CHANGED, MAPPING_ITEMS_BULK_SELECT } from '../actions/action-types'
import { createReducer } from '@reduxjs/toolkit'
import { BulkOptionValues } from '../components/bulk-action-sub-components'
import { TRASH_CATEGORY, ACTIVE_CATEGORY } from '../components/category-component'

const changeCategoryForMappingItems = ( mapping_items, category ) => {
    return mapping_items.map( (item) => {
        item.mapping_status = category
        return item
    })
}

/**
  * Reducer to handle the mapping list section
  */
 export const MappingListReducer = createReducer(null, {
    [ MAPPING_LIST_CHANGED ] : ( state, action ) => {
        console.log( "state changed " )
        state.mapping_items = action.payload.value
    },
    [ MAPPING_ITEM_CATEGORY_CHANGED ] : ( state, action ) => {
        const { mappingId, mappingCategory } = action.payload
        const targetIndex = state.mapping_items
        .map( el => el.mapping_id )
        .indexOf( mappingId )
        state.mapping_items[ targetIndex ].mapping_status = mappingCategory
    },

    [ MAPPING_LIST_BULK_SELECT ] : ( state, action ) => {

        state.mapping_items = state.mapping_items.map((item) => {
            // Select only items in the current choosen category.
github insideout10 / wordlift-plugin / src / src / js / src / mappings / reducers / reducers.js View on Github external
changePropertyItemCategory( state, propertyIndex, ACTIVE_CATEGORY)
            break
        case BulkOptionValues.DELETE_PERMANENTLY:
            state.propertyList.splice( propertyIndex, 1 );
            break
        default:
            break
    }
  }



/**
  * Reducer to handle the property section
  */
 export const PropertyReducer = createReducer(null, {
    /**
     * When the `edit` or `close mapping` is clicked then the property changes the state
     * it switches to edit mode and list mode depends on the state
     */
    [OPEN_OR_CLOSE_PROPERTY]: ( state, action )=> {
        const {propertyId} = action.payload
        const propertyIndex = state.propertyList
        .map( el => el.property_id )
        .indexOf( propertyId )
        const prevState = state.propertyList[propertyIndex].isOpenedOrAddedByUser
        // invert the previous state
        state.propertyList[propertyIndex].isOpenedOrAddedByUser = !prevState
    },
    /**
     * When any of the property data is changed then this action is dispatched from ui
     * and it is saved based on the fieldKey which identifies the field
github insideout10 / wordlift-plugin / src / src / js / src / mappings / reducers / reducers.js View on Github external
* @since 3.24.0
 */

/**
 * Internal dependancies
 */
import { ADD_NEW_RULE, ADD_NEW_RULE_GROUP, DELETE_RULE, CHANGE_RULE_FIELD_VALUE, OPEN_OR_CLOSE_PROPERTY, PROPERTY_DATA_CHANGED, ADD_MAPPING, TITLE_CHANGED, PROPERTY_LIST_CHANGED, MAPPING_HEADER_CHANGED, RULE_GROUP_LIST_CHANGED, NOTIFICATION_CHANGED, PROPERTY_ITEM_CATEGORY_CHANGED, PROPERTY_LIST_SELECTED_CATEGORY_CHANGED, PROPERTY_ITEM_CRUD_OPERATION, PROPERTY_ITEM_SELECTED, PROPERTY_ITEM_SELECT_ALL, PROPERTY_ITEMS_BULK_SELECT, BULK_ACTION_SELECTION_CHANGED, MAPPING_ID_CHANGED_FROM_API } from '../actions/action-types'
import { createReducer } from '@reduxjs/toolkit'
import { DELETE_PROPERTY_PERMANENT, DUPLICATE_PROPERTY } from '../components/property-list-item-component'
import { BulkOptionValues } from '../components/bulk-action-sub-components'
import { TRASH_CATEGORY, ACTIVE_CATEGORY } from '../components/category-component'

 /**
  * Reducer to handle the rule group and rule section
  */
export const RuleGroupReducer = createReducer(null, {
    /**
     * When add rule group is clicked then this action is fired from ui
     */
    [ADD_NEW_RULE_GROUP]: ( state, action ) => {
      state.ruleGroupList.push({rules: [{}]})
    },
    /**
     * When `AND` button is clicked, this action is dispatched with the rule index
     * and the rule is added after the index.
     */
    [ADD_NEW_RULE]: ( state, action )=> {
        // clicked index is given, add an item after that index
        state.ruleGroupList[action.payload.ruleGroupIndex].rules
        .splice(action.payload.ruleIndex + 1, 0, {
            ruleFieldOneValue: state.ruleFieldOneOptions[0].value,
            ruleFieldTwoValue: state.ruleFieldTwoOptions[0].value,
github cockroachdb / cockroach-gen / pkg / ui / cluster-ui / src / store / reducers.ts View on Github external
statements,
  nodes,
  liveness,
  sessions,
  terminateQuery,
  uiConfig,
});

export const rootActions = {
  resetState: createAction(`${DOMAIN_NAME}/RESET_STATE`),
};

/**
 * rootReducer consolidates reducers slices and cases for handling global actions related to entire state.
 **/
export const rootReducer = createReducer(undefined, builder => {
  builder
    .addCase(rootActions.resetState, () => createStore(reducers).getState())
    .addDefaultCase(reducers);
});
github insideout10 / wordlift-plugin / src / src / js / src / mappings / reducers / reducers.js View on Github external
.map( (item) => { 
            item.isSelectedByUser = false 
            return item
        })
    },

    [ BULK_ACTION_SELECTION_CHANGED ] : ( state, action ) => {
        const { selectedBulkAction } = action.payload
        state.choosenPropertyBulkAction = selectedBulkAction
    }
})

/**
  * Reducer to handle the title section
  */
 export const TitleReducer = createReducer(null, {
    /**
     * When the mapping title is changed in add/edit mode then this event is fired.
     */
    [TITLE_CHANGED]: ( state, action )=> {
        state.title = action.payload.value
    },

    /**
     * When the mapping header is changed by api, then this callback is triggered.
     */
    [MAPPING_HEADER_CHANGED]: ( state, action )=> {
        state.title = action.payload.title
        state.mapping_id = action.payload.mapping_id
    },

    /**
github insideout10 / wordlift-plugin / src / src / js / src / mappings / reducers / reducers.js View on Github external
state.mapping_id = action.payload.mapping_id
    },

    /**
     * When the mapping id is changed in save,usually a new mapping
     * id is created if the user created via add mapping.
     */
    [ MAPPING_ID_CHANGED_FROM_API ] : ( state, action ) => {
        state.mapping_id = action.payload.mappingId
    }
})

/**
  * Reducer to handle the notification section
  */
 export const NotificationReducer = createReducer(null, {
    /**
     * When the notification is changed, then we trigger the action
     */
    [NOTIFICATION_CHANGED]: ( state, action )=> {
        state.message = action.payload.message
        state.type = action.payload.type
    },
})