diff --git a/apps/remix-ide/src/app/panels/file-panel.js b/apps/remix-ide/src/app/panels/file-panel.js index 6fd79c40ed..30d4100dd5 100644 --- a/apps/remix-ide/src/app/panels/file-panel.js +++ b/apps/remix-ide/src/app/panels/file-panel.js @@ -60,8 +60,7 @@ module.exports = class Filepanel extends ViewPlugin { this.gitHandle = new GitHandle() this.registeredMenuItems = [] this.request = {} - - this.renderComponent() + this.getWorkspaces() } render () { @@ -85,6 +84,7 @@ module.exports = class Filepanel extends ViewPlugin { registry={this._components.registry} plugin={this} request={this.request} + workspaces={this.workspaces} registeredMenuItems={this.registeredMenuItems} /> , this.el) @@ -108,7 +108,18 @@ module.exports = class Filepanel extends ViewPlugin { } async getWorkspaces () { - return await this.request.getWorkspaces() + const result = new Promise((resolve, reject) => { + const workspacesPath = this._deps.fileProviders.workspace.workspacesPath + this._deps.fileProviders.browser.resolveDirectory('/' + workspacesPath, (error, items) => { + if (error) return reject(error) + resolve(Object.keys(items) + .filter((item) => items[item].isDirectory) + .map((folder) => folder.replace(workspacesPath + '/', ''))) + }) + }) + this.workspaces = await result + this.renderComponent() + return this.workspaces } async createNewFile () { diff --git a/libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx b/libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx index c2e1042efb..a25dbbc261 100644 --- a/libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx +++ b/libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx @@ -23,6 +23,7 @@ export interface WorkspaceProps { registry: any // registry plugin: any // plugin call and resetFocus request: any // api request, + workspaces: any, registeredMenuItems: [] // menu items } @@ -43,16 +44,15 @@ export const Workspace = (props: WorkspaceProps) => { return { ...prevState, displayNewFile: !state.displayNewFile } }) } - /**** ****/ /* implement an external API, consumed by the parent */ props.request.createWorkspace = () => { return createWorkspace() } - props.request.getWorkspaces = () => { - return getWorkspaces() - } + // props.request.getWorkspaces = () => { + // return getWorkspaces() + // } props.request.createNewFile = () => { props.plugin.resetNewFile() @@ -67,10 +67,21 @@ export const Workspace = (props: WorkspaceProps) => { props.request.getCurrentWorkspace = () => { return state.currentWorkspace } - /**** ****/ useEffect(() => { initWorkspace() }, []) + useEffect(() => { + const getWorkspaces = async () => { + if (props.workspaces && Array.isArray(props.workspaces)) { + setState(prevState => { + return { ...prevState, workspaces: props.workspaces } + }) + } + } + + getWorkspaces() + }, [props.workspaces]) + const [state, setState] = useState({ workspaces: [], reset: false, @@ -143,27 +154,26 @@ export const Workspace = (props: WorkspaceProps) => { /* workspace creation, renaming and deletion */ - const modal = (title: string, message: string, ok: { label: string, fn: () => void }, cancel: { label: string, fn: () => void }) => { - setState(prevState => { - return { - ...prevState, - modals: [...prevState.modals, - { - message, - title, - ok, - cancel, - handleHide: handleHideModal - }] - } - }) - } + // const modal = (title: string, message: string, ok: { label: string, fn: () => void }, cancel: { label: string, fn: () => void }) => { + // setState(prevState => { + // return { + // ...prevState, + // modals: [...prevState.modals, + // { + // message, + // title, + // ok, + // cancel, + // handleHide: handleHideModal + // }] + // } + // }) + // } const workspaceRenameInput = useRef() const workspaceCreateInput = useRef() const createWorkspace = () => { - modal() setState(prevState => { state.createModal.hide = false return { ...prevState, ...state.createModal } @@ -223,7 +233,7 @@ export const Workspace = (props: WorkspaceProps) => { }) } - const setWorkspace = async (name) => { + const setWorkspace = async (name) => { if (name === LOCALHOST) { props.workspace.clearWorkspace() } else if (name === NO_WORKSPACE) { @@ -231,9 +241,9 @@ export const Workspace = (props: WorkspaceProps) => { } else { props.workspace.setWorkspace(name) } - const workspaces = await getWorkspaces() + props.plugin.getWorkspaces() setState(prevState => { - return { ...prevState, workspaces, currentWorkspace: name } + return { ...prevState, currentWorkspace: name } }) props.setWorkspace({ name, isLocalhost: name === LOCALHOST }) } @@ -272,26 +282,11 @@ export const Workspace = (props: WorkspaceProps) => { setWorkspace('default_workspace') } else { // we've already got some workspaces - const workspaces = await getWorkspaces() - - if (workspaces.length) setWorkspace(workspaces[0]) - else setWorkspace(NO_WORKSPACE) + setWorkspace(NO_WORKSPACE) } }) } - const getWorkspaces = (): any => { - return new Promise((resolve, reject) => { - const workspacesPath = props.workspace.workspacesPath - props.browser.resolveDirectory('/' + workspacesPath, (error, items) => { - if (error) return reject(error) - resolve(Object.keys(items) - .filter((item) => items[item].isDirectory) - .map((folder) => folder.replace(workspacesPath + '/', ''))) - }) - }) - } - const remixdExplorer = { hide: () => { if (state.currentWorkspace === LOCALHOST) setWorkspace(NO_WORKSPACE)