diff --git a/apps/remix-ide/src/app/panels/file-panel.js b/apps/remix-ide/src/app/panels/file-panel.js index 9eb9a04c04..91f33673dd 100644 --- a/apps/remix-ide/src/app/panels/file-panel.js +++ b/apps/remix-ide/src/app/panels/file-panel.js @@ -65,6 +65,7 @@ module.exports = class Filepanel extends ViewPlugin { this.renderComponent() } } + this.reset = false this.el = yo`
@@ -92,6 +93,11 @@ module.exports = class Filepanel extends ViewPlugin { this.renderComponent() } + resetFocus (value) { + this.reset = value + this.renderComponent() + } + render () { return this.el } @@ -99,7 +105,7 @@ module.exports = class Filepanel extends ViewPlugin { renderComponent () { ReactDOM.render(
-
+
this.resetFocus(true)}>
@@ -109,6 +115,7 @@ module.exports = class Filepanel extends ViewPlugin { filesProvider={this._deps.fileProviders.browser} menuItems={['createNewFile', 'createNewFolder', 'publishToGist', canUpload ? 'uploadFile' : '']} plugin={this} + focusRoot={this.reset} />
@@ -119,6 +126,7 @@ module.exports = class Filepanel extends ViewPlugin { filesProvider={this._deps.fileProviders.localhost} menuItems={['createNewFile', 'createNewFolder']} plugin={this} + focusRoot={this.reset} /> }
diff --git a/libs/remix-ui/file-explorer/src/lib/file-explorer.tsx b/libs/remix-ui/file-explorer/src/lib/file-explorer.tsx index e02712a844..16ab028599 100644 --- a/libs/remix-ui/file-explorer/src/lib/file-explorer.tsx +++ b/libs/remix-ui/file-explorer/src/lib/file-explorer.tsx @@ -16,7 +16,7 @@ import './css/file-explorer.css' const queryParams = new QueryParams() export const FileExplorer = (props: FileExplorerProps) => { - const { filesProvider, name, registry, plugin } = props + const { filesProvider, name, registry, plugin, focusRoot } = props const [state, setState] = useState({ focusElement: [{ key: name, @@ -156,6 +156,15 @@ export const FileExplorer = (props: FileExplorerProps) => { filesProvider.event.register('fileRenamed', fileRenamed) }, [state.files]) + useEffect(() => { + if (focusRoot) { + setState(prevState => { + return { ...prevState, focusElement: [{ key: name, type: 'folder' }] } + }) + plugin.resetFocus(false) + } + }, [focusRoot]) + const resolveDirectory = async (folderPath, dir: File[], isChild = false): Promise => { if (!isChild && (state.focusEdit.element === 'browser/blank') && state.focusEdit.isNew && (dir.findIndex(({ path }) => path === 'browser/blank') === -1)) { dir = state.focusEdit.type === 'file' ? [...dir, { @@ -287,7 +296,7 @@ export const FileExplorer = (props: FileExplorerProps) => { } const isDir = state.fileManager.isDirectory(path) - modal('Delete file', `Are you sure you want to delete ${path} ${isDir ? 'folder' : 'file'}?`, { + modal(`Delete ${isDir ? 'folder' : 'file'}`, `Are you sure you want to delete ${path} ${isDir ? 'folder' : 'file'}?`, { label: 'Ok', fn: async () => { try { @@ -295,7 +304,7 @@ export const FileExplorer = (props: FileExplorerProps) => { await fileManager.remove(path) } catch (e) { - toast(`Failed to remove file ${path}.`) + toast(`Failed to remove ${isDir ? 'folder' : 'file'} ${path}.`) } } }, { @@ -684,6 +693,7 @@ export const FileExplorer = (props: FileExplorerProps) => { } const editModeOff = async (content: string) => { + if (typeof content === 'string') content = content.trim() const parentFolder = extractParentFromKey(state.focusEdit.element) if (!content || (content.trim() === '')) { @@ -702,6 +712,7 @@ export const FileExplorer = (props: FileExplorerProps) => { } } else { if (state.focusEdit.lastEdit === content) { + editRef.current.textContent = content return setState(prevState => { return { ...prevState, focusEdit: { element: null, isNew: false, type: '', lastEdit: '' } } }) @@ -827,7 +838,6 @@ export const FileExplorer = (props: FileExplorerProps) => { createNewFolder={handleNewFolderInput} deletePath={deletePath} renamePath={editModeOn} - extractParentFromKey={extractParentFromKey} publishToGist={publishToGist} pageX={state.focusContext.x} pageY={state.focusContext.y} diff --git a/libs/remix-ui/file-explorer/src/lib/types/index.ts b/libs/remix-ui/file-explorer/src/lib/types/index.ts index d87d71062c..e2225dfc24 100644 --- a/libs/remix-ui/file-explorer/src/lib/types/index.ts +++ b/libs/remix-ui/file-explorer/src/lib/types/index.ts @@ -4,7 +4,8 @@ export interface FileExplorerProps { registry: any, filesProvider: any, menuItems?: string[], - plugin: any + plugin: any, + focusRoot: boolean } export interface File {