Migrated server list actions to use payload prop

src/servers/reducers/servers.ts

@@ -1,6 +1,6 @@
+import { PayloadAction } from '@reduxjs/toolkit';
 import { assoc, dissoc, fromPairs, map, pipe, reduce, toPairs } from 'ramda';
 import { v4 as uuid } from 'uuid';
-import { Action } from 'redux';
 import { ServerData, ServersMap, ServerWithId } from '../data';
 import { buildReducer } from '../../utils/helpers/redux';
 
@@ -9,18 +9,16 @@ export const DELETE_SERVER = 'shlink/servers/DELETE_SERVER';
 export const CREATE_SERVERS = 'shlink/servers/CREATE_SERVERS';
 export const SET_AUTO_CONNECT = 'shlink/servers/SET_AUTO_CONNECT';
 
-export interface CreateServersAction extends Action<string> {
+export type CreateServersAction = PayloadAction<ServersMap>;
-  newServers: ServersMap;
-}
 
-interface DeleteServerAction extends Action<string> {
+type DeleteServerAction = PayloadAction<{
   serverId: string;
-}
+}>;
 
-interface SetAutoConnectAction extends Action<string> {
+type SetAutoConnectAction = PayloadAction<{
   serverId: string;
   autoConnect: boolean;
-}
+}>;
 
 const initialState: ServersMap = {};
 
@@ -33,12 +31,16 @@ const serverWithId = (server: ServerWithId | ServerData): ServerWithId => {
 };
 
 export default buildReducer<ServersMap, CreateServersAction & DeleteServerAction & SetAutoConnectAction>({
-  [CREATE_SERVERS]: (state, { newServers }) => ({ ...state, ...newServers }),
+  [CREATE_SERVERS]: (state, { payload: newServers }) => ({ ...state, ...newServers }),
-  [DELETE_SERVER]: (state, { serverId }) => dissoc(serverId, state),
+  [DELETE_SERVER]: (state, { payload }) => dissoc(payload.serverId, state),
-  [EDIT_SERVER]: (state, { serverId, serverData }: any) => (
+  [EDIT_SERVER]: (state, { payload }: any) => {
+    const { serverId, serverData } = payload;
+    return (
       !state[serverId] ? state : assoc(serverId, { ...state[serverId], ...serverData }, state)
-  ),
+    );
-  [SET_AUTO_CONNECT]: (state, { serverId, autoConnect }) => {
+  },
+  [SET_AUTO_CONNECT]: (state, { payload }) => {
+    const { serverId, autoConnect } = payload;
     if (!state[serverId]) {
       return state;
     }
@@ -61,21 +63,22 @@ const serversListToMap = reduce<ServerWithId, ServersMap>((acc, server) => assoc
 export const createServers = pipe(
   map(serverWithId),
   serversListToMap,
-  (newServers: ServersMap) => ({ type: CREATE_SERVERS, newServers }),
+  (newServers: ServersMap) => ({ type: CREATE_SERVERS, payload: newServers }),
 );
 
 export const createServer = (server: ServerWithId) => createServers([server]);
 
 export const editServer = (serverId: string, serverData: Partial<ServerData>) => ({
   type: EDIT_SERVER,
-  serverId,
+  payload: { serverId, serverData },
-  serverData,
 });
 
-export const deleteServer = ({ id }: ServerWithId): DeleteServerAction => ({ type: DELETE_SERVER, serverId: id });
+export const deleteServer = ({ id }: ServerWithId): DeleteServerAction => ({
+  type: DELETE_SERVER,
+  payload: { serverId: id },
+});
 
 export const setAutoConnect = ({ id }: ServerWithId, autoConnect: boolean): SetAutoConnectAction => ({
   type: SET_AUTO_CONNECT,
-  serverId: id,
+  payload: { serverId: id, autoConnect },
-  autoConnect,
 });

test/servers/reducers/remoteServers.test.ts

@@ -87,7 +87,7 @@ describe('remoteServersReducer', () => {
 
       await fetchServers(axios)()(dispatch);
 
-      expect(dispatch).toHaveBeenCalledWith({ type: CREATE_SERVERS, newServers: expectedNewServers });
+      expect(dispatch).toHaveBeenCalledWith({ type: CREATE_SERVERS, payload: expectedNewServers });
       expect(get).toHaveBeenCalledTimes(1);
     });
   });

test/servers/reducers/servers.test.ts

@@ -13,7 +13,7 @@ import reducer, {
 } from '../../../src/servers/reducers/servers';
 import { RegularServer } from '../../../src/servers/data';
 
-describe('serverReducer', () => {
+describe('serversReducer', () => {
   const list = {
     abc123: Mock.of<RegularServer>({ id: 'abc123' }),
     def456: Mock.of<RegularServer>({ id: 'def456' }),
@@ -23,32 +23,35 @@ describe('serverReducer', () => {
 
   describe('reducer', () => {
     it('returns edited server when action is EDIT_SERVER', () =>
-      expect(reducer(
+      expect(reducer(list, {
-        list,
+        type: EDIT_SERVER,
-        { type: EDIT_SERVER, serverId: 'abc123', serverData: { foo: 'foo' } } as any,
+        payload: { serverId: 'abc123', serverData: { foo: 'foo' } },
-      )).toEqual({
+      } as any)).toEqual({
         abc123: { id: 'abc123', foo: 'foo' },
         def456: { id: 'def456' },
       }));
 
     it('returns as it is when action is EDIT_SERVER and server does not exist', () =>
-      expect(reducer(
+      expect(reducer(list, {
-        list,
+        type: EDIT_SERVER,
-        { type: EDIT_SERVER, serverId: 'invalid', serverData: { foo: 'foo' } } as any,
+        payload: { serverId: 'invalid', serverData: { foo: 'foo' } },
-      )).toEqual({
+      } as any)).toEqual({
         abc123: { id: 'abc123' },
         def456: { id: 'def456' },
       }));
 
     it('removes server when action is DELETE_SERVER', () =>
-      expect(reducer(list, { type: DELETE_SERVER, serverId: 'abc123' } as any)).toEqual({
+      expect(reducer(list, {
+        type: DELETE_SERVER,
+        payload: { serverId: 'abc123' },
+      } as any)).toEqual({
         def456: { id: 'def456' },
       }));
 
     it('appends server when action is CREATE_SERVERS', () =>
       expect(reducer(list, {
         type: CREATE_SERVERS,
-        newServers: {
+        payload: {
           ghi789: { id: 'ghi789' },
         },
       } as any)).toEqual({
@@ -63,8 +66,7 @@ describe('serverReducer', () => {
     ])('returns state as it is when trying to set auto-connect on invalid server', (autoConnect) =>
       expect(reducer(list, {
         type: SET_AUTO_CONNECT,
-        serverId: 'invalid',
+        payload: { serverId: 'invalid', autoConnect },
-        autoConnect,
       } as any)).toEqual({
         abc123: { id: 'abc123' },
         def456: { id: 'def456' },
@@ -78,8 +80,7 @@ describe('serverReducer', () => {
 
       expect(reducer(listWithDisabledAutoConnect, {
         type: SET_AUTO_CONNECT,
-        serverId: 'abc123',
+        payload: { serverId: 'abc123', autoConnect: false },
-        autoConnect: false,
       } as any)).toEqual({
         abc123: { id: 'abc123', autoConnect: false },
         def456: { id: 'def456' },
@@ -94,8 +95,7 @@ describe('serverReducer', () => {
 
       expect(reducer(listWithEnabledAutoConnect, {
         type: SET_AUTO_CONNECT,
-        serverId: 'def456',
+        payload: { serverId: 'def456', autoConnect: true },
-        autoConnect: true,
       } as any)).toEqual({
         abc123: { id: 'abc123', autoConnect: false },
         def456: { id: 'def456', autoConnect: true },
@@ -118,7 +118,10 @@ describe('serverReducer', () => {
         const serverData = { name: 'edited' };
         const result = editServer('123', serverData);
 
-        expect(result).toEqual({ type: EDIT_SERVER, serverId: '123', serverData });
+        expect(result).toEqual({
+          type: EDIT_SERVER,
+          payload: { serverId: '123', serverData },
+        });
       });
     });
 
@@ -127,7 +130,10 @@ describe('serverReducer', () => {
         const serverToDelete = Mock.of<RegularServer>({ id: 'abc123' });
         const result = deleteServer(serverToDelete);
 
-        expect(result).toEqual({ type: DELETE_SERVER, serverId: 'abc123' });
+        expect(result).toEqual({
+          type: DELETE_SERVER,
+          payload: { serverId: 'abc123' },
+        });
       });
     });
 
@@ -141,9 +147,9 @@ describe('serverReducer', () => {
 
       it('generates an id for every provided server if they do not have it', () => {
         const servers = values(list).map(dissoc('id'));
-        const { newServers } = createServers(servers);
+        const { payload } = createServers(servers);
 
-        expect(values(newServers).every(({ id }) => !!id)).toEqual(true);
+        expect(values(payload).every(({ id }) => !!id)).toEqual(true);
       });
     });
 
@@ -155,7 +161,10 @@ describe('serverReducer', () => {
         const serverToEdit = Mock.of<RegularServer>({ id: 'abc123' });
         const result = setAutoConnect(serverToEdit, autoConnect);
 
-        expect(result).toEqual({ type: SET_AUTO_CONNECT, serverId: 'abc123', autoConnect });
+        expect(result).toEqual({
+          type: SET_AUTO_CONNECT,
+          payload: { serverId: 'abc123', autoConnect },
+        });
       });
     });
   });