implement multiple files gist publish

pull/5065/head
Joseph Izang 4 months ago committed by Aniket
parent 5ec8e4721f
commit 3663320776
  1. 2
      libs/remix-ui/workspace/src/lib/actions/index.ts
  2. 5
      libs/remix-ui/workspace/src/lib/components/file-explorer-context-menu.tsx
  3. 8
      libs/remix-ui/workspace/src/lib/components/file-explorer.tsx
  4. 35
      libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx
  5. 7
      libs/remix-ui/workspace/src/lib/types/index.ts
  6. 9
      libs/remix-ui/workspace/src/lib/utils/index.ts

@ -328,6 +328,8 @@ export const publishToGist = async (path?: string) => {
handleGistResponse(error, result)
})
}
// fire event for cleanup of temp folder
plugin.emit('FinishedGistPublish', folder)
}
} catch (error) {
console.log(error)

@ -40,6 +40,7 @@ export const FileExplorerContextMenu = (props: FileExplorerContextMenuProps) =>
focus,
downloadPath,
uploadFile,
publishManyFilesToGist,
...otherProps
} = props
const contextMenuRef = useRef(null)
@ -197,6 +198,10 @@ export const FileExplorerContextMenu = (props: FileExplorerContextMenuProps) =>
_paq.push(['trackEvent', 'fileExplorer', 'contextMenu', 'publishFileToGist'])
publishFileToGist(path)
break
case 'Publish files to gist':
_paq.push(['trackEvent', 'fileExplorer', 'contextMenu', 'publishFilesToGist'])
publishManyFilesToGist()
break
case 'Run':
_paq.push(['trackEvent', 'fileExplorer', 'contextMenu', 'runScript'])
runScript(path)

@ -9,7 +9,7 @@ import '../css/file-explorer.css'
import { checkSpecialChars, extractNameFromKey, extractParentFromKey, getPathIcon, joinPath } from '@remix-ui/helper'
// eslint-disable-next-line @typescript-eslint/no-unused-vars
import { ROOT_PATH } from '../utils/constants'
import { moveFileIsAllowed, moveFilesIsAllowed, moveFolderIsAllowed, moveFoldersIsAllowed } from '../actions'
import { copyFile, moveFileIsAllowed, moveFilesIsAllowed, moveFolderIsAllowed, moveFoldersIsAllowed } from '../actions'
import { FlatTree } from './flat-tree'
import { FileSystemContext } from '../contexts'
@ -35,7 +35,9 @@ export const FileExplorer = (props: FileExplorerProps) => {
uploadFile,
uploadFolder,
fileState,
canPaste
canPaste,
feTarget,
setFeTarget
} = props
const [state, setState] = useState<WorkSpaceState>(workspaceState)
// const [isPending, startTransition] = useTransition();
@ -43,7 +45,6 @@ export const FileExplorer = (props: FileExplorerProps) => {
const [cutActivated, setCutActivated] = useState(false)
const { plugin } = useContext(FileSystemContext)
const [feTarget, setFeTarget] = useState<{ key: string, type: 'file' | 'folder' }[]>({} as { key: string, type: 'file' | 'folder' }[])
const [filesSelected, setFilesSelected] = useState<string[]>([])
const feWindow = (window as any)
@ -589,7 +590,6 @@ export const FileExplorer = (props: FileExplorerProps) => {
<div onClick={handleFileExplorerMenuClick}>
<FileExplorerMenu
title={''}
menuItems={props.menuItems}
createNewFile={handleNewFileInput}
createNewFolder={handleNewFolderInput}

@ -129,6 +129,7 @@ export function Workspace() {
})
const [validationResult, setValidationResult] = useState<ValidationResult>({ valid: true, message: '' })
const [feTarget, setFeTarget] = useState<{ key: string, type: 'file' | 'folder' }[]>({} as { key: string, type: 'file' | 'folder' }[])
const loadingInitialState = {
tooltip: '',
@ -154,6 +155,31 @@ export function Workspace() {
})
}
/**
* Void action to ensure multiselected files are published
* folders are not handled
*/
const handlePublishingMultiSelectedFilesToGist = async () => {
const tempFolderName = '.gistTemp'
// first create a temporary folder to populate selected files
try {
await global.dispatchCreateNewFolder(tempFolderName, ROOT_PATH)
feTarget.filter(feObject => feObject.type !== 'folder')
.forEach(async feFile => {
await copyFile(feFile.key, tempFolderName)
})
await global.dispatchPublishToGist(tempFolderName)
global.plugin.on('finishedGistPublish', async (folderName) => {
console.log('name of folder', folderName)
if (folderName === tempFolderName)
await global.dispatchDeletePath(folderName)
})
} catch (error) {
await global.plugin.call('notification', 'toast', 'Could not publish files to gist. There was an error')
await global.plugin.call('notification', 'toast', typeof(error) === 'string' ? error : `${console.log(error)} check the console for more details`)
}
}
const showFullMessage = async (title: string, loadItem: string, examples: Array<string>, prefix = '') => {
setModalState((prevState) => {
return {
@ -1023,6 +1049,9 @@ export function Workspace() {
files={global.fs.browser.files}
flatTree={global.fs.browser.flatTree}
workspaceState={state}
feTarget={feTarget}
setFeTarget={setFeTarget}
publishManyFilesToGist={handlePublishingMultiSelectedFilesToGist}
expandPath={global.fs.browser.expandPath}
focusEdit={global.fs.focusEdit}
focusElement={global.fs.focusElement}
@ -1094,6 +1123,9 @@ export function Workspace() {
fileState={[]}
canPaste={canPaste}
workspaceState={state}
feTarget={feTarget}
setFeTarget={setFeTarget}
publishManyFilesToGist={handlePublishingMultiSelectedFilesToGist}
expandPath={global.fs.localhost.expandPath}
focusEdit={global.fs.focusEdit}
focusElement={global.fs.focusElement}
@ -1269,7 +1301,7 @@ export function Workspace() {
)}
{state.showContextMenu && (
<FileExplorerContextMenu
actions={global.fs.focusElement.length > 1 ? state.actions.filter((item) => item.multiselect) : state.actions.filter((item) => !item.multiselect)}
actions={(global.fs.focusElement.length > 1 || feTarget.length > 1) ? state.actions.filter((item) => item.multiselect) : state.actions.filter((item) => !item.multiselect)}
hideContextMenu={hideContextMenu}
createNewFile={handleNewFileInput}
createNewFolder={handleNewFolderInput}
@ -1292,6 +1324,7 @@ export function Workspace() {
publishFileToGist={publishFileToGist}
uploadFile={uploadFile}
downloadPath={downloadPath}
publishManyFilesToGist={handlePublishingMultiSelectedFilesToGist}
/>
)}

@ -160,6 +160,12 @@ export interface FileExplorerProps {
importFromIpfs: any
importFromHttps: any
handleMultiCopies: any
feTarget: { key: string, type: 'file' | 'folder' }[]
setFeTarget: Dispatch<React.SetStateAction<{
key: string;
type: "file" | "folder";
}[]>>
publishManyFilesToGist: () => Promise<void>
}
export interface FileExplorerMenuProps {
@ -201,6 +207,7 @@ export interface FileExplorerContextMenuProps {
copyPath?: (path: string, type: string) => void
generateUml?: (path: string) => Promise<void>
uploadFile?: (target: EventTarget & HTMLInputElement) => void
publishManyFilesToGist: () => Promise<void>
}
export interface WorkSpaceState {

@ -97,6 +97,15 @@ export const contextMenuActions: MenuItems = [{
group: 4,
platform: appPlatformTypes.web
}, {
id: 'publishFilesToGist',
name: 'Publish files to gist',
type: ['file'],
multiselect: true,
label: '',
group: 4,
platform: appPlatformTypes.web
}
, {
id: 'uploadFile',
name: 'Load a Local File',
type: ['folder', 'workspace'],

Loading…
Cancel
Save