Add action for update specific filter

[MAILPOET-3469]

assets/js/src/segments/dynamic/store/actions.ts

@@ -7,6 +7,7 @@ import {
   AnyFormItem,
   SetSegmentActionType,
   SetErrorsActionType,
+  SetSegmentFilerActionType,
 } from '../types';
 
 export function setSegment(segment: AnyFormItem): SetSegmentActionType {
@@ -30,6 +31,15 @@ export function updateSegment(data: AnyFormItem): SetSegmentActionType {
   };
 }
 
+export function updateSegmentFilter(filter: AnyFormItem, filterIndex: number)
+  : SetSegmentFilerActionType {
+  return {
+    type: Actions.UPDATE_SEGMENT_FILTER,
+    filter,
+    filterIndex,
+  };
+}
+
 export function updateSegmentFromEvent(
   propertyName: string,
   event: ChangeEvent<HTMLSelectElement | HTMLInputElement>
@@ -42,6 +52,20 @@ export function updateSegmentFromEvent(
   };
 }
 
+export function updateSegmentFilterFromEvent(
+  propertyName: string,
+  filterIndex: number,
+  event: ChangeEvent<HTMLSelectElement | HTMLInputElement>
+): SetSegmentFilerActionType {
+  return {
+    type: Actions.UPDATE_SEGMENT_FILTER,
+    filter: {
+      [propertyName]: event.target.value,
+    },
+    filterIndex,
+  };
+}
+
 export function* pageLoaded(segmentId?: number): Generator<{
   type: string;
   segmentId?: number;

assets/js/src/segments/dynamic/store/reducer.ts

@@ -5,6 +5,7 @@ import {
   SetSegmentActionType,
   SetErrorsActionType,
   StateType,
+  SetSegmentFilerActionType,
 } from '../types';
 
 function setSegment(state: StateType, action: SetSegmentActionType): StateType {
@@ -29,6 +30,15 @@ function updateSegment(state: StateType, action: SetSegmentActionType): StateTyp
   };
 }
 
+function updateSegmentFilter(state: StateType, action: SetSegmentFilerActionType): StateType {
+  const segment = { ...state.segment };
+  segment.filters[action.filterIndex] = assign(segment.filters[action.filterIndex], action.filter);
+  return {
+    ...state,
+    segment,
+  };
+}
+
 export const createReducer = (defaultState: StateType) => (
   state: StateType = defaultState,
   action: ActionType
@@ -37,6 +47,8 @@ export const createReducer = (defaultState: StateType) => (
     case Actions.SET_SEGMENT: return setSegment(state, action as SetSegmentActionType);
     case Actions.SET_ERRORS: return setErrors(state, action as SetErrorsActionType);
     case Actions.UPDATE_SEGMENT: return updateSegment(state, action as SetSegmentActionType);
+    case Actions.UPDATE_SEGMENT_FILTER:
+      return updateSegmentFilter(state, action as SetSegmentFilerActionType);
     default:
       return state;
   }

assets/js/src/segments/dynamic/types.ts

@@ -154,6 +154,7 @@ export enum Actions {
   SET_SEGMENT = 'SET_SEGMENT',
   SET_ERRORS = 'SET_ERRORS',
   UPDATE_SEGMENT = 'UPDATE_SEGMENT',
+  UPDATE_SEGMENT_FILTER = 'UPDATE_SEGMENT_FILTER',
 }
 
 export interface ActionType {
@@ -164,6 +165,11 @@ export interface SetSegmentActionType extends ActionType {
   segment: AnyFormItem;
 }
 
+export interface SetSegmentFilerActionType extends ActionType {
+  filter: AnyFormItem;
+  filterIndex: number;
+}
+
 export interface SetErrorsActionType extends ActionType {
   errors: string[];
 }