check available workspace name

apps/remix-ide/src/app/panels/file-panel.js

@@ -30,7 +30,7 @@ const { SlitherHandle } = require('../files/slither-handle.js')
 const profile = {
   name: 'filePanel',
   displayName: 'File explorer',
-  methods: ['createNewFile', 'uploadFile', 'getCurrentWorkspace', 'getWorkspaces', 'createWorkspace', 'setWorkspace', 'registerContextMenuItem', 'renameWorkspace', 'deleteWorkspace'],
+  methods: ['createNewFile', 'uploadFile', 'getCurrentWorkspace', 'getAvailableWorkspaceName', 'getWorkspaces', 'createWorkspace', 'setWorkspace', 'registerContextMenuItem', 'renameWorkspace', 'deleteWorkspace'],
   events: ['setWorkspace', 'workspaceRenamed', 'workspaceDeleted', 'workspaceCreated'],
   icon: 'assets/img/fileManager.webp',
   description: 'Remix IDE file explorer',
@@ -94,6 +94,16 @@ module.exports = class Filepanel extends ViewPlugin {
     return this.workspaces
   }
 
+  getAvailableWorkspaceName (name) {
+    let index = 1
+    let workspace = this.workspaces.find(workspace => workspace.name === name + ' - ' + index)
+    while (workspace) {
+      index++
+      workspace = this.workspaces.find(workspace => workspace.name === name + ' - ' + index)      
+    }
+    return name + ' - ' + index
+  }
+
   setWorkspaces (workspaces) {
     this.workspaces = workspaces
   }

libs/remix-ui/home-tab/src/lib/components/homeTabGetStarted.tsx

@@ -60,9 +60,10 @@ function HomeTabGetStarted ({plugin}: HomeTabGetStartedProps) {
   const createWorkspace = async (templateName) => {
     await plugin.appManager.activatePlugin('filePanel')
     const timeStamp = Date.now()
-    const templateDisplayName = TEMPLATE_NAMES[templateName]
+    let templateDisplayName = TEMPLATE_NAMES[templateName]
-    await plugin.call('filePanel', 'createWorkspace', templateDisplayName + " " + timeStamp, templateName)
+    templateDisplayName = await plugin.call('filePanale', 'getAvailableWorkspaceName', templateDisplayName)
-    await plugin.call('filePanel', 'setWorkspace', templateDisplayName + " " + timeStamp)
+    await plugin.call('filePanel', 'createWorkspace', templateDisplayName, templateName)
+    await plugin.call('filePanel', 'setWorkspace', templateDisplayName)
     plugin.verticalIcons.select('filePanel')
     _paq.push(['trackEvent', 'hometab', 'homeGetStarted', templateName])
   }

libs/remix-ui/workspace/src/lib/contexts/index.ts

@@ -4,6 +4,7 @@ import { BrowserState } from '../reducers/workspace'
 
 export const FileSystemContext = createContext<{
   fs: BrowserState,
+  plugin: any,
   modal:(title: string | JSX.Element, message: string | JSX.Element, okLabel: string, okFn: () => void, cancelLabel?: string, cancelFn?: () => void) => void,
   dispatchInitWorkspace:() => Promise<void>,
   dispatchFetchDirectory:(path: string) => Promise<void>,

libs/remix-ui/workspace/src/lib/providers/FileSystemProvider.tsx

@@ -255,6 +255,7 @@ export const FileSystemProvider = (props: WorkspaceProps) => {
 
   const value = {
     fs,
+    plugin,
     modal,
     toast,
     dispatchInitWorkspace,

libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx

@@ -231,7 +231,10 @@ export function Workspace () {
     } else displayOzCustomRef.current.style.display = 'none'
 
     // @ts-ignore
-    workspaceCreateInput.current.value = `${TEMPLATE_NAMES[workspaceCreateTemplateInput.current.value || 'remixDefault']} ${Date.now()}`
+    let displayName = TEMPLATE_NAMES[(workspaceCreateTemplateInput.current && workspaceCreateTemplateInput.current.value) || 'remixDefault']
+    displayName = global.plugin.getAvailableWorkspaceName(displayName)
+    // @ts-ignore
+    workspaceCreateInput.current.value = displayName
   }
 
   const handleTypingUrl = () => {
@@ -348,7 +351,7 @@ export function Workspace () {
         </div>
 
         <label id="wsName" className="form-check-label" style={{fontWeight: "bolder"}} ><FormattedMessage id='filePanel.workspaceName' /></label>
-        <input type="text" data-id="modalDialogCustomPromptTextCreate" defaultValue={`Basic ${Date.now()}`} ref={workspaceCreateInput} className="form-control" />
+        <input type="text" data-id="modalDialogCustomPromptTextCreate" defaultValue={global.plugin.getAvailableWorkspaceName(TEMPLATE_NAMES['remixDefault'])} ref={workspaceCreateInput} className="form-control" />
 
         <div className="d-flex py-2 align-items-center custom-control custom-checkbox">
           <input