diff --git a/libs/remix-ui/workspace/src/lib/actions/workspace.ts b/libs/remix-ui/workspace/src/lib/actions/workspace.ts
index e7f2d46fb1..842c43eae2 100644
--- a/libs/remix-ui/workspace/src/lib/actions/workspace.ts
+++ b/libs/remix-ui/workspace/src/lib/actions/workspace.ts
@@ -358,6 +358,30 @@ export const switchToWorkspace = async (name: string) => {
   }
 }
 
+const loadFile = (name, file, provider, cb?): void => {
+  const fileReader = new FileReader()
+
+  fileReader.onload = async function (event) {
+    if (checkSpecialChars(file.name)) {
+      return dispatch(displayNotification('File Upload Failed', 'Special characters are not allowed', 'Close', null, async () => { }))
+    }
+    try {
+      await provider.set(name, event.target.result)
+    } catch (error) {
+      return dispatch(displayNotification('File Upload Failed', 'Failed to create file ' + name, 'Close', null, async () => { }))
+    }
+
+    const config = plugin.registry.get('config').api
+    const editor = plugin.registry.get('editor').api
+
+    if ((config.get('currentFile') === name) && (editor.currentContent() !== event.target.result)) {
+      editor.setText(name, event.target.result)
+    }
+  }
+  fileReader.readAsText(file)
+  cb && cb(null, true)
+}
+
 export const uploadFile = async (target, targetFolder: string, cb?: (err: Error, result?: string | number | boolean | Record<string, any>) => void) => {
   // TODO The file explorer is merely a view on the current state of
   // the files module. Please ask the user here if they want to overwrite
@@ -365,43 +389,30 @@ export const uploadFile = async (target, targetFolder: string, cb?: (err: Error,
   // pick that up via the 'fileAdded' event from the files module.
   [...target.files].forEach(async (file) => {
     const workspaceProvider = plugin.fileProviders.workspace
-    const loadFile = (name: string): void => {
-      const fileReader = new FileReader()
-
-      fileReader.onload = async function (event) {
-        if (checkSpecialChars(file.name)) {
-          return dispatch(displayNotification('File Upload Failed', 'Special characters are not allowed', 'Close', null, async () => { }))
-        }
-        try {
-          await workspaceProvider.set(name, event.target.result)
-        } catch (error) {
-          return dispatch(displayNotification('File Upload Failed', 'Failed to create file ' + name, 'Close', null, async () => { }))
-        }
-
-        const config = plugin.registry.get('config').api
-        const editor = plugin.registry.get('editor').api
-
-        if ((config.get('currentFile') === name) && (editor.currentContent() !== event.target.result)) {
-          editor.setText(name, event.target.result)
-        }
-      }
-      fileReader.readAsText(file)
-      cb && cb(null, true)
-    }
     const name = targetFolder === '/' ? file.name : `${targetFolder}/${file.name}`
 
     if (!await workspaceProvider.exists(name)) {
-      loadFile(name)
+      loadFile(name, file, workspaceProvider, cb)
     } else {
       dispatch(displayNotification('Confirm overwrite', `The file ${name} already exists! Would you like to overwrite it?`, 'OK', null, () => {
-        loadFile(name)
+        loadFile(name, file, workspaceProvider, cb)
       }, () => { }))
     }
   })
 }
 
 export const uploadFolder = async (target, targetFolder: string, cb?: (err: Error, result?: string | number | boolean | Record<string, any>) => void) => {
-  console.log('inside uploadFolder--target-->', target)
+  for(const file of [...target.files]) {
+    const workspaceProvider = plugin.fileProviders.workspace
+    const name = targetFolder === '/' ? file.webkitRelativePath : `${targetFolder}/${file.webkitRelativePath}`
+    if (!await workspaceProvider.exists(name)) {
+      loadFile(name, file, workspaceProvider, cb)
+    } else {
+      dispatch(displayNotification('Confirm overwrite', `The file ${name} already exists! Would you like to overwrite it?`, 'OK', null, () => {
+        loadFile(name, file, workspaceProvider, cb)
+      }, () => { }))
+    }
+  }
 }
 
 export const getWorkspaces = async (): Promise<{ name: string, isGitRepo: boolean, branches?: { remote: any; name: string; }[], currentBranch?: string }[]> | undefined => {