diff --git a/src/assets/images/copy-files.svg b/src/assets/images/copy-files.svg
new file mode 100644
index 0000000..d918be8
--- /dev/null
+++ b/src/assets/images/copy-files.svg
@@ -0,0 +1,3 @@
+<svg class="w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
+  <path stroke="white" stroke-linejoin="round" stroke-width="2" d="M14 4v3a1 1 0 0 1-1 1h-3m4 10v1a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h2m11-3v10a1 1 0 0 1-1 1h-7a1 1 0 0 1-1-1V7.87a1 1 0 0 1 .24-.65l2.46-2.87a1 1 0 0 1 .76-.35H18a1 1 0 0 1 1 1Z"/>
+</svg>
diff --git a/src/components/dialogs/copyfiledlg.tsx b/src/components/dialogs/copyfiledlg.tsx
new file mode 100644
index 0000000..d795a76
--- /dev/null
+++ b/src/components/dialogs/copyfiledlg.tsx
@@ -0,0 +1,221 @@
+import { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import ProgressBar from 'react-customizable-progressbar';
+import { FaArrowRight } from 'react-icons/fa';
+import Button from '@/widgets/button';
+import AppMgr from '@/managers/appmgr';
+import { CommandToXRPMgr } from '@/managers/commandstoxrpmgr';
+import { FolderItem } from '@/utils/types';
+import FolderTree from '../folder-tree';
+import DialogFooter from './dialog-footer';
+import { fireGoogleUserTree, getUsernameFromEmail } from '@/utils/google-utils';
+
+type CopyFileDlgProps = {
+    toggleDialog: () => void;
+};
+
+/**
+ * CopyFileDlg component for displaying copy file progress.
+ * @param toggleDialog Function to toggle the visibility of the dialog
+ * @returns CopyFileDlg component
+ */
+function CopyFileDlg({ toggleDialog }: CopyFileDlgProps) {
+    const { t } = useTranslation();
+    const [xrpRobotFileList, setXrpRobotFileList] = useState<FolderItem[] | null>(null);
+    const [gdriveFileList, setGDriveFileList] = useState<FolderItem[] | null>(null);
+    const [isCopying, setIsCopying] = useState<boolean>(false);
+    const [progress, setProgress] = useState<number>(0);
+    const [progressItem, setProgressItem] = useState<string>('');
+    const [gdriveSelectedFolder, setGDriveFolder] = useState<FolderItem[] | null>(null);
+    const [xrpRobotSelectedFolder, setXrpRobotFolder] = useState<FolderItem[] | null>(null);
+
+    useEffect(() => {
+        // Get the XRP Robot's file list
+        CommandToXRPMgr.getInstance()
+            .getOnBoardFSTree(false)
+            .then((fileList) => {
+                if (fileList) {
+                    const folderTree = JSON.parse(fileList);
+                    setXrpRobotFileList(folderTree);
+                }
+            });
+
+        // Get the google drive's file list
+        setGDriveFileList(AppMgr.getInstance().getFolderList());
+    }, []);
+
+    /*
+     * Begin copy process
+     */
+    const beginCopy = async () => {
+        console.log('beginCopy');
+        setIsCopying(true);
+        // begin the copying process
+        if (xrpRobotSelectedFolder === null || gdriveSelectedFolder === null) {
+            setIsCopying(false);
+            return;
+        }
+        setIsCopying(true);
+        const countItems = (items: FolderItem[]): number => {
+            let count = 0;
+            for (const item of items) {
+                count += 1;
+                if (item.children) {
+                    count += countItems(item.children);
+                }
+            }
+            return count;
+        };
+        const totalItems = countItems(xrpRobotSelectedFolder || []);
+        let completedItems = 0;
+        setProgress(0);
+
+        // create a resursive function to process the folder items
+        const processFolderItems = async (folderItems: FolderItem[], parentFolderId: string) => {
+            for (const folderItem of folderItems) {
+                setProgressItem(folderItem.name);
+
+                if (folderItem.children) {
+                    // create the directory in Google Drive
+                    const folder = await AppMgr.getInstance().driveService.createFolder(
+                        folderItem.name,
+                        parentFolderId,
+                    );
+                    completedItems++;
+                    setProgress(Math.round((completedItems / Math.max(totalItems, 1)) * 100));
+                    await processFolderItems(folderItem.children || [], folder?.id || '');
+                } else {
+                    // for each folder item, we need to read the content from the XRP Robot and save it to Google Drive
+                    const filePath =
+                        folderItem.path === '/'
+                            ? folderItem.path + folderItem.name
+                            : folderItem.path + '/' + folderItem.name;
+                    const content = await CommandToXRPMgr.getInstance().getFileContents(filePath);
+                    const data: string = new TextDecoder().decode(new Uint8Array(content));
+                    const minetype =
+                        folderItem.name.split('.').pop() === 'py' ? 'text/x-python' : 'text/plain';
+                    const blob = new Blob([data], { type: minetype });
+                    await AppMgr.getInstance().driveService.upsertFileToGoogleDrive(
+                        blob,
+                        folderItem.name,
+                        minetype,
+                        undefined,
+                        parentFolderId,
+                    );
+                    completedItems++;
+                    setProgress(Math.round((completedItems / Math.max(totalItems, 1)) * 100));
+                }
+            }
+        };
+
+        await processFolderItems(xrpRobotSelectedFolder, gdriveSelectedFolder[0].id ?? '');
+        setIsCopying(false);
+        // update the Google Drive folder list
+        fireGoogleUserTree(
+            getUsernameFromEmail(AppMgr.getInstance().authService.userProfile.email) ?? '',
+        );
+        setTimeout(() => {
+            toggleDialog();
+        }, 1000);
+    };
+
+    /**
+     * Handle selected folder change
+     */
+    const handleXrpRobotFolderSelect = (selectedItem: FolderItem[]) => {
+        console.log('XRP Robot', selectedItem);
+        setXrpRobotFolder(selectedItem);
+    };
+
+    function handleGDriveFolderSelect(selectedItem: FolderItem[]): void {
+        console.log('Google Drive', selectedItem);
+        setGDriveFolder(selectedItem);
+    }
+
+    return (
+        <div className="flex flex-col items-center gap-4 rounded-md border border-mountain-mist-700 p-8 shadow-md transition-all dark:border-shark-500 dark:bg-shark-950">
+            <div className="flex w-[90%] flex-col items-center">
+                <h1 className="text-lg font-bold text-mountain-mist-700 dark:text-mountain-mist-300">
+                    {t('copyfiles.title')}
+                </h1>
+                <p className="text-sm font-normal text-mountain-mist-700 dark:text-mountain-mist-300">
+                    {t('copyfiles.description')}
+                </p>
+            </div>
+            <hr className="w-full border-mountain-mist-600" />
+            {/* Three-Column Grid Layout */}
+            <div className="grid min-h-0 flex-1 grid-cols-8 gap-4">
+                {/* XRP Robot Files Column */}
+                <div className="col-span-3 w-full flex-col items-center border-2 border-mountain-mist-200 dark:border-shark-500">
+                    <div className="flex items-center justify-center bg-mountain-mist-200 dark:bg-shark-800">
+                        <span className="text-center font-bold text-mountain-mist-700 dark:text-mountain-mist-300">
+                            {t('copyfiles.xrprobot')}
+                        </span>
+                    </div>
+                    <div>
+                        <FolderTree
+                            treeData={JSON.stringify(xrpRobotFileList)}
+                            theme=""
+                            onSelected={handleXrpRobotFolderSelect}
+                        />
+                    </div>
+                </div>
+                {/* Move Icon Column */}
+                <div className="col-span-2 flex flex-col items-center justify-center gap-4">
+                    <div
+                        className={`${isCopying ? 'flex' : 'hidden'} text-sm text-mountain-mist-700 dark:text-mountain-mist-300`}
+                    >
+                        <ProgressBar
+                            radius={100}
+                            progress={progress}
+                            strokeColor="#0a96ed"
+                            strokeLinecap="square"
+                            trackStrokeWidth={18}
+                        />
+                    </div>
+                    <div
+                        className={`${isCopying ? 'flex' : 'hidden'} flex items-center gap-2 text-sm text-mountain-mist-700 dark:text-mountain-mist-300`}
+                    >
+                        <span>Copying:</span>
+                        <span className="text-mountain-mist-700 dark:text-mountain-mist-300">
+                            {progressItem}
+                        </span>
+                    </div>
+                    <Button
+                        disabled={isCopying}
+                        tooltip={t('copyfiles.copyTooltip')}
+                        onClicked={beginCopy}
+                    >
+                        {t('copyfiles.copy')}
+                        <FaArrowRight />
+                    </Button>
+                </div>
+                {/* Google Drive Column */}
+                <div className="col-span-3 w-full border-2 border-mountain-mist-200 dark:border-shark-500">
+                    <div className="flex items-center justify-center bg-mountain-mist-200 dark:bg-shark-800">
+                        <span className="text-center font-bold text-mountain-mist-700 dark:text-mountain-mist-300">
+                            {t('copyfiles.gdrive')}
+                        </span>
+                    </div>
+                    <div>
+                        <FolderTree
+                            treeData={JSON.stringify(gdriveFileList)}
+                            theme=""
+                            onSelected={handleGDriveFolderSelect}
+                        />
+                    </div>
+                </div>
+            </div>
+            {/* Dialog Footer */}
+            <DialogFooter
+                hideCancelBtn={true}
+                disabledAccept={isCopying}
+                btnAcceptLabel={t('copyfiles.close')}
+                btnAcceptCallback={toggleDialog}
+                btnCancelCallback={toggleDialog}
+            />
+        </div>
+    );
+}
+
+export default CopyFileDlg;
diff --git a/src/components/dialogs/filesaveasdlg.tsx b/src/components/dialogs/filesaveasdlg.tsx
index a03c6ad..3372e97 100644
--- a/src/components/dialogs/filesaveasdlg.tsx
+++ b/src/components/dialogs/filesaveasdlg.tsx
@@ -45,19 +45,13 @@ function FileSaveAsDialg(fileSaveAsProps: FileSaveAsProps) {
                 AppMgr.getInstance().authService.userProfile.email,
             );
             if (username) {
-                return folderPath.replace(
-                    `${Constants.GUSERS_FOLDER}${username}/`,
-                    '/XRPCode/',
-                );
+                return folderPath.replace(`${Constants.GUSERS_FOLDER}${username}/`, '/XRPCode/');
             }
         }
         return folderPath;
     };
 
-    const findFolderByPath = (
-        items: FolderItem[],
-        targetPath: string,
-    ): FolderItem | null => {
+    const findFolderByPath = (items: FolderItem[], targetPath: string): FolderItem | null => {
         const normalizedTarget = targetPath.endsWith('/') ? targetPath : `${targetPath}/`;
         for (const item of items) {
             if (item.children === null) {
@@ -115,7 +109,7 @@ function FileSaveAsDialg(fileSaveAsProps: FileSaveAsProps) {
             gparentId: gFolderId,
             parentId: '',
             filetype,
-        }
+        };
         fileSaveAsProps.saveCallback(fileData);
     };
 
@@ -123,16 +117,16 @@ function FileSaveAsDialg(fileSaveAsProps: FileSaveAsProps) {
      * handleFolderSelection - callback function to handle the selected folder
      * @param selectedItem
      */
-    const handleFolderSelection = (selectedItem: FolderItem) => {
-        const path = selectedItem.path === '/' ? `` : selectedItem.path;
+    const handleFolderSelection = (selectedItem: FolderItem[]) => {
+        const path = selectedItem[0].path === '/' ? `` : selectedItem[0].path;
         setSelectedFolder(path);
-        setGFolderId(selectedItem.id);
+        setGFolderId(selectedItem[0].id);
         validateFilename(filename, path);
     };
 
     /**
      * handleFilenameInput
-     * @param e 
+     * @param e
      */
     const handleFilenameInput = (e: React.ChangeEvent<HTMLInputElement>) => {
         const inputName = e.target.value;
@@ -148,14 +142,13 @@ function FileSaveAsDialg(fileSaveAsProps: FileSaveAsProps) {
         const session = EditorMgr.getInstance().getEditorSession(tabId);
         if (session) {
             const parentEnd = session.path.lastIndexOf('/');
-            const parentFolder =
-                parentEnd > 0 ? session.path.substring(0, parentEnd + 1) : '/';
+            const parentFolder = parentEnd > 0 ? session.path.substring(0, parentEnd + 1) : '/';
             const treeFolderPath = toTreeFolderPath(parentFolder);
             const folderItem = findFolderByPath(folderList, treeFolderPath);
             const folderPath =
                 folderItem?.path === '/'
                     ? ''
-                    : folderItem?.path ?? (treeFolderPath === '/' ? '' : treeFolderPath);
+                    : (folderItem?.path ?? (treeFolderPath === '/' ? '' : treeFolderPath));
             setSelectedFolder(folderPath);
             setGFolderId(folderItem?.id ?? '');
             setFilename(session.name);
@@ -169,31 +162,38 @@ function FileSaveAsDialg(fileSaveAsProps: FileSaveAsProps) {
      */
     const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {
         const dotIndex = e.target.value.lastIndexOf('.');
-        const filenameWithoutExtension = dotIndex === -1 ? e.target.value : e.target.value.substring(0, dotIndex);
+        const filenameWithoutExtension =
+            dotIndex === -1 ? e.target.value : e.target.value.substring(0, dotIndex);
         e.target.setSelectionRange(0, filenameWithoutExtension.length);
-    };    
+    };
 
     return (
         <div className="flex h-auto w-96 flex-col gap-2 rounded-md border border-mountain-mist-700 p-8 shadow-md transition-all dark:border-shark-500 dark:bg-shark-950">
             <div className="flex flex-col items-center">
-                <h1 className="text-lg font-bold text-mountain-mist-700 dark:text-mountain-mist-300">{t('saveFileAs')}</h1>
-                <p className="text-sm text-mountain-mist-700 dark:text-mountain-mist-300">{t('choose-dest-file')}</p>
+                <h1 className="text-lg font-bold text-mountain-mist-700 dark:text-mountain-mist-300">
+                    {t('saveFileAs')}
+                </h1>
+                <p className="text-sm text-mountain-mist-700 dark:text-mountain-mist-300">
+                    {t('choose-dest-file')}
+                </p>
             </div>
             <hr className="w-full border-mountain-mist-600 dark:border-mountain-mist-200" />
             <label className="text-mountain-mist-700 dark:text-mountain-mist-300">
                 {t('destFolder')}: {selectedFolder}
             </label>
-            <div className='h-48 w-full overflow-y-auto border border-shark-300 dark:border-shark-600'>
+            <div className="h-48 w-full overflow-y-auto border border-shark-300 dark:border-shark-600">
                 <FolderTree
                     treeData={JSON.stringify(folderList)}
                     theme=""
                     onSelected={handleFolderSelection}
                 />
             </div>
-            <label className="text-sm text-mountain-mist-700 dark:text-mountain-mist-300">{t('filename')}</label>
+            <label className="text-sm text-mountain-mist-700 dark:text-mountain-mist-300">
+                {t('filename')}
+            </label>
             <div>
                 <input
-                    className={`w-full border p-2 rounded text-md text-mountain-mist-700 dark:bg-shark-500 dark:text-mountain-mist-200 dark:placeholder-mountain-mist-200 ${isFileExists ? 'border-cinnabar-800' : 'border-shark-300 dark:border-shark-600'}`}
+                    className={`text-md w-full rounded border p-2 text-mountain-mist-700 dark:bg-shark-500 dark:text-mountain-mist-200 dark:placeholder-mountain-mist-200 ${isFileExists ? 'border-cinnabar-800' : 'border-shark-300 dark:border-shark-600'}`}
                     id="filenameId"
                     type="text"
                     placeholder={t('enterFilename')}
@@ -204,12 +204,15 @@ function FileSaveAsDialg(fileSaveAsProps: FileSaveAsProps) {
                     minLength={2}
                 />
                 {isFileExists && (
-                    <span className="text-sm text-cinnabar-800 dark:text-cinnabar-400">{t('fileExists')}</span>
+                    <span className="text-sm text-cinnabar-800 dark:text-cinnabar-400">
+                        {t('fileExists')}
+                    </span>
                 )}
             </div>
             <label className="text-mountain-mist-700 dark:text-mountain-mist-300">
                 {t('final-path')}
-                {selectedFolder}{filename}
+                {selectedFolder}
+                {filename}
             </label>
             <hr className="w-full border-mountain-mist-600 dark:border-mountain-mist-200" />
             <DialogFooter
diff --git a/src/components/dialogs/newfiledlg.tsx b/src/components/dialogs/newfiledlg.tsx
index 1f6bc03..ae24845 100644
--- a/src/components/dialogs/newfiledlg.tsx
+++ b/src/components/dialogs/newfiledlg.tsx
@@ -10,7 +10,7 @@ import { TiArrowSortedDown } from 'react-icons/ti';
 import pythonicon from '@assets/images/python-svgrepo-com.svg';
 import blockIcon from '@assets/images/blockly.svg';
 import fileIcon from '@assets/images/file.svg';
-import { FiCheckSquare } from "react-icons/fi";
+import { FiCheckSquare } from 'react-icons/fi';
 
 type NewFileProps = {
     submitCallback: (formData: NewFileData) => void;
@@ -32,15 +32,15 @@ function NewFileDlg(newFileProps: NewFileProps) {
     const fileOptions: ListItem[] = [
         {
             label: t('blocklyfile'),
-            image: blockIcon
+            image: blockIcon,
         },
         {
             label: t('pythonfile'),
-            image: pythonicon
+            image: pythonicon,
         },
         {
             label: t('other'),
-            image: fileIcon
+            image: fileIcon,
         },
     ];
 
@@ -107,8 +107,8 @@ function NewFileDlg(newFileProps: NewFileProps) {
 
     /**
      * handleFilenameInput - handles the filename input from user
-     * @param e 
-     * @returns 
+     * @param e
+     * @returns
      */
     const handleFilenameInput = (e: React.ChangeEvent<HTMLInputElement>) => {
         setFilename(e.target.value);
@@ -116,7 +116,7 @@ function NewFileDlg(newFileProps: NewFileProps) {
         const isValid = Constants.REGEX_FILENAME.test(filename);
         const parts = selectedFolder.split('/').filter((part) => part !== '');
         const foldername = parts.length > 0 ? parts[parts.length - 1] : selectedFolder;
-        if (!isValid || AppMgr.getInstance().IsFileExists(foldername,filename)) {
+        if (!isValid || AppMgr.getInstance().IsFileExists(foldername, filename)) {
             setIsFileExists(true);
             setIsOkayToSubmit(false);
             return;
@@ -128,8 +128,8 @@ function NewFileDlg(newFileProps: NewFileProps) {
 
     /**
      * findItemInFolderList - recursive function to find the folder item in the folder list
-     * @param folderList 
-     * @param folder 
+     * @param folderList
+     * @param folder
      * @returns folder item or null
      */
     const findItemInFolderList = (folderList: FolderItem[], folder: string): FolderItem | null => {
@@ -145,7 +145,7 @@ function NewFileDlg(newFileProps: NewFileProps) {
             }
         }
         return null;
-    }
+    };
     /**
      * handleSubmit handler. Gather all data from the form and send back to parent component
      */
@@ -173,8 +173,8 @@ function NewFileDlg(newFileProps: NewFileProps) {
      * handleFolderSelection - callback function to handle the selected folder
      * @param selectedItem
      */
-    const handleFolderSelection = (selectedItem: FolderItem) => {
-        setSelectedFolder(selectedItem.path);
+    const handleFolderSelection = (selectedItem: FolderItem[]) => {
+        setSelectedFolder(selectedItem[0].path);
     };
 
     /**
@@ -212,67 +212,92 @@ function NewFileDlg(newFileProps: NewFileProps) {
     };
 
     return (
-        <div className="flex flex-col items-center gap-4 rounded-md border border-mountain-mist-700 p-8 shadow-md transition-all dark:border-shark-500 dark:bg-shark-950 w-96 max-h-[90vh] overflow-y-auto">
+        <div className="flex max-h-[90vh] w-96 flex-col items-center gap-4 overflow-y-auto rounded-md border border-mountain-mist-700 p-8 shadow-md transition-all dark:border-shark-500 dark:bg-shark-950">
             <div className="flex w-[90%] flex-col items-center">
-                <h1 className="text-lg font-bold text-mountain-mist-700 dark:text-mountain-mist-300">{t('newFile')}</h1>
-                <p className="text-sm text-mountain-mist-700 dark:text-mountain-mist-300">{t('chooseNewFile')}</p>
+                <h1 className="text-lg font-bold text-mountain-mist-700 dark:text-mountain-mist-300">
+                    {t('newFile')}
+                </h1>
+                <p className="text-sm text-mountain-mist-700 dark:text-mountain-mist-300">
+                    {t('chooseNewFile')}
+                </p>
             </div>
             <hr className="w-full border-mountain-mist-600" />
-            <form id="fileOptionId" className="flex w-full flex-col gap-2" onSubmit={(e) => e.preventDefault()}>
-                <span className="text-sm text-mountain-mist-700 dark:text-mountain-mist-300">{t('destFolder')}</span>
-                <div className='h-48 w-full overflow-y-auto border border-shark-300 dark:border-shark-600'>
+            <form
+                id="fileOptionId"
+                className="flex w-full flex-col gap-2"
+                onSubmit={(e) => e.preventDefault()}
+            >
+                <span className="text-sm text-mountain-mist-700 dark:text-mountain-mist-300">
+                    {t('destFolder')}
+                </span>
+                <div className="h-48 w-full overflow-y-auto border border-shark-300 dark:border-shark-600">
                     <FolderTree
                         treeData={JSON.stringify(folderList)}
                         theme=""
                         onSelected={handleFolderSelection}
                     />
                 </div>
-                <label className="text-sm text-mountain-mist-700 dark:text-mountain-mist-300" htmlFor="filesId">
+                <label
+                    className="text-sm text-mountain-mist-700 dark:text-mountain-mist-300"
+                    htmlFor="filesId"
+                >
                     {t('fileType')}
                 </label>
-                <div className='relative w-full' ref={popoverRef}>
-                    <button 
-                        type='button' 
-                        name='filetypeSelecion' 
+                <div className="relative w-full" ref={popoverRef}>
+                    <button
+                        type="button"
+                        name="filetypeSelecion"
                         onClick={togglePopover}
                         disabled={selectedFolder === ''}
-                        className={`relative h-10 w-full p-2 text-left border rounded-md shadow-md cursor-default focus:outline-none focus:ring-2 focus:ring-curious-blue-400 dark:border-shark-600 dark:bg-shark-500 ${
-                            selectedFolder === '' 
-                                ? 'border-shark-300 bg-shark-100 opacity-50 cursor-not-allowed' 
-                                : 'border-shark-300 dark:border-shark-600 bg-white dark:bg-shark-500'
+                        className={`relative h-10 w-full cursor-default rounded-md border p-2 text-left shadow-md focus:outline-none focus:ring-2 focus:ring-curious-blue-400 dark:border-shark-600 dark:bg-shark-500 ${
+                            selectedFolder === ''
+                                ? 'cursor-not-allowed border-shark-300 bg-shark-100 opacity-50'
+                                : 'bg-white border-shark-300 dark:border-shark-600 dark:bg-shark-500'
                         }`}
-                        aria-haspopup="listbox" 
-                        aria-expanded={isPopoverOpen} 
-                        aria-labelledby='listbox-label'
+                        aria-haspopup="listbox"
+                        aria-expanded={isPopoverOpen}
+                        aria-labelledby="listbox-label"
                     >
-                        <span className='flex items-center'>
+                        <span className="flex items-center">
                             {selectedOption ? (
-                                <span className='flex items-center gap-2'>
-                                    <img className='h-5 w-5' src={selectedOption.image} alt={selectedOption.label} />
-                                    <span className='text-sm text-mountain-mist-700 dark:text-mountain-mist-200'>{selectedOption.label}</span>
+                                <span className="flex items-center gap-2">
+                                    <img
+                                        className="h-5 w-5"
+                                        src={selectedOption.image}
+                                        alt={selectedOption.label}
+                                    />
+                                    <span className="text-sm text-mountain-mist-700 dark:text-mountain-mist-200">
+                                        {selectedOption.label}
+                                    </span>
                                 </span>
                             ) : (
-                                <span className='text-sm text-mountain-mist-700 dark:text-mountain-mist-300'>{t('files')}</span>
+                                <span className="text-sm text-mountain-mist-700 dark:text-mountain-mist-300">
+                                    {t('files')}
+                                </span>
                             )}
                         </span>
-                        <span className='absolute inset-y-0 right-0 flex pr-3 items-center pointer-events-none'>
-                            <TiArrowSortedDown className={`transition-transform ${isPopoverOpen ? 'rotate-180' : ''} text-mountain-mist-700 dark:text-mountain-mist-300`} />
+                        <span className="pointer-events-none absolute inset-y-0 right-0 flex items-center pr-3">
+                            <TiArrowSortedDown
+                                className={`transition-transform ${isPopoverOpen ? 'rotate-180' : ''} text-mountain-mist-700 dark:text-mountain-mist-300`}
+                            />
                         </span>
                     </button>
                     {isPopoverOpen && (
-                        <ul 
-                            className='absolute z-[200] bg-mountain-mist-50 dark:bg-shark-700 w-full mt-1 py-1 overflow-auto text-base border border-gray-300 dark:border-shark-600 rounded-md shadow-xl max-h-56 ring-1 ring-black ring-opacity-5 focus:outline-none sm:text-sm'
-                            role='listbox'
-                            aria-labelledby='listbox-label'
+                        <ul
+                            className="ring-black absolute z-[200] mt-1 max-h-56 w-full overflow-auto rounded-md border border-gray-300 bg-mountain-mist-50 py-1 text-base shadow-xl ring-1 ring-opacity-5 focus:outline-none dark:border-shark-600 dark:bg-shark-700 sm:text-sm"
+                            role="listbox"
+                            aria-labelledby="listbox-label"
                         >
                             {fileOptions.map((option, index) => (
-                                <li 
-                                    key={option.label} 
-                                    className={`flex flex-row items-center gap-2 px-3 py-2 cursor-pointer hover:bg-curious-blue-100 dark:hover:bg-shark-600 ${
-                                        selectedOption?.label === option.label ? 'bg-curious-blue-50 dark:bg-shark-700' : ''
+                                <li
+                                    key={option.label}
+                                    className={`flex cursor-pointer flex-row items-center gap-2 px-3 py-2 hover:bg-curious-blue-100 dark:hover:bg-shark-600 ${
+                                        selectedOption?.label === option.label
+                                            ? 'bg-curious-blue-50 dark:bg-shark-700'
+                                            : ''
                                     }`}
                                     tabIndex={0}
-                                    role='option'
+                                    role="option"
                                     aria-selected={selectedOption?.label === option.label}
                                     onClick={() => handleOptionSelect(option, index)}
                                     onKeyDown={(e) => {
@@ -282,8 +307,14 @@ function NewFileDlg(newFileProps: NewFileProps) {
                                         }
                                     }}
                                 >
-                                    <img className='h-5 w-5' src={option.image} alt={option.label} />
-                                    <span className='text-sm text-mountain-mist-700 dark:text-mountain-mist-200 flex-1'>{option.label}</span>
+                                    <img
+                                        className="h-5 w-5"
+                                        src={option.image}
+                                        alt={option.label}
+                                    />
+                                    <span className="flex-1 text-sm text-mountain-mist-700 dark:text-mountain-mist-200">
+                                        {option.label}
+                                    </span>
                                     {selectedOption?.label === option.label && (
                                         <span className="flex items-center pr-2 text-curious-blue-600 dark:text-curious-blue-400">
                                             <FiCheckSquare />
@@ -294,11 +325,13 @@ function NewFileDlg(newFileProps: NewFileProps) {
                         </ul>
                     )}
                 </div>
-                <span className="text-sm text-mountain-mist-700 dark:text-mountain-mist-300">{t('filename')}</span>
+                <span className="text-sm text-mountain-mist-700 dark:text-mountain-mist-300">
+                    {t('filename')}
+                </span>
                 <div className="flex flex-col items-center gap-1">
                     <input
                         ref={filenameInputRef}
-                        className={`w-full rounded border ${isFileExists ? 'border-cinnabar-800' : 'border-shark-300 dark:border-shark-600'} p-2 text-md text-mountain-mist-700 dark:bg-shark-500 dark:text-mountain-mist-200 dark:placeholder-mountain-mist-200`}
+                        className={`w-full rounded border ${isFileExists ? 'border-cinnabar-800' : 'border-shark-300 dark:border-shark-600'} text-md p-2 text-mountain-mist-700 dark:bg-shark-500 dark:text-mountain-mist-200 dark:placeholder-mountain-mist-200`}
                         id="filenameId"
                         type="text"
                         placeholder={t('enterFilename')}
@@ -313,9 +346,11 @@ function NewFileDlg(newFileProps: NewFileProps) {
                         <span className="text-sm text-cinnabar-800">{t('fileExists')}</span>
                     )}
                 </div>
-                <span className="text-mountain-mist-700 text-sm dark:text-mountain-mist-300">
+                <span className="text-sm text-mountain-mist-700 dark:text-mountain-mist-300">
                     {t('final-path')}
-                    {selectedFolder}{filename}{filetype === 1 ? '.blocks' : '.py'} 
+                    {selectedFolder}
+                    {filename}
+                    {filetype === 1 ? '.blocks' : '.py'}
                 </span>
             </form>
             <hr className="w-full border-mountain-mist-600" />
diff --git a/src/components/dialogs/uploadfiledlg.tsx b/src/components/dialogs/uploadfiledlg.tsx
index 1ccd0f1..1fed032 100644
--- a/src/components/dialogs/uploadfiledlg.tsx
+++ b/src/components/dialogs/uploadfiledlg.tsx
@@ -16,7 +16,7 @@ type UploadFileDlgProps = {
 function UploadFileDlg({ files, toggleDialog }: UploadFileDlgProps) {
     const { t } = useTranslation();
     const [folderItem, setFolderItem] = useState<FolderItem[] | null>(null);
-    const [fileList, setFileList] = useState<FileData[] | null >(null);
+    const [fileList, setFileList] = useState<FileData[] | null>(null);
     const [selectedFolder, setSelectedFolder] = useState<string>('');
     const [gFolderId, setGFolderId] = useState<string>('');
 
@@ -66,13 +66,13 @@ function UploadFileDlg({ files, toggleDialog }: UploadFileDlgProps) {
 
     /**
      * handleFolderSelection - callback function to handle the selected folder
-     * @param selectedItem 
+     * @param selectedItem
      */
-    const handleFolderSelection = (selectedItem: FolderItem) => {
-        const path = selectedItem.path === '/' ? `` : selectedItem.path;
+    const handleFolderSelection = (selectedItem: FolderItem[]) => {
+        const path = selectedItem[0].path === '/' ? `` : selectedItem[0].path;
         setSelectedFolder(path);
-        setGFolderId(selectedItem.id);
-    }
+        setGFolderId(selectedItem[0].id);
+    };
 
     useEffect(() => {
         setFileList(files);
@@ -80,27 +80,44 @@ function UploadFileDlg({ files, toggleDialog }: UploadFileDlgProps) {
     }, [files]);
 
     return (
-        <div className="border rounded-md border-mountain-mist-700 dark:border-shark-500 dark:bg-shark-950 flex h-auto w-96 flex-col gap-2 p-8 shadow-md transition-all">
-            <div className='flex flex-col items-center'>
-                <h1 className="text-lg font-bold text-mountain-mist-700 dark:text-mountain-mist-300">{t('uploadFiles')}</h1>
+        <div className="flex h-auto w-96 flex-col gap-2 rounded-md border border-mountain-mist-700 p-8 shadow-md transition-all dark:border-shark-500 dark:bg-shark-950">
+            <div className="flex flex-col items-center">
+                <h1 className="text-lg font-bold text-mountain-mist-700 dark:text-mountain-mist-300">
+                    {t('uploadFiles')}
+                </h1>
             </div>
             <hr className="w-full border-mountain-mist-600 dark:border-mountain-mist-200" />
-            <div className='h-48 w-full overflow-y-auto border border-shark-300 dark:border-shark-600'>
-                <FolderTree treeData={JSON.stringify(folderItem)} theme="" onSelected={handleFolderSelection} />
+            <div className="h-48 w-full overflow-y-auto border border-shark-300 dark:border-shark-600">
+                <FolderTree
+                    treeData={JSON.stringify(folderItem)}
+                    theme=""
+                    onSelected={handleFolderSelection}
+                />
             </div>
-            <label className="text-mountain-mist-700 dark:text-mountain-mist-300">{t('destFolder')}: {selectedFolder}</label>
-            <label className="text-mountain-mist-700 dark:text-mountain-mist-300">{t('filesToUpload')}: {fileList?.length}</label>
-            <ul className='flex flex-col gap-2'>
+            <label className="text-mountain-mist-700 dark:text-mountain-mist-300">
+                {t('destFolder')}: {selectedFolder}
+            </label>
+            <label className="text-mountain-mist-700 dark:text-mountain-mist-300">
+                {t('filesToUpload')}: {fileList?.length}
+            </label>
+            <ul className="flex flex-col gap-2">
                 {fileList?.map((file) => (
-                    <li key={file.name} className="text-mountain-mist-700 dark:text-mountain-mist-300 hover:text-neutral-100">
+                    <li
+                        key={file.name}
+                        className="hover:text-neutral-100 text-mountain-mist-700 dark:text-mountain-mist-300"
+                    >
                         <span>{file.name}</span>
                     </li>
                 ))}
             </ul>
             <hr className="w-full border-mountain-mist-600 dark:border-mountain-mist-200" />
-            <DialogFooter btnCancelCallback={toggleDialog} btnAcceptLabel={t('upload')} btnAcceptCallback={handleFileUpload}/>
-        </div>    
-    )
+            <DialogFooter
+                btnCancelCallback={toggleDialog}
+                btnAcceptLabel={t('upload')}
+                btnAcceptCallback={handleFileUpload}
+            />
+        </div>
+    );
 }
 
 export default UploadFileDlg;
diff --git a/src/components/folder-tree.tsx b/src/components/folder-tree.tsx
index 5b4e3c8..d2ec031 100644
--- a/src/components/folder-tree.tsx
+++ b/src/components/folder-tree.tsx
@@ -29,7 +29,7 @@ import { StorageKeys } from '@/utils/localstorage';
 
 type TreeProps = {
     treeData: string | null;
-    onSelected?: (selectedItem: FolderItem) => void;
+    onSelected?: (selectedItem: FolderItem[]) => void;
     theme: string;
     isHeader?: boolean;
 };
@@ -64,7 +64,6 @@ function FolderTree(treeProps: TreeProps) {
     }, [treeProps.treeData]);
 
     useEffect(() => {
-
         if (!hasSubscribed) {
             appMgrRef.current = AppMgr.getInstance();
 
@@ -85,15 +84,25 @@ function FolderTree(treeProps: TreeProps) {
                     setIsRunning(false);
                 }
             });
-            
+
             appMgrRef.current.on(EventType.EVENT_FILESYS, (filesysJson: string) => {
                 try {
                     const filesysData = JSON.parse(filesysJson);
-                    if (Object.keys(filesysData).length === 0 && AppMgr.getInstance().authService.isLogin === true) {       
-                        fireGoogleUserTree(getUsernameFromEmail(AppMgr.getInstance().authService.userProfile.email) ?? '');
+                    if (
+                        Object.keys(filesysData).length === 0 &&
+                        AppMgr.getInstance().authService.isLogin === true
+                    ) {
+                        fireGoogleUserTree(
+                            getUsernameFromEmail(
+                                AppMgr.getInstance().authService.userProfile.email,
+                            ) ?? '',
+                        );
                     } else if (Object.keys(filesysData).length == 0) {
                         setTreeData(undefined);
-                    } else if (AppMgr.getInstance().authService.isLogin && filesysData[0].id === 'root') {
+                    } else if (
+                        AppMgr.getInstance().authService.isLogin &&
+                        filesysData[0].id === 'root'
+                    ) {
                         return;
                     } else {
                         setTreeData(filesysData);
@@ -101,7 +110,9 @@ function FolderTree(treeProps: TreeProps) {
                     }
                 } catch (err) {
                     if (err instanceof Error) {
-                        folderLogger.error(`Failed to parse filesys data:  ${err.stack ?? err.message}`);
+                        folderLogger.error(
+                            `Failed to parse filesys data:  ${err.stack ?? err.message}`,
+                        );
                     }
                     setTreeData(undefined);
                 }
@@ -137,8 +148,7 @@ function FolderTree(treeProps: TreeProps) {
         }
         if (dialogRef.current.hasAttribute('open')) {
             dialogRef.current.close();
-        }
-        else dialogRef.current.showModal();
+        } else dialogRef.current.showModal();
     };
 
     /**
@@ -188,14 +198,14 @@ function FolderTree(treeProps: TreeProps) {
         const username = getUsernameFromEmail(AppMgr.getInstance().authService.userProfile.email);
         const path = node.path.includes('/XRPCode/')
             ? node.path.replace('/XRPCode/', Constants.GUSERS_FOLDER + `${username}/`)
-            : node.path === '/' ?  node.path : node.path + '/';
-        const filePath = path === '/'
-            ? path + node.name
-            : path + node.name;
+            : node.path === '/'
+              ? node.path
+              : node.path + '/';
+        const filePath = path === '/' ? path + node.name : path + node.name;
         return filePath;
-    }    
+    }
 
-    /**     
+    /**
      * Node component for rendering each tree node
      * @param param0
      * @returns
@@ -216,7 +226,7 @@ function FolderTree(treeProps: TreeProps) {
             <div
                 ref={dragHandle}
                 style={style}
-                className={`group flex flex-row items-center justify-between hover:bg-matisse-400 dark:hover:bg-shark-500 ${node.isSelected ? 'bg-curious-blue-300 dark:bg-shark-400' : ''} ${isRunning ? 'opacity-50 pointer-events-none' : 'opacity-100 pointer-events-auto'}}`}
+                className={`group flex flex-row items-center justify-between hover:bg-matisse-400 dark:hover:bg-shark-500 ${node.isSelected ? 'bg-curious-blue-300 dark:bg-shark-400' : ''} ${isRunning ? 'pointer-events-none opacity-50' : 'pointer-events-auto opacity-100'}}`}
                 onClick={(e) => {
                     if (node.isInternal) node.toggle();
                     if (!(e.detail % 2) && !isRunning) {
@@ -225,9 +235,12 @@ function FolderTree(treeProps: TreeProps) {
                             const filePathData = {
                                 xrpPath: filePath,
                                 gPath: node.data.fileId,
-                                gparentId: node.data.gparentId
+                                gparentId: node.data.gparentId,
                             };
-                            AppMgr.getInstance().emit(EventType.EVENT_OPEN_FILE, JSON.stringify(filePathData));
+                            AppMgr.getInstance().emit(
+                                EventType.EVENT_OPEN_FILE,
+                                JSON.stringify(filePathData),
+                            );
                         }
                     } else {
                         if (node.children === null) {
@@ -235,7 +248,7 @@ function FolderTree(treeProps: TreeProps) {
                             const seachParams: EdSearchParams = {
                                 name: node.data.name,
                                 path: filePath,
-                            }
+                            };
                             EditorMgr.getInstance().SelectEditorTabByName(seachParams);
                         }
                     }
@@ -253,10 +266,15 @@ function FolderTree(treeProps: TreeProps) {
                 </div>
                 {!treeProps.onSelected && (
                     <div className="invisible flex flex-row items-center gap-1 px-2 group-hover:visible">
-                        <button className={`${isRunning ? 'opacity-50 pointer-events-none' : 'opacity-100 pointer-events-auto'}`} onClick={() => node.edit()} title={t('rename')}>
+                        <button
+                            className={`${isRunning ? 'pointer-events-none opacity-50' : 'pointer-events-auto opacity-100'}`}
+                            onClick={() => node.edit()}
+                            title={t('rename')}
+                        >
                             <MdEdit size={'1.5em'} />
                         </button>
-                        <button className={`${isRunning ? 'opacity-50 pointer-events-none' : 'opacity-100 pointer-events-auto'}`}
+                        <button
+                            className={`${isRunning ? 'pointer-events-none opacity-50' : 'pointer-events-auto opacity-100'}`}
                             onClick={() => {
                                 tree.delete(node.id);
                             }}
@@ -283,7 +301,7 @@ function FolderTree(treeProps: TreeProps) {
 
     const findParent = (nodes: FolderItem[], id: string): FolderItem | null => {
         for (const node of nodes) {
-            if (node.children?.some(child => child.id === id)) {
+            if (node.children?.some((child) => child.id === id)) {
                 return node;
             }
             if (node.children) {
@@ -315,7 +333,9 @@ function FolderTree(treeProps: TreeProps) {
                     // delete the actual file in Google Drive
                     if (found.fileId) {
                         await AppMgr.getInstance().driveService?.DeleteFile(found.fileId);
-                        const username = getUsernameFromEmail(AppMgr.getInstance().authService.userProfile.email);
+                        const username = getUsernameFromEmail(
+                            AppMgr.getInstance().authService.userProfile.email,
+                        );
                         if (username) {
                             // refresh the Google Drive tree
                             fireGoogleUserTree(username);
@@ -328,10 +348,10 @@ function FolderTree(treeProps: TreeProps) {
 
                 // remove the node from the tab and editor manager
                 const editorMgr = EditorMgr.getInstance();
-                const searchParams : EdSearchParams = {
+                const searchParams: EdSearchParams = {
                     name: found.name,
                     path: getFilePath(found),
-                }
+                };
                 const editorSession = editorMgr.getEditorSessionByName(searchParams);
                 if (editorSession) {
                     editorMgr.RemoveEditorTabByName(searchParams);
@@ -341,7 +361,13 @@ function FolderTree(treeProps: TreeProps) {
         };
 
         if (found) {
-            setDialogContent(<ConfirmationDlg acceptCallback={handleOnDeleteConfirmation} toggleDialog={toggleDialog} confirmationMessage={t('confirmDeleteFileOrFolder', { name: found.name })} />);
+            setDialogContent(
+                <ConfirmationDlg
+                    acceptCallback={handleOnDeleteConfirmation}
+                    toggleDialog={toggleDialog}
+                    confirmationMessage={t('confirmDeleteFileOrFolder', { name: found.name })}
+                />,
+            );
             toggleDialog();
         }
     };
@@ -368,7 +394,9 @@ function FolderTree(treeProps: TreeProps) {
         if (found) {
             // Preserve file extension if user omits it
             const originalName = found.name;
-            const originalExtension = originalName.includes('.') ? originalName.substring(originalName.lastIndexOf('.')) : '';
+            const originalExtension = originalName.includes('.')
+                ? originalName.substring(originalName.lastIndexOf('.'))
+                : '';
 
             if (originalExtension && !name.endsWith(originalExtension) && !name.includes('.')) {
                 name += originalExtension;
@@ -377,20 +405,25 @@ function FolderTree(treeProps: TreeProps) {
             if (isLogin) {
                 // rename the actual file in Google Drive
                 await AppMgr.getInstance().driveService?.renameFile(found.fileId ?? '', name);
-                const username = getUsernameFromEmail(AppMgr.getInstance().authService.userProfile.email);
+                const username = getUsernameFromEmail(
+                    AppMgr.getInstance().authService.userProfile.email,
+                );
                 if (username) {
                     // refresh the Google Drive tree
                     fireGoogleUserTree(username);
                 }
             } else if (isConnected) {
                 // rename the actual file in XRP
-                await CommandToXRPMgr.getInstance().renameFile(getFilePath(found), found.path + '/' + name);
+                await CommandToXRPMgr.getInstance().renameFile(
+                    getFilePath(found),
+                    found.path + '/' + name,
+                );
             }
 
-            const searchParams : EdSearchParams = {
+            const searchParams: EdSearchParams = {
                 name: found.name,
                 path: getFilePath(node.data),
-            }
+            };
             EditorMgr.getInstance().RenameEditorTab(searchParams, name);
 
             // update the name field
@@ -400,8 +433,8 @@ function FolderTree(treeProps: TreeProps) {
 
     /**
      * onCreate - create a new tree item callback
-     * @param param0 
-     * @returns 
+     * @param param0
+     * @returns
      */
     const onCreate = async ({
         parentId,
@@ -418,14 +451,19 @@ function FolderTree(treeProps: TreeProps) {
 
         if (parentId === null && parentNode === null) {
             folderLogger.error('Cannot create node: parentId and parentNode are both null');
-            setDialogContent(<AlertDialog toggleDialog={toggleDialog} alertMessage={t('select-parent-node')} />);
+            setDialogContent(
+                <AlertDialog toggleDialog={toggleDialog} alertMessage={t('select-parent-node')} />,
+            );
             toggleDialog();
             return null;
         }
 
-        const parentPath = (parentNode?.data.name === '/' || parentNode?.data.name === Constants.XRPCODE)
-            ? parentNode.data.path : (isLogin) ? `${parentNode?.data.path}${parentNode?.data.name}/` :
-            `${parentNode?.data.path}/${parentNode?.data.name}/`;
+        const parentPath =
+            parentNode?.data.name === '/' || parentNode?.data.name === Constants.XRPCODE
+                ? parentNode.data.path
+                : isLogin
+                  ? `${parentNode?.data.path}${parentNode?.data.name}/`
+                  : `${parentNode?.data.path}/${parentNode?.data.name}/`;
 
         // Ask for filename using a promise-based modal
         const name = await new Promise<string | null>((resolve) => {
@@ -441,7 +479,7 @@ function FolderTree(treeProps: TreeProps) {
                         toggleDialog();
                         resolve(null);
                     }}
-                />
+                />,
             );
             toggleDialog();
         });
@@ -470,34 +508,46 @@ function FolderTree(treeProps: TreeProps) {
             }
             if (type === 'internal') {
                 if (isLogin) {
-                    await AppMgr.getInstance().driveService?.createFolder(newNode.name,  parentFileId ?? undefined).then((data) => {
-                        newNode.fileId = data?.id;
-                    });
+                    await AppMgr.getInstance()
+                        .driveService?.createFolder(newNode.name, parentFileId ?? undefined)
+                        .then((data) => {
+                            newNode.fileId = data?.id;
+                        });
                 } else if (isConnected) {
                     // create the actual file in XRP
                     await CommandToXRPMgr.getInstance().buildPath(
                         newNode.path + '/' + newNode.name,
                     );
-                } 
+                }
             } else if (type === 'leaf') {
                 if (isLogin) {
                     const mintetype = newNode.name.includes('.py')
-                        ? 'text/x-python' : newNode.name.includes('.blocks')
-                        ? 'application/json' : 'text/plain';
+                        ? 'text/x-python'
+                        : newNode.name.includes('.blocks')
+                          ? 'application/json'
+                          : 'text/plain';
                     const blob = new Blob([''], { type: mintetype });
-                    await AppMgr.getInstance().driveService?.uploadFile(blob, newNode.name, mintetype, parentFileId ?? undefined).then((file) => {
-                        if (file) {
-                            newNode.fileId = file.id;
-                        }
-                    });
-                } if (isConnected) {
+                    await AppMgr.getInstance()
+                        .driveService?.uploadFile(
+                            blob,
+                            newNode.name,
+                            mintetype,
+                            parentFileId ?? undefined,
+                        )
+                        .then((file) => {
+                            if (file) {
+                                newNode.fileId = file.id;
+                            }
+                        });
+                }
+                if (isConnected) {
                     // create the actual file in XRP
                     await CommandToXRPMgr.getInstance().uploadFile(
                         newNode.path + '/' + newNode.name,
                         '',
                         true,
                     );
-                } 
+                }
             }
         }
 
@@ -523,7 +573,9 @@ function FolderTree(treeProps: TreeProps) {
         });
 
         if (isLogin) {
-            const username = getUsernameFromEmail(AppMgr.getInstance().authService.userProfile.email);
+            const username = getUsernameFromEmail(
+                AppMgr.getInstance().authService.userProfile.email,
+            );
             if (username) {
                 // refresh the Google Drive tree
                 fireGoogleUserTree(username);
@@ -540,7 +592,7 @@ function FolderTree(treeProps: TreeProps) {
         const selectedItems: FolderItem[] = [];
         nodes.map((node) => selectedItems.push(node.data));
         if (treeProps.onSelected && selectedItems.length > 0) {
-            treeProps.onSelected(selectedItems[0]);
+            treeProps.onSelected(selectedItems);
         }
         setSelectedItems(selectedItems);
     };
@@ -578,41 +630,51 @@ function FolderTree(treeProps: TreeProps) {
 
         fireGoogleUserTree(username ?? '');
 
-        const firstTimeLogin = localStorage.getItem(StorageKeys.GOOGLE_FIRST_TIME_LOGIN) === null || localStorage.getItem(StorageKeys.GOOGLE_FIRST_TIME_LOGIN) === 'true';
+        const firstTimeLogin =
+            localStorage.getItem(StorageKeys.GOOGLE_FIRST_TIME_LOGIN) === null ||
+            localStorage.getItem(StorageKeys.GOOGLE_FIRST_TIME_LOGIN) === 'true';
         if (firstTimeLogin) {
             localStorage.setItem(StorageKeys.GOOGLE_FIRST_TIME_LOGIN, 'false');
             // put up a dialog to inform user that the Google Drive notification about owner created folder and files
-            setDialogContent(<AlertDialog toggleDialog={toggleDialog} alertMessage={t('googleDriveNotification')} />);
+            setDialogContent(
+                <AlertDialog
+                    toggleDialog={toggleDialog}
+                    alertMessage={t('googleDriveNotification')}
+                />,
+            );
             toggleDialog();
         }
-    }
+    };
 
     /**
      * onGoogleLogout - callback from Google Login component to handle the logout logic
      */
     const onGoogleLogout = async () => {
         setIsLogin(false);
-        AppMgr.getInstance().authService.logOut().then(() => {
-            AppMgr.getInstance().emit(EventType.EVENT_LOGIN_STATUS, LoginStatus.LOGGED_OUT);
-        });
+        AppMgr.getInstance()
+            .authService.logOut()
+            .then(() => {
+                AppMgr.getInstance().emit(EventType.EVENT_LOGIN_STATUS, LoginStatus.LOGGED_OUT);
+            });
 
         if (!isConnected) {
             AppMgr.getInstance().emit(EventType.EVENT_FILESYS, '{}');
-        } {
-            await CommandToXRPMgr.getInstance().getOnBoardFSTree()
         }
-    }
+        {
+            await CommandToXRPMgr.getInstance().getOnBoardFSTree();
+        }
+    };
 
     /**
      * Cursor component for rendering the cursor position
-     * @param param0 
-     * @returns 
+     * @param param0
+     * @returns
      */
     function Cursor({ top, left }: { top: number; left: number }) {
         return (
             <div
-                className="absolute w-full h-0 border-dashed border-t-2 bg-mountain-mist-500 dark:bg-mountain-mist-300"
-                style={{top, left,}}
+                className="absolute h-0 w-full border-t-2 border-dashed bg-mountain-mist-500 dark:bg-mountain-mist-300"
+                style={{ top, left }}
             />
         );
     }
@@ -660,7 +722,10 @@ function FolderTree(treeProps: TreeProps) {
 
             // Check for name collision, but only if it's not a reorder in the same folder
             const isReorder = dragNode.parent?.id === parentNode.id;
-            if (!isReorder && parentNode.data.children?.some(child => child.name === dragNode.data.name)) {
+            if (
+                !isReorder &&
+                parentNode.data.children?.some((child) => child.name === dragNode.data.name)
+            ) {
                 collisionErrors.push(dragNode.data.name);
                 continue; // This node will cause a collision, skip it
             }
@@ -689,7 +754,11 @@ function FolderTree(treeProps: TreeProps) {
                 const newParentId = parentNode?.data.fileId;
 
                 if (fileId && newParentId && oldParentId) {
-                    await AppMgr.getInstance().driveService?.moveFile(fileId, oldParentId, newParentId);
+                    await AppMgr.getInstance().driveService?.moveFile(
+                        fileId,
+                        oldParentId,
+                        newParentId,
+                    );
                 }
             } else if (isConnected) {
                 const oldPath = getFilePath(dragNode.data);
@@ -699,7 +768,9 @@ function FolderTree(treeProps: TreeProps) {
         }
 
         if (isLogin) {
-            const username = getUsernameFromEmail(AppMgr.getInstance().authService.userProfile.email);
+            const username = getUsernameFromEmail(
+                AppMgr.getInstance().authService.userProfile.email,
+            );
             if (username) {
                 // refresh the Google Drive tree
                 fireGoogleUserTree(username);
@@ -711,19 +782,16 @@ function FolderTree(treeProps: TreeProps) {
     }
 
     return (
-        <div className="flex flex-col gap-1 h-full">
+        <div className="flex h-full flex-col gap-1">
             {treeProps.isHeader && (
-                <div className='flex flex-col items-center p-1 gap-1 bg-mountain-mist-100 dark:bg-mountain-mist-950'>
-                    <Login onSuccess={onGoogleLoginSuccess} logoutCallback={onGoogleLogout}/>
+                <div className="flex flex-col items-center gap-1 bg-mountain-mist-100 p-1 dark:bg-mountain-mist-950">
+                    <Login onSuccess={onGoogleLoginSuccess} logoutCallback={onGoogleLogout} />
                 </div>
             )}
-            {treeProps.isHeader && (isConnected || isLogin) &&(
-                <FolderHeader
-                    newFileCallback={onNewFile}
-                    newFolderCallback={onNewFolder}
-                />
+            {treeProps.isHeader && (isConnected || isLogin) && (
+                <FolderHeader newFileCallback={onNewFile} newFolderCallback={onNewFolder} />
             )}
-            <div ref={ref} className="flex-1 min-h-0">
+            <div ref={ref} className="min-h-0 flex-1">
                 <Tree
                     ref={treeRef}
                     className="text-md border border-shark-200 bg-mountain-mist-100 text-shark-900 dark:border-shark-950 dark:bg-mountain-mist-950 dark:text-shark-200"
diff --git a/src/components/navbar.tsx b/src/components/navbar.tsx
index 1a30b8b..efad39d 100644
--- a/src/components/navbar.tsx
+++ b/src/components/navbar.tsx
@@ -12,6 +12,7 @@ import fileupload from '@assets/images/upload_file.svg';
 import fileexport from '@assets/images/fileexport.svg';
 import filesave from '@assets/images/file_save.svg';
 import filesaveas from '@assets/images/save_as.svg';
+import copyfiles from '@assets/images/copy-files.svg';
 import fontplus from '@assets/images/text_increase.svg';
 import fontminus from '@assets/images/text_decrease.svg';
 import userguide from '@assets/images/developer_guide.svg';
@@ -96,6 +97,7 @@ import FirmwareLoaderDlg from '@components/dialogs/firmware-loaderdlg';
 import FirmwareBackupPromptDlg from '@components/dialogs/firmware-backup-promptdlg';
 import BackupDlg from '@components/dialogs/backupdlg';
 import RestoreDlg from '@components/dialogs/restoredlg';
+import CopyFileDlg from './dialogs/copyfiledlg';
 
 type NavBarProps = {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -119,7 +121,8 @@ function parseBleFailure(payload: string): BleConnectFailureInfo {
         if (typeof parsed.xrpId === 'string') {
             return {
                 xrpId: parsed.xrpId,
-                reason: known.find((reason) => reason === parsed.reason) ?? BleConnectFailure.NOT_FOUND,
+                reason:
+                    known.find((reason) => reason === parsed.reason) ?? BleConnectFailure.NOT_FOUND,
                 otherXrpId: parsed.otherXrpId,
             };
         }
@@ -164,7 +167,9 @@ function NavBar({ layoutref }: NavBarProps) {
         },
     });
     const [xprID, setXrpId] = useState<{ platform?: string; XRPID?: string } | null>(null);
-    const [rememberedXrp, setRememberedXrp] = useState<RememberedXrp | null>(() => getRememberedXrp());
+    const [rememberedXrp, setRememberedXrp] = useState<RememberedXrp | null>(() =>
+        getRememberedXrp(),
+    );
     const [connectionType, setConnectionType] = useState<ConnectionType | null>(null);
     const [availableUpdate, setAvailableUpdate] = useState<
         | { kind: 'mp'; versions: Versions }
@@ -394,9 +399,7 @@ function NavBar({ layoutref }: NavBarProps) {
                         }}
                         onSecondary={() => {
                             if (reason === BleConnectFailure.NOT_FOUND) {
-                                setDialogContent(
-                                    <ConnectionDlg callback={onConnectionCommand} />,
-                                );
+                                setDialogContent(<ConnectionDlg callback={onConnectionCommand} />);
                             } else if (reason === BleConnectFailure.USB_STILL_CONNECTED) {
                                 toggleDialog();
                             } else {
@@ -707,6 +710,14 @@ function NavBar({ layoutref }: NavBarProps) {
         }
     }
 
+    /**
+     * CopyFilesToGoogleDrive - copy the current file to Google Drive
+     */
+    function CopyFilesToGoogleDrive() {
+        setDialogContent(<CopyFileDlg toggleDialog={toggleDialog} />);
+        toggleDialog();
+    }
+
     /**
      * ViewPythonFile - view the Python file
      */
@@ -1011,10 +1022,7 @@ function NavBar({ layoutref }: NavBarProps) {
     function onConnectBtnClicked() {
         const remembered = getRememberedXrp();
         if (remembered?.xrpId) {
-            AppMgr.getInstance().emit(
-                EventType.EVENT_CONNECTION,
-                ConnectionCMD.CONNECT_KNOWN_XRP,
-            );
+            AppMgr.getInstance().emit(EventType.EVENT_CONNECTION, ConnectionCMD.CONNECT_KNOWN_XRP);
             return;
         }
         setDialogContent(<ConnectionDlg callback={onConnectionCommand} />);
@@ -1055,12 +1063,11 @@ function NavBar({ layoutref }: NavBarProps) {
         // survive the USB session ending when the cable comes out.
         saveRememberedXrp({ xrpId, lastConnectionType: ConnectionType.BLUETOOTH });
         setRememberedXrp(getRememberedXrp());
-        const powerswitchImage =
-            CommandToXRPMgr.getInstance().isNanoXRP()
-                ? undefined
-                : CommandToXRPMgr.getInstance().getXRPDrive() === Constants.XRP_PROCESSOR_BETA
-                  ? powerswitch_beta
-                  : powerswitch_standard;
+        const powerswitchImage = CommandToXRPMgr.getInstance().isNanoXRP()
+            ? undefined
+            : CommandToXRPMgr.getInstance().getXRPDrive() === Constants.XRP_PROCESSOR_BETA
+              ? powerswitch_beta
+              : powerswitch_standard;
         setDialogContent(
             <SwitchToBluetoothDlg
                 xrpId={xrpId}
@@ -1127,8 +1134,7 @@ function NavBar({ layoutref }: NavBarProps) {
 
             // Only run from a Python or Blockly tab — not Dashboard or AI Buddy
             const tabId = (activeTab ?? '').replace(/^"|"$/g, '');
-            const canRun =
-                !isOtherTab && EditorMgr.getInstance().isRunnableCodeTab(tabId);
+            const canRun = !isOtherTab && EditorMgr.getInstance().isRunnableCodeTab(tabId);
             if (!canRun) {
                 setDialogContent(
                     <AlertDialog alertMessage={t('no-editor-run')} toggleDialog={toggleDialog} />,
@@ -1237,7 +1243,9 @@ function NavBar({ layoutref }: NavBarProps) {
                                 />,
                             );
                             toggleDialog();
-                        } else if (voltage < (CommandToXRPMgr.getInstance().isNanoXRP() ? 3.6 : 5.0)) {
+                        } else if (
+                            voltage < (CommandToXRPMgr.getInstance().isNanoXRP() ? 3.6 : 5.0)
+                        ) {
                             setDialogContent(<BatteryBadDlg cancelCallback={toggleDialog} />);
                             toggleDialog();
                         } else {
@@ -1370,10 +1378,7 @@ function NavBar({ layoutref }: NavBarProps) {
      * already current.
      */
     function onUpdateAvailableClicked() {
-        if (
-            !isConnected ||
-            AppMgr.getInstance().getConnectionType() !== ConnectionType.USB
-        ) {
+        if (!isConnected || AppMgr.getInstance().getConnectionType() !== ConnectionType.USB) {
             setDialogContent(
                 <AlertDialog
                     alertMessage={t('updateAvailableNeedUsb')}
@@ -1505,6 +1510,13 @@ function NavBar({ layoutref }: NavBarProps) {
                     clicked: SaveFileAs,
                     isFile: true,
                 },
+                {
+                    label: t('copyfiles.menuTitle'),
+                    iconImage: copyfiles,
+                    clicked: CopyFilesToGoogleDrive,
+                    isFile: true,
+                    showif: isConnected && isLogin,
+                },
             ],
         },
         {
@@ -1577,11 +1589,13 @@ function NavBar({ layoutref }: NavBarProps) {
 
     const moreMenu: MenuDataItem[] = [
         ...(isAiBuddyMenuEnabled()
-            ? [{
-                label: t('ai-chat'),
-                iconImage: chatbot,
-                clicked: onAiClicked,
-            }]
+            ? [
+                  {
+                      label: t('ai-chat'),
+                      iconImage: chatbot,
+                      clicked: onAiClicked,
+                  },
+              ]
             : []),
         {
             label: t('dashboard'),
@@ -1626,19 +1640,23 @@ function NavBar({ layoutref }: NavBarProps) {
                         {item.children && (
                             <div className="absolute left-2 top-[52] z-[100] mx-auto hidden flex-col bg-curious-blue-700 py-3 shadow-md transition-all group-hover:flex dark:bg-mountain-mist-950 dark:group-hover:bg-mountain-mist-950">
                                 <ul id="pythonId" className="flex cursor-pointer flex-col">
-                                    {item.children.map((child, ci) => (
-                                        <li
-                                            key={ci}
-                                            className={`text-neutral-200 py-1 pl-4 pr-10 hover:bg-matisse-400 dark:hover:bg-shark-500 ${child.isFile && !isConnected && !isLogin ? 'pointer-events-none' : 'pointer-events-auto'} ${child.isView && !isBlockly ? 'hidden' : 'visible'}`}
-                                            onClick={child.clicked}
-                                        >
-                                            <MenuItem
-                                                isConnected={(isConnected || isLogin) && !isRunning}
-                                                isOther={isOtherTab}
-                                                item={child}
-                                            />
-                                        </li>
-                                    ))}
+                                    {item.children
+                                        .filter((child) => child.showif ?? true)
+                                        .map((child, ci) => (
+                                            <li
+                                                key={ci}
+                                                className={`text-neutral-200 py-1 pl-4 pr-10 hover:bg-matisse-400 dark:hover:bg-shark-500 ${child.isFile && !isConnected && !isLogin ? 'pointer-events-none' : 'pointer-events-auto'} ${child.isView && !isBlockly ? 'hidden' : 'visible'}`}
+                                                onClick={child.clicked}
+                                            >
+                                                <MenuItem
+                                                    isConnected={
+                                                        (isConnected || isLogin) && !isRunning
+                                                    }
+                                                    isOther={isOtherTab}
+                                                    item={child}
+                                                />
+                                            </li>
+                                        ))}
                                 </ul>
                                 {item.childrenExt && (
                                     <ul
@@ -1716,9 +1734,7 @@ function NavBar({ layoutref }: NavBarProps) {
                         <span>{t('updateAvailable')}</span>
                     </button>
                 )}
-                <div
-                    className={`flex h-full items-stretch ${isConnected ? 'hidden' : ''}`}
-                >
+                <div className={`flex h-full items-stretch ${isConnected ? 'hidden' : ''}`}>
                     <button
                         id="connectBtn"
                         className="text-neutral-900 flex h-full min-w-[200px] items-center justify-center gap-2 rounded-l-3xl bg-shark-200 px-4 py-2 text-matisse-900 hover:bg-curious-blue-300 dark:bg-shark-600 dark:text-shark-100 dark:hover:bg-shark-500"
@@ -1727,8 +1743,18 @@ function NavBar({ layoutref }: NavBarProps) {
                         <svg width="20" height="20" viewBox="0 0 20 20">
                             <polygon points="11 4 12 4 12 8 16 8 16 9 11 9"></polygon>
                             <polygon points="4 11 9 11 9 16 8 16 8 12 4 12"></polygon>
-                            <path fill="none" stroke="#000" strokeWidth="1.1" d="M12,8 L18,2"></path>
-                            <path fill="none" stroke="#000" strokeWidth="1.1" d="M2,18 L8,12"></path>
+                            <path
+                                fill="none"
+                                stroke="#000"
+                                strokeWidth="1.1"
+                                d="M12,8 L18,2"
+                            ></path>
+                            <path
+                                fill="none"
+                                stroke="#000"
+                                strokeWidth="1.1"
+                                d="M2,18 L8,12"
+                            ></path>
                         </svg>
                         <span>
                             {rememberedXrp?.xrpId
diff --git a/src/components/xrplayout.tsx b/src/components/xrplayout.tsx
index 15fd40c..0cfe40d 100644
--- a/src/components/xrplayout.tsx
+++ b/src/components/xrplayout.tsx
@@ -388,7 +388,13 @@ function XRPLayout({ forwardedref }: XRPLayoutProps) {
                 <img
                     src={FolderIcon}
                     alt="icon"
-                    style={{ width: '16px', height: '16px', marginRight: '16px' }}
+                    style={{
+                        width: '16px',
+                        height: '16px',
+                        marginRight: '16px',
+                        flexShrink: 0,
+                        minWidth: '16px',
+                    }}
                 />
             );
         } else if (node.getId() === Constants.SHELL_TAB_ID) {
@@ -396,7 +402,13 @@ function XRPLayout({ forwardedref }: XRPLayoutProps) {
                 <img
                     src={ShellIcon}
                     alt="icon"
-                    style={{ width: '16px', height: '16px', marginRight: '0px' }}
+                    style={{
+                        width: '16px',
+                        height: '16px',
+                        marginRight: '0px',
+                        flexShrink: 0,
+                        minWidth: '16px',
+                    }}
                 />
             );
         } else if (EditorMgr.getInstance().getEditorSession(node.getId())?.gpath) {
@@ -404,7 +416,11 @@ function XRPLayout({ forwardedref }: XRPLayoutProps) {
             // files and the Dashboard/AI Buddy tabs use an empty gpath, so a
             // truthy check keeps the Drive icon off of them.
             renderValues.leading = (
-                <img src={GoogleDriveLogo} alt="icon" style={{ width: '16px', height: '16px' }} />
+                <img
+                    src={GoogleDriveLogo}
+                    alt="icon"
+                    style={{ width: '16px', height: '16px', flexShrink: 0, minWidth: '16px' }}
+                />
             );
         }
         renderValues.content = t(node.getName());
diff --git a/src/utils/i18n/locales/en/en.json b/src/utils/i18n/locales/en/en.json
index 1041369..902a357 100644
--- a/src/utils/i18n/locales/en/en.json
+++ b/src/utils/i18n/locales/en/en.json
@@ -277,5 +277,15 @@
         "description": "Restore XRP Robot files from Google Drive.",
         "processing": "Processing {{ filename }}",
         "begin": "Begin Restore"
+    },
+    "copyfiles": {
+        "title": "Copy Files to Google Drive",
+        "description": "This will allow you to select files from the XRP Robot and copy them to Google Drive. Select files from left and destination on right and click the Copy button to begin the copy process.",
+        "close": "Close",
+        "copy": "Copy",
+        "menuTitle": "Copy Files",
+        "xrprobot": "XRP Robot Files",
+        "gdrive": "Google Drive Files",
+        "copyTooltip": "Copy selected files to Google Drive"
     }
 }
\ No newline at end of file
diff --git a/src/utils/i18n/locales/es/es.json b/src/utils/i18n/locales/es/es.json
index bbfb780..af368d8 100644
--- a/src/utils/i18n/locales/es/es.json
+++ b/src/utils/i18n/locales/es/es.json
@@ -277,5 +277,15 @@
         "description": "Restaura tus archivos XRP desde tu XRP Robot a Google Drive.",
         "processing": "Procesando...",
         "begin": "Comenzar Restauración"
+    },
+    "copyfiles": {
+        "title": "Copiar archivos a Google Drive",
+        "description": "Esto le permitirá seleccionar archivos del XRP Robot y copiarlos a Google Drive. Seleccione uno o varios archivos de la lista de la izquierda y seleccione una carpeta de destino en la lista de la derecha. Luego haga clic en el botón Copiar archivos para comenzar. Un registro de copia aparecerá en la sección central, mostrando el progreso de la copia",
+        "close": "Cerrar",
+        "copy": "Copiar",
+        "menuTitle": "Copiar archivos",
+        "xrprobot": "Archivos del robot XRP",
+        "googledrive": "Archivos de Google Drive",
+        "copyTooltip": "Copiar archivos a Google Drive"
     }
 }
\ No newline at end of file
diff --git a/src/widgets/menutypes.ts b/src/widgets/menutypes.ts
index 005e4cf..3fc85f7 100644
--- a/src/widgets/menutypes.ts
+++ b/src/widgets/menutypes.ts
@@ -2,9 +2,10 @@ export type MenuDataItem = {
     label: string;
     isFile?: boolean;
     isView?: boolean;
+    showif?: boolean;
     link?: string;
     iconImage?: string;
     clicked?: () => void;
     children?: MenuDataItem[];
     childrenExt?: MenuDataItem[];
-};
\ No newline at end of file
+};