refactor console reducers and actions using redux toolkit

Author: PiyushChandra17

client/constants.js

@@ -53,8 +53,6 @@ export const SET_BLOB_URL = 'SET_BLOB_URL';
 export const EXPAND_SIDEBAR = 'EXPAND_SIDEBAR';
 export const COLLAPSE_SIDEBAR = 'COLLAPSE_SIDEBAR';
 
-export const CONSOLE_EVENT = 'CONSOLE_EVENT';
-export const CLEAR_CONSOLE = 'CLEAR_CONSOLE';
 export const EXPAND_CONSOLE = 'EXPAND_CONSOLE';
 export const COLLAPSE_CONSOLE = 'COLLAPSE_CONSOLE';
 

client/modules/IDE/actions/console.js

@@ -1,14 +1,3 @@
-import * as ActionTypes from '../../../constants';
+import { consoleActions } from '../reducers/console';
 
-export function clearConsole() {
-  return {
-    type: ActionTypes.CLEAR_CONSOLE
-  };
-}
-
-export function dispatchConsoleEvent(messages) {
-  return {
-    type: ActionTypes.CONSOLE_EVENT,
-    event: messages
-  };
-}
+export const { dispatchConsoleEvent, clearConsole } = consoleActions;

client/modules/IDE/reducers/console.js

@@ -1,19 +1,20 @@
-import * as ActionTypes from '../../../constants';
+import { createSlice } from '@reduxjs/toolkit';
 
 const consoleMax = 5000;
 const initialState = [];
 
-const console = (state = initialState, action) => {
-  let messages;
-  switch (action.type) {
-    case ActionTypes.CONSOLE_EVENT:
-      messages = [...action.event];
+const consoleSlice = createSlice({
+  name: 'console',
+  initialState,
+  reducers: {
+    dispatchConsoleEvent: (state, action) => {
+      const messages = [...action.event];
       return state.concat(messages).slice(-consoleMax);
-    case ActionTypes.CLEAR_CONSOLE:
-      return [];
-    default:
-      return state;
+    },
+    clearConsole: (state, action) => []
   }
-};
+});
 
-export default console;
+export const consoleActions = consoleSlice.actions;
+
+export default consoleSlice.reducer;