From 3f86a8a6d26d71142f5b9a2d7238ef37e6f0852a Mon Sep 17 00:00:00 2001
From: ioedeveloper <daviddisu8@gmail.com>
Date: Tue, 24 Oct 2023 14:33:15 +0100
Subject: [PATCH] Improve workspace typings

---
 .../workspace/src/lib/actions/index.ts        |  15 +--
 .../workspace/src/lib/actions/payload.ts      | 118 ++++++++++--------
 .../workspace/src/lib/actions/workspace.ts    |  18 +--
 .../workspace/src/lib/reducers/workspace.ts   |  95 ++++----------
 .../remix-ui/workspace/src/lib/types/index.ts | 112 ++++++++++++++++-
 5 files changed, 214 insertions(+), 144 deletions(-)

diff --git a/libs/remix-ui/workspace/src/lib/actions/index.ts b/libs/remix-ui/workspace/src/lib/actions/index.ts
index 9b8691319d..82f71e40f4 100644
--- a/libs/remix-ui/workspace/src/lib/actions/index.ts
+++ b/libs/remix-ui/workspace/src/lib/actions/index.ts
@@ -9,6 +9,7 @@ import { QueryParams } from '@remix-project/remix-lib'
 import { fetchContractFromEtherscan } from '@remix-project/core-plugin' // eslint-disable-line
 import JSZip from 'jszip'
 import isElectron  from 'is-electron'
+import { Actions, FileTree } from '../types'
 
 export * from './events'
 export * from './workspace'
@@ -16,7 +17,7 @@ export * from './workspace'
 const queryParams = new QueryParams()
 const _paq = window._paq = window._paq || []
 
-let plugin, dispatch: React.Dispatch<any>
+let plugin, dispatch: React.Dispatch<Actions>
 
 export type UrlParametersType = {
   gist: string,
@@ -43,7 +44,7 @@ const basicWorkspaceInit = async (workspaces: { name: string; isGitRepo: boolean
   }
 }
 
-export const initWorkspace = (filePanelPlugin) => async (reducerDispatch: React.Dispatch<any>) => {
+export const initWorkspace = (filePanelPlugin) => async (reducerDispatch: React.Dispatch<Actions>) => {
   if (filePanelPlugin) {
     plugin = filePanelPlugin
     dispatch = reducerDispatch
@@ -144,18 +145,18 @@ export const initWorkspace = (filePanelPlugin) => async (reducerDispatch: React.
 export const fetchDirectory = async (path: string) => {
   const provider = plugin.fileManager.currentFileProvider()
   const promise = new Promise((resolve) => {
-    provider.resolveDirectory(path, (error, fileTree) => {
+    provider.resolveDirectory(path, (error, fileTree: FileTree) => {
       if (error) console.error(error)
 
       resolve(fileTree)
     })
   })
 
-  dispatch(fetchDirectoryRequest(promise))
-  promise.then((fileTree) => {
+  dispatch(fetchDirectoryRequest())
+  promise.then((fileTree: FileTree) => {
     dispatch(fetchDirectorySuccess(path, fileTree))
-  }).catch((error) => {
-    dispatch(fetchDirectoryError({ error }))
+  }).catch((error: ErrorEvent) => {
+    dispatch(fetchDirectoryError(error.message))
   })
   return promise
 }
diff --git a/libs/remix-ui/workspace/src/lib/actions/payload.ts b/libs/remix-ui/workspace/src/lib/actions/payload.ts
index ea804ce2d1..6f5d5793cb 100644
--- a/libs/remix-ui/workspace/src/lib/actions/payload.ts
+++ b/libs/remix-ui/workspace/src/lib/actions/payload.ts
@@ -1,292 +1,300 @@
 import { fileDecoration } from '@remix-ui/file-decorators'
-import { action } from '../types'
+import { Action, ActionPayloadTypes, FileTree, WorkspaceElement, action } from '../types'
 
-export const setCurrentWorkspace = (workspace: { name: string; isGitRepo: boolean; }) => {
+export const setCurrentWorkspace = (workspace: { name: string; isGitRepo: boolean; }): Action<'SET_CURRENT_WORKSPACE'> => {
   return {
     type: 'SET_CURRENT_WORKSPACE',
     payload: workspace
   }
 }
 
-export const setWorkspaces = (workspaces: { name: string; isGitRepo: boolean; }[]) => {
+export const setWorkspaces = (workspaces: { name: string; isGitRepo: boolean; }[]): Action<'SET_WORKSPACES'> => {
   return {
     type: 'SET_WORKSPACES',
     payload: workspaces
   }
 }
 
-export const setMode = (mode: 'browser' | 'localhost') => {
+export const setMode = (mode: 'browser' | 'localhost'): Action<'SET_MODE'> => {
   return {
     type: 'SET_MODE',
     payload: mode
   }
 }
 
-export const fetchDirectoryError = (error: any) => {
+export const fetchDirectoryError = (error: string): Action<'FETCH_DIRECTORY_ERROR'> => {
   return {
     type: 'FETCH_DIRECTORY_ERROR',
     payload: error
   }
 }
 
-export const fetchDirectoryRequest = (promise: Promise<any>) => {
+export const fetchDirectoryRequest = (): Action<'FETCH_DIRECTORY_REQUEST'> => {
   return {
     type: 'FETCH_DIRECTORY_REQUEST',
-    payload: promise
+    payload: undefined
   }
 }
 
-export const fetchDirectorySuccess = (path: string, fileTree) => {
+export const fetchDirectorySuccess = (path: string, fileTree: FileTree): Action<'FETCH_DIRECTORY_SUCCESS'> => {
   return {
     type: 'FETCH_DIRECTORY_SUCCESS',
     payload: { path, fileTree }
   }
 }
 
-export const displayNotification = (title: string, message: string, labelOk: string, labelCancel: string, actionOk?: (...args) => void, actionCancel?: (...args) => void) => {
+export const displayNotification = (title: string, message: string, labelOk: string, labelCancel: string, actionOk?: (...args) => void, actionCancel?: (...args) => void): Action<'DISPLAY_NOTIFICATION'> => {
   return {
     type: 'DISPLAY_NOTIFICATION',
     payload: { title, message, labelOk, labelCancel, actionOk, actionCancel }
   }
 }
 
-export const hideNotification = () => {
+export const hideNotification = (): Action<'HIDE_NOTIFICATION'> => {
   return {
-    type: 'HIDE_NOTIFICATION'
+    type: 'HIDE_NOTIFICATION',
+    payload: null
   }
 }
 
-export const fileAddedSuccess = (filePath: string) => {
+export const fileAddedSuccess = (filePath: string): Action<'FILE_ADDED_SUCCESS'> => {
   return {
     type: 'FILE_ADDED_SUCCESS',
     payload: filePath
   }
 }
 
-export const folderAddedSuccess = (path: string, folderPath: string, fileTree) => {
+export const folderAddedSuccess = (path: string, folderPath: string, fileTree: FileTree): Action<'FOLDER_ADDED_SUCCESS'> => {
   return {
     type: 'FOLDER_ADDED_SUCCESS',
     payload: { path, folderPath, fileTree }
   }
 }
 
-export const fileRemovedSuccess = (removePath: string) => {
+export const fileRemovedSuccess = (removePath: string): Action<'FILE_REMOVED_SUCCESS'> => {
   return {
     type: 'FILE_REMOVED_SUCCESS',
     payload: removePath
   }
 }
 
-export const fileRenamedSuccess = (path: string, oldPath: string, fileTree) => {
+export const fileRenamedSuccess = (path: string, oldPath: string, fileTree: FileTree): Action<'FILE_RENAMED_SUCCESS'> => {
   return {
     type: 'FILE_RENAMED_SUCCESS',
     payload: { path, oldPath, fileTree }
   }
 }
 
-export const rootFolderChangedSuccess = (path: string) => {
+export const rootFolderChangedSuccess = (path: string): Action<'ROOT_FOLDER_CHANGED'> => {
   return {
     type: 'ROOT_FOLDER_CHANGED',
     payload: path
   }
 }
 
-export const addInputFieldSuccess = (path: string, fileTree, type: 'file' | 'folder' | 'gist') => {
+export const addInputFieldSuccess = (path: string, fileTree: FileTree, type: 'file' | 'folder'): Action<'ADD_INPUT_FIELD'> => {
   return {
     type: 'ADD_INPUT_FIELD',
     payload: { path, fileTree, type }
   }
 }
 
-export const removeInputFieldSuccess = (path: string) => {
+export const removeInputFieldSuccess = (path: string): Action<'REMOVE_INPUT_FIELD'> => {
   return {
     type: 'REMOVE_INPUT_FIELD',
     payload: { path }
   }
 }
 
-export const setReadOnlyMode = (mode: boolean) => {
+export const setReadOnlyMode = (mode: boolean): Action<'SET_READ_ONLY_MODE'> => {
   return {
     type: 'SET_READ_ONLY_MODE',
     payload: mode
   }
 }
 
-export const createWorkspaceError = (error: any) => {
+export const createWorkspaceError = (error: string): Action<'CREATE_WORKSPACE_ERROR'> => {
   return {
     type: 'CREATE_WORKSPACE_ERROR',
     payload: error
   }
 }
 
-export const createWorkspaceRequest = (promise: Promise<any>) => {
+export const createWorkspaceRequest = (): Action<'CREATE_WORKSPACE_REQUEST'> => {
   return {
     type: 'CREATE_WORKSPACE_REQUEST',
-    payload: promise
+    payload: null
   }
 }
 
-export const createWorkspaceSuccess = (workspaceName: { name: string; isGitRepo: boolean; branches?: { remote: any; name: string; }[], currentBranch?: string }) => {
+export const createWorkspaceSuccess = (workspaceName: ActionPayloadTypes['CREATE_WORKSPACE_SUCCESS']): Action<'CREATE_WORKSPACE_SUCCESS'> => {
   return {
     type: 'CREATE_WORKSPACE_SUCCESS',
     payload: workspaceName
   }
 }
 
-export const fetchWorkspaceDirectoryError = (error: any) => {
+export const fetchWorkspaceDirectoryError = (error: string): Action<'FETCH_WORKSPACE_DIRECTORY_ERROR'> => {
   return {
     type: 'FETCH_WORKSPACE_DIRECTORY_ERROR',
     payload: error
   }
 }
 
-export const fetchWorkspaceDirectoryRequest = (promise: Promise<any>) => {
+export const fetchWorkspaceDirectoryRequest = (): Action<'FETCH_WORKSPACE_DIRECTORY_REQUEST'> => {
   return {
     type: 'FETCH_WORKSPACE_DIRECTORY_REQUEST',
-    payload: promise
+    payload: null
   }
 }
 
-export const fetchWorkspaceDirectorySuccess = (path: string, fileTree) => {
+export const fetchWorkspaceDirectorySuccess = (path: string, fileTree: FileTree): Action<'FETCH_WORKSPACE_DIRECTORY_SUCCESS'> => {
   return {
     type: 'FETCH_WORKSPACE_DIRECTORY_SUCCESS',
     payload: { path, fileTree }
   }
 }
 
-export const setRenameWorkspace = (oldName: string, workspaceName: string) => {
+export const setRenameWorkspace = (oldName: string, workspaceName: string): Action<'RENAME_WORKSPACE'> => {
   return {
     type: 'RENAME_WORKSPACE',
     payload: { oldName, workspaceName }
   }
 }
 
-export const setDeleteWorkspace = (workspaceName: string) => {
+export const setDeleteWorkspace = (workspaceName: string): Action<'DELETE_WORKSPACE'> => {
   return {
     type: 'DELETE_WORKSPACE',
     payload: workspaceName
   }
 }
 
-export const displayPopUp = (message: string) => {
+export const displayPopUp = (message: string): Action<'DISPLAY_POPUP_MESSAGE'> => {
   return {
     type: 'DISPLAY_POPUP_MESSAGE',
     payload: message
   }
 }
 
-export const hidePopUp = () => {
+export const hidePopUp = (): Action<'HIDE_POPUP_MESSAGE'> => {
   return {
-    type: 'HIDE_POPUP_MESSAGE'
+    type: 'HIDE_POPUP_MESSAGE',
+    payload: null
   }
 }
 
-export const focusElement = (elements: { key: string, type: 'file' | 'folder' | 'gist' }[]) => {
+export const focusElement = (elements: { key: string, type: WorkspaceElement }[]): Action<'SET_FOCUS_ELEMENT'> => {
   return {
     type: 'SET_FOCUS_ELEMENT',
     payload: elements
   }
 }
 
-export const removeFocus = (name: string) => {
+export const removeFocus = (name: string): Action<'REMOVE_FOCUS_ELEMENT'> => {
   return {
     type: 'REMOVE_FOCUS_ELEMENT',
     payload: name
   }
 }
 
-export const setContextMenuItem = (item: action) => {
+export const setContextMenuItem = (item: action): Action<'SET_CONTEXT_MENU_ITEM'> => {
   return {
     type: 'SET_CONTEXT_MENU_ITEM',
     payload: item
   }
 }
 
-export const removeContextMenuItem = (plugin) => {
+export const removeContextMenuItem = (plugin: { name: string }): Action<'REMOVE_CONTEXT_MENU_ITEM'> => {
   return {
     type: 'REMOVE_CONTEXT_MENU_ITEM',
     payload: plugin
   }
 }
 
-export const setExpandPath = (paths: string[]) => {
+export const setExpandPath = (paths: string[]): Action<'SET_EXPAND_PATH'> => {
   return {
     type: 'SET_EXPAND_PATH',
     payload: paths
   }
 }
 
-export const loadLocalhostError = (error: any) => {
+export const loadLocalhostError = (error: string): Action<'LOAD_LOCALHOST_ERROR'> => {
   return {
     type: 'LOAD_LOCALHOST_ERROR',
     payload: error
   }
 }
 
-export const loadLocalhostRequest = () => {
+export const loadLocalhostRequest = (): Action<'LOAD_LOCALHOST_REQUEST'> => {
   return {
-    type: 'LOAD_LOCALHOST_REQUEST'
+    type: 'LOAD_LOCALHOST_REQUEST',
+    payload: null
   }
 }
 
-export const loadLocalhostSuccess = () => {
+export const loadLocalhostSuccess = (): Action<'LOAD_LOCALHOST_SUCCESS'> => {
   return {
-    type: 'LOAD_LOCALHOST_SUCCESS'
+    type: 'LOAD_LOCALHOST_SUCCESS',
+    payload: null
   }
 }
 
-export const fsInitializationCompleted = () => {
+export const fsInitializationCompleted = (): Action<'FS_INITIALIZATION_COMPLETED'> => {
   return {
-    type: 'FS_INITIALIZATION_COMPLETED'
+    type: 'FS_INITIALIZATION_COMPLETED',
+    payload: null
   }
 }
 
-export const setFileDecorationSuccess = (items: fileDecoration[]) => {
+export const setFileDecorationSuccess = (items: fileDecoration[]): Action<'SET_FILE_DECORATION_SUCCESS'> => {
   return {
     type: 'SET_FILE_DECORATION_SUCCESS',
     payload: items
   }
 }
-export const cloneRepositoryRequest = () => {
+export const cloneRepositoryRequest = (): Action<'CLONE_REPOSITORY_REQUEST'> => {
   return {
-    type: 'CLONE_REPOSITORY_REQUEST'
+    type: 'CLONE_REPOSITORY_REQUEST',
+    payload: null
   }
 }
 
-export const cloneRepositorySuccess = () => {
+export const cloneRepositorySuccess = (): Action<'CLONE_REPOSITORY_SUCCESS'> => {
   return {
-    type: 'CLONE_REPOSITORY_SUCCESS'
+    type: 'CLONE_REPOSITORY_SUCCESS',
+    payload: null
   }
 }
 
-export const cloneRepositoryFailed = () => {
+export const cloneRepositoryFailed = (): Action<'CLONE_REPOSITORY_FAILED'> => {
   return {
-    type: 'CLONE_REPOSITORY_FAILED'
+    type: 'CLONE_REPOSITORY_FAILED',
+    payload: null
   }
 }
 
-export const setCurrentWorkspaceBranches = (branches?: { remote: any, name: string }[]) => {
+export const setCurrentWorkspaceBranches = (branches?: { remote: any, name: string }[]): Action<'SET_CURRENT_WORKSPACE_BRANCHES'> => {
   return {
     type: 'SET_CURRENT_WORKSPACE_BRANCHES',
     payload: branches
   }
 }
 
-export const setCurrentWorkspaceCurrentBranch = (currentBranch?: string) => {
+export const setCurrentWorkspaceCurrentBranch = (currentBranch?: string): Action<'SET_CURRENT_WORKSPACE_CURRENT_BRANCH'> => {
   return {
     type: 'SET_CURRENT_WORKSPACE_CURRENT_BRANCH',
     payload: currentBranch
   }
 }
 
-export const setCurrentWorkspaceIsGitRepo = (isRepo: boolean) => {
+export const setCurrentWorkspaceIsGitRepo = (isRepo: boolean): Action<'SET_CURRENT_WORKSPACE_IS_GITREPO'> => {
   return {
     type: 'SET_CURRENT_WORKSPACE_IS_GITREPO',
     payload: isRepo
   }
 }
 
-export const setGitConfig = (config: {username: string, token: string, email: string}) => {
+export const setGitConfig = (config: {username: string, token: string, email: string}): Action<'SET_GIT_CONFIG'> => {
   return {
     type: 'SET_GIT_CONFIG',
     payload: config
diff --git a/libs/remix-ui/workspace/src/lib/actions/workspace.ts b/libs/remix-ui/workspace/src/lib/actions/workspace.ts
index 37652f1b04..e00840d36c 100644
--- a/libs/remix-ui/workspace/src/lib/actions/workspace.ts
+++ b/libs/remix-ui/workspace/src/lib/actions/workspace.ts
@@ -5,7 +5,7 @@ import axios, { AxiosResponse } from 'axios'
 import { addInputFieldSuccess, cloneRepositoryFailed, cloneRepositoryRequest, cloneRepositorySuccess, createWorkspaceError, createWorkspaceRequest, createWorkspaceSuccess, displayNotification, displayPopUp, fetchWorkspaceDirectoryError, fetchWorkspaceDirectoryRequest, fetchWorkspaceDirectorySuccess, hideNotification, setCurrentWorkspace, setCurrentWorkspaceBranches, setCurrentWorkspaceCurrentBranch, setDeleteWorkspace, setMode, setReadOnlyMode, setRenameWorkspace, setCurrentWorkspaceIsGitRepo, setGitConfig } from './payload'
 import { addSlash, checkSlash, checkSpecialChars } from '@remix-ui/helper'
 
-import { JSONStandardInput, WorkspaceTemplate } from '../types'
+import { FileTree, JSONStandardInput, WorkspaceTemplate } from '../types'
 import { QueryParams } from '@remix-project/remix-lib'
 import * as templateWithContent from '@remix-project/remix-ws-templates'
 import { ROOT_PATH, slitherYml, solTestYml, tsSolTestYml } from '../utils/constants'
@@ -58,8 +58,8 @@ export const setPlugin = (filePanelPlugin, reducerDispatch) => {
 
 export const addInputField = async (type: 'file' | 'folder', path: string, cb?: (err: Error, result?: string | number | boolean | Record<string, any>) => void) => {
   const provider = plugin.fileManager.currentFileProvider()
-  const promise = new Promise((resolve, reject) => {
-    provider.resolveDirectory(path, (error, fileTree) => {
+  const promise: Promise<FileTree> = new Promise((resolve, reject) => {
+    provider.resolveDirectory(path, (error, fileTree: FileTree) => {
       if (error) {
         cb && cb(error)
         return reject(error)
@@ -85,7 +85,7 @@ const removeSlash = (s: string) => {
 export const createWorkspace = async (workspaceName: string, workspaceTemplateName: WorkspaceTemplate, opts = null, isEmpty = false, cb?: (err: Error, result?: string | number | boolean | Record<string, any>) => void, isGitRepo: boolean = false, createCommit: boolean = true) => {
   await plugin.fileManager.closeAllFiles()
   const promise = createWorkspaceTemplate(workspaceName, workspaceTemplateName)
-  dispatch(createWorkspaceRequest(promise))
+  dispatch(createWorkspaceRequest())
   promise.then(async () => {
     dispatch(createWorkspaceSuccess({ name: workspaceName, isGitRepo }))
     await plugin.setWorkspace({ name: workspaceName, isLocalhost: false })
@@ -139,7 +139,7 @@ export const createWorkspace = async (workspaceName: string, workspaceTemplateNa
     // this call needs to be here after the callback because it calls dGitProvider which also calls this function and that would cause an infinite loop
     await plugin.setWorkspaces(await getWorkspaces())
   }).catch((error) => {
-    dispatch(createWorkspaceError({ error }))
+    dispatch(createWorkspaceError(error.message))
     cb && cb(error)
   })
   return promise
@@ -269,19 +269,19 @@ export const workspaceExists = async (name: string) => {
 export const fetchWorkspaceDirectory = async (path: string) => {
   if (!path) return
   const provider = plugin.fileManager.currentFileProvider()
-  const promise = new Promise((resolve) => {
-    provider.resolveDirectory(path, (error, fileTree) => {
+  const promise: Promise<FileTree> = new Promise((resolve) => {
+    provider.resolveDirectory(path, (error, fileTree: FileTree) => {
       if (error) console.error(error)
 
       resolve(fileTree)
     })
   })
 
-  dispatch(fetchWorkspaceDirectoryRequest(promise))
+  dispatch(fetchWorkspaceDirectoryRequest())
   promise.then((fileTree) => {
     dispatch(fetchWorkspaceDirectorySuccess(path, fileTree))
   }).catch((error) => {
-    dispatch(fetchWorkspaceDirectoryError({ error }))
+    dispatch(fetchWorkspaceDirectoryError(error.message))
   })
   return promise
 }
diff --git a/libs/remix-ui/workspace/src/lib/reducers/workspace.ts b/libs/remix-ui/workspace/src/lib/reducers/workspace.ts
index 1058dfb8a4..05163370c0 100644
--- a/libs/remix-ui/workspace/src/lib/reducers/workspace.ts
+++ b/libs/remix-ui/workspace/src/lib/reducers/workspace.ts
@@ -1,12 +1,8 @@
 import {extractNameFromKey} from '@remix-ui/helper'
-import {action, FileType} from '../types'
+import {action, Actions, FileType} from '../types'
 import * as _ from 'lodash'
 import {fileDecoration} from '@remix-ui/file-decorators'
 import {ROOT_PATH} from '../utils/constants'
-interface Action {
-  type: string
-  payload: any
-}
 export interface BrowserState {
   browser: {
     currentWorkspace: string
@@ -121,15 +117,10 @@ export const browserInitialState: BrowserState = {
   gitConfig: {username: '', email: '', token: ''}
 }
 
-export const browserReducer = (state = browserInitialState, action: Action) => {
+export const browserReducer = (state = browserInitialState, action: Actions) => {
   switch (action.type) {
   case 'SET_CURRENT_WORKSPACE': {
-    const payload = action.payload as {
-        name: string
-        isGitRepo: boolean
-        branches?: {remote: any; name: string}[]
-        currentBranch?: string
-      }
+    const payload = action.payload
     const workspaces = state.browser.workspaces.find(
       ({name}) => name === payload.name
     )
@@ -147,12 +138,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'SET_WORKSPACES': {
-    const payload = action.payload as {
-        name: string
-        isGitRepo: boolean
-        branches?: {remote: any; name: string}[]
-        currentBranch?: string
-      }[]
+    const payload = action.payload
 
     return {
       ...state,
@@ -164,7 +150,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'SET_MODE': {
-    const payload = action.payload as 'browser' | 'localhost'
+    const payload = action.payload
 
     return {
       ...state,
@@ -191,7 +177,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'FETCH_DIRECTORY_SUCCESS': {
-    const payload = action.payload as {path: string; fileTree}
+    const payload = action.payload
 
     return {
       ...state,
@@ -255,7 +241,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'FETCH_WORKSPACE_DIRECTORY_SUCCESS': {
-    const payload = action.payload as {path: string; fileTree}
+    const payload = action.payload
 
     return {
       ...state,
@@ -302,14 +288,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'DISPLAY_NOTIFICATION': {
-    const payload = action.payload as {
-        title: string
-        message: string
-        actionOk: () => void
-        actionCancel: () => void
-        labelOk: string
-        labelCancel: string
-      }
+    const payload = action.payload
 
     return {
       ...state,
@@ -335,7 +314,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'FILE_ADDED_SUCCESS': {
-    const payload = action.payload as string
+    const payload = action.payload
 
     return {
       ...state,
@@ -365,11 +344,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'FOLDER_ADDED_SUCCESS': {
-    const payload = action.payload as {
-        path: string
-        folderPath: string
-        fileTree
-      }
+    const payload = action.payload
 
     return {
       ...state,
@@ -404,7 +379,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'FILE_REMOVED_SUCCESS': {
-    const payload = action.payload as string
+    const payload = action.payload
 
     return {
       ...state,
@@ -446,11 +421,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'ADD_INPUT_FIELD': {
-    const payload = action.payload as {
-        path: string
-        fileTree
-        type: 'file' | 'folder'
-      }
+    const payload = action.payload
 
     return {
       ...state,
@@ -473,7 +444,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'REMOVE_INPUT_FIELD': {
-    const payload = action.payload as {path: string; fileTree}
+    const payload = action.payload
 
     return {
       ...state,
@@ -496,7 +467,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'SET_READ_ONLY_MODE': {
-    const payload = action.payload as boolean
+    const payload = action.payload
 
     return {
       ...state,
@@ -505,11 +476,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'FILE_RENAMED_SUCCESS': {
-    const payload = action.payload as {
-        path: string
-        oldPath: string
-        fileTree
-      }
+    const payload = action.payload
 
     return {
       ...state,
@@ -543,12 +510,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'CREATE_WORKSPACE_SUCCESS': {
-    const payload = action.payload as {
-        name: string
-        isGitRepo: boolean
-        branches?: {remote: any; name: string}[]
-        currentBranch?: string
-      }
+    const payload = action.payload
     const workspaces = state.browser.workspaces.find(
       ({name}) => name === payload.name
     )
@@ -581,7 +543,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'RENAME_WORKSPACE': {
-    const payload = action.payload as {oldName: string; workspaceName: string}
+    const payload = action.payload
     let renamedWorkspace
     const workspaces = state.browser.workspaces.filter(
       ({name, isGitRepo, branches, currentBranch}) => {
@@ -611,7 +573,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'DELETE_WORKSPACE': {
-    const payload = action.payload as string
+    const payload = action.payload
     const workspaces = state.browser.workspaces.filter(
       ({name}) => name && name !== payload
     )
@@ -626,7 +588,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'DISPLAY_POPUP_MESSAGE': {
-    const payload = action.payload as string
+    const payload = action.payload
 
     return {
       ...state,
@@ -642,10 +604,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'SET_FOCUS_ELEMENT': {
-    const payload = action.payload as {
-        key: string
-        type: 'file' | 'folder' | 'gist'
-      }[]
+    const payload = action.payload
 
     return {
       ...state,
@@ -654,7 +613,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'REMOVE_FOCUS_ELEMENT': {
-    const payload: string = action.payload
+    const payload = action.payload
 
     return {
       ...state,
@@ -665,7 +624,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'SET_CONTEXT_MENU_ITEM': {
-    const payload = action.payload as action
+    const payload = action.payload
 
     return {
       ...state,
@@ -801,7 +760,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'SET_CURRENT_WORKSPACE_BRANCHES': {
-    const payload: {remote: any; name: string}[] = action.payload
+    const payload = action.payload
 
     return {
       ...state,
@@ -817,7 +776,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'SET_CURRENT_WORKSPACE_CURRENT_BRANCH': {
-    const payload: string = action.payload
+    const payload = action.payload
 
     return {
       ...state,
@@ -833,7 +792,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'SET_CURRENT_WORKSPACE_IS_GITREPO': {
-    const payload: boolean = action.payload
+    const payload = action.payload
 
     return {
       ...state,
@@ -849,7 +808,7 @@ export const browserReducer = (state = browserInitialState, action: Action) => {
   }
 
   case 'SET_GIT_CONFIG': {
-    const payload: {username: string; token: string; email: string} =
+    const payload =
         action.payload
     return {
       ...state,
@@ -1138,7 +1097,7 @@ const addContextMenuItem = (
 
 const removeContextMenuItem = (
   state: BrowserState,
-  plugin
+  plugin: {name: string}
 ): {
   registeredMenuItems: action[]
   removedMenuItems: action[]
diff --git a/libs/remix-ui/workspace/src/lib/types/index.ts b/libs/remix-ui/workspace/src/lib/types/index.ts
index 5ded4df7d4..27c3c10289 100644
--- a/libs/remix-ui/workspace/src/lib/types/index.ts
+++ b/libs/remix-ui/workspace/src/lib/types/index.ts
@@ -5,7 +5,7 @@ import { fileDecoration } from '@remix-ui/file-decorators'
 import { RemixAppManager } from 'libs/remix-ui/plugin-manager/src/types'
 import { ViewPlugin } from '@remixproject/engine-web'
 
-export type action = { name: string, type?: Array<'folder' | 'gist' | 'file' | 'workspace'>, path?: string[], extension?: string[], pattern?: string[], id: string, multiselect: boolean, label: string, sticky?: boolean, group: number }
+export type action = { name: string, type?: Array<WorkspaceElement>, path?: string[], extension?: string[], pattern?: string[], id: string, multiselect: boolean, label: string, sticky?: boolean, group: number }
 export interface JSONStandardInput {
   language: "Solidity";
   settings?: any,
@@ -114,7 +114,7 @@ export interface FileExplorerProps {
     dispatchMoveFile: (src: string, dest: string) => Promise<void>,
     dispatchMoveFolder: (src: string, dest: string) => Promise<void>,
     handlePasteClick: (dest: string, destType: string) => void
-    handleCopyClick: (path: string, type: 'folder' | 'gist' | 'file' | 'workspace') => void
+    handleCopyClick: (path: string, type: WorkspaceElement) => void
     addMenuItems: (items: MenuItems) => void
     removeMenuItems: (items: MenuItems) => void
     handleContextMenu: (pageX: number, pageY: number, path: string, content: string, type: string) => void
@@ -171,7 +171,7 @@ export interface WorkSpaceState {
     actions: {
       id: string
       name: string
-      type?: Array<'folder' | 'gist' | 'file' | 'workspace'>
+      type?: Array<WorkspaceElement>
       path?: string[]
       extension?: string[]
       pattern?: string[]
@@ -201,5 +201,107 @@ export type  FileFocusContextType = {
 
 export type CopyElementType = {
   key: string
-  type: 'folder' | 'gist' | 'file' | 'workspace'
-}
\ No newline at end of file
+  type: WorkspaceElement
+}
+
+export type FileTree = {
+  [x: string]: {
+    isDirectory: boolean
+  }
+}
+
+export interface ActionPayloadTypes {
+  SET_CURRENT_WORKSPACE: {
+    name: string
+    isGitRepo: boolean
+    branches?: {remote: string | undefined; name: string}[]
+    currentBranch?: string
+  },
+  SET_WORKSPACES: {
+    name: string
+    isGitRepo: boolean
+    branches?: {remote: string | undefined; name: string}[]
+    currentBranch?: string
+  }[],
+  SET_MODE: 'browser' | 'localhost',
+  FETCH_DIRECTORY_REQUEST: undefined | null,
+  FETCH_DIRECTORY_SUCCESS: { path: string; fileTree: FileTree },
+  FETCH_DIRECTORY_ERROR: string,
+  FETCH_WORKSPACE_DIRECTORY_REQUEST: undefined | null,
+  FETCH_WORKSPACE_DIRECTORY_SUCCESS: { path: string; fileTree: FileTree },
+  FETCH_WORKSPACE_DIRECTORY_ERROR: string,
+  DISPLAY_NOTIFICATION: {
+    title: string
+    message: string
+    actionOk: () => void
+    actionCancel: () => void
+    labelOk: string
+    labelCancel: string
+  },
+  HIDE_NOTIFICATION: undefined | null,
+  FILE_ADDED_SUCCESS: string,
+  FOLDER_ADDED_SUCCESS: {
+    path: string
+    folderPath: string
+    fileTree: FileTree
+  },
+  FILE_REMOVED_SUCCESS: string,
+  ROOT_FOLDER_CHANGED: string,
+  ADD_INPUT_FIELD: {
+    path: string
+    fileTree: FileTree
+    type: 'file' | 'folder'
+  },
+  REMOVE_INPUT_FIELD: { path: string; },
+  SET_READ_ONLY_MODE: boolean,
+  FILE_RENAMED_SUCCESS: {
+    path: string
+    oldPath: string
+    fileTree: FileTree
+  },
+  CREATE_WORKSPACE_REQUEST: undefined | null,
+  CREATE_WORKSPACE_SUCCESS: {
+    name: string
+    isGitRepo: boolean
+    branches?: { remote: string | undefined; name: string }[]
+    currentBranch?: string
+  },
+  CREATE_WORKSPACE_ERROR: string,
+  RENAME_WORKSPACE: { oldName: string; workspaceName: string },
+  DELETE_WORKSPACE: string,
+  DISPLAY_POPUP_MESSAGE: string,
+  HIDE_POPUP_MESSAGE: undefined | null,
+  SET_FOCUS_ELEMENT: {
+    key: string
+    type: WorkspaceElement
+  }[],
+  REMOVE_FOCUS_ELEMENT: string,
+  SET_CONTEXT_MENU_ITEM: action,
+  REMOVE_CONTEXT_MENU_ITEM: { name: string },
+  SET_EXPAND_PATH: string[],
+  LOAD_LOCALHOST_REQUEST: undefined | null,
+  LOAD_LOCALHOST_SUCCESS: undefined | null,
+  LOAD_LOCALHOST_ERROR: string,
+  CLONE_REPOSITORY_REQUEST: undefined | null,
+  CLONE_REPOSITORY_SUCCESS: undefined | null,
+  CLONE_REPOSITORY_FAILED: undefined | null,
+  FS_INITIALIZATION_COMPLETED: undefined | null,
+  SET_FILE_DECORATION_SUCCESS: fileDecoration[],
+  SET_CURRENT_WORKSPACE_BRANCHES: { remote: string | undefined; name: string }[],
+  SET_CURRENT_WORKSPACE_CURRENT_BRANCH: string,
+  SET_CURRENT_WORKSPACE_IS_GITREPO: boolean,
+  SET_GIT_CONFIG: {
+    username: string;
+    token: string;
+    email: string
+  }
+}
+
+export interface Action<T extends keyof ActionPayloadTypes> {
+  type: T,
+  payload: ActionPayloadTypes[T]
+}
+
+export type Actions = {[A in keyof ActionPayloadTypes]: Action<A>}[keyof ActionPayloadTypes]
+
+export type WorkspaceElement = 'folder' | 'gist' | 'file' | 'workspace'