[Chore] Fix lint error for Register actions

src/actions/src/identity-actions.ts

@@ -15,6 +15,13 @@ export type RegisterEntryUpdaterAction = {
     initialUiState?: Partial<UiState>;
   };
 };
+
+export type RenameEntryUpdaterAction = {
+  payload: {
+    oldId: string;
+    newId: string;
+  };
+};
 /**
  *
  * Add a new kepler.gl instance in `keplerGlReducer`. This action is called under-the-hood when a `KeplerGl` component is **mounted** to the dom.
@@ -49,8 +56,8 @@ export const registerEntry: (entry: RegisterEntryUpdaterAction['payload']) => {
  */
 export const deleteEntry: (id: string) => {
   type: typeof ActionTypes.DELETE_ENTRY;
-  payload: string;
-} = createAction(ActionTypes.DELETE_ENTRY, (id: string) => ({payload: id}));
+  payload: {id: string};
+} = createAction(ActionTypes.DELETE_ENTRY, (id: string) => ({payload: {id: id}}));
 
 /**
  *
@@ -66,10 +73,7 @@ export const renameEntry: (
   newId: string
 ) => {
   type: typeof ActionTypes.RENAME_ENTRY;
-  payload: {
-    oldId: string;
-    newId: string;
-  };
+  payload: RenameEntryUpdaterAction['payload'];
 } = createAction(ActionTypes.RENAME_ENTRY, (oldId: string, newId: string) => ({
   payload: {
     oldId,

src/reducers/src/root.ts

@@ -1,10 +1,24 @@
 // SPDX-License-Identifier: MIT
 // Copyright contributors to the kepler.gl project
 
-import {ActionTypes, keplerGlInit, _actionFor, _updateProperty} from '@kepler.gl/actions';
+import {
+  ActionTypes,
+  keplerGlInit,
+  _actionFor,
+  _updateProperty,
+  RegisterEntryUpdaterAction,
+  RenameEntryUpdaterAction
+} from '@kepler.gl/actions';
 import {handleActions} from 'redux-actions';
 
-import {coreReducerFactory} from './core';
+import {coreReducerFactory, KeplerGlState} from './core';
+
+type KeplerGlStateMap = {
+  [id: string]: Partial<KeplerGlState>;
+};
+
+type CombineRegisterUpdateActions = RegisterEntryUpdaterAction['payload'] &
+  RenameEntryUpdaterAction['payload']; // Extend this type with additional actions to enforce strict typings
 
 // INITIAL_STATE
 const initialCoreState = {};
@@ -13,7 +27,7 @@ export function provideInitialState(initialState, extraReducers?) {
   const coreReducer = coreReducerFactory(initialState, extraReducers);
 
   const handleRegisterEntry = (
-    state,
+    state: KeplerGlStateMap,
     {
       payload: {
         id,
@@ -23,8 +37,10 @@ export function provideInitialState(initialState, extraReducers?) {
         mapStylesReplaceDefault,
         initialUiState
       }
+    }: {
+      payload: RegisterEntryUpdaterAction['payload'];
     }
-  ) => {
+  ): KeplerGlStateMap => {
     // by default, always create a mint state even if the same id already exist
     // if state.id exist and mint=false, keep the existing state
     const previousState = state[id] && mint === false ? state[id] : undefined;
@@ -39,7 +55,10 @@ export function provideInitialState(initialState, extraReducers?) {
     };
   };
 
-  const handleDeleteEntry = (state, {payload: id}) =>
+  const handleDeleteEntry = (
+    state: KeplerGlStateMap,
+    {payload: {id}}: {payload: {id: string}}
+  ): KeplerGlStateMap =>
     Object.keys(state).reduce(
       (accu, curr) => ({
         ...accu,
@@ -48,7 +67,14 @@ export function provideInitialState(initialState, extraReducers?) {
       {}
     );
 
-  const handleRenameEntry = (state, {payload: {oldId, newId}}) =>
+  const handleRenameEntry = (
+    state: KeplerGlStateMap,
+    {
+      payload: {oldId, newId}
+    }: {
+      payload: RenameEntryUpdaterAction['payload'];
+    }
+  ): KeplerGlStateMap =>
     Object.keys(state).reduce(
       (accu, curr) => ({
         ...accu,
@@ -71,8 +97,10 @@ export function provideInitialState(initialState, extraReducers?) {
       [ActionTypes.RENAME_ENTRY]: handleRenameEntry
     };
 
-    // TODO: Understand why the Lint sees an error here, while the IDE does not.
-    return handleActions(handlers, initialCoreState)(state, action);
+    return handleActions<KeplerGlStateMap, CombineRegisterUpdateActions>(
+      handlers,
+      initialCoreState
+    )(state, action);
   };
 }
 

test/browser/components/container-test.js

@@ -141,7 +141,12 @@ test('Components -> Container -> Mount with mint:true', t => {
 
   // unmount
   wrapper.unmount();
-  expectedActions0 = {type: '@@kepler.gl/DELETE_ENTRY', payload: 'milkshake'};
+  expectedActions0 = {
+    type: '@@kepler.gl/DELETE_ENTRY',
+    payload: {
+      id: 'milkshake'
+    }
+  };
 
   actions = store.getActions();
   t.deepEqual(actions, [expectedActions0], 'should call unmount');
@@ -315,7 +320,12 @@ test('Components -> Container -> Mount then rename', t => {
   // unmount
   wrapper.unmount();
 
-  const expectedActions2 = {type: '@@kepler.gl/DELETE_ENTRY', payload: 'milkshake-2'};
+  const expectedActions2 = {
+    type: '@@kepler.gl/DELETE_ENTRY',
+    payload: {
+      id: 'milkshake-2'
+    }
+  };
 
   t.deepEqual(store.getActions().pop(), expectedActions2, 'should call unmount milkshake-2');