drag and drop working

pull/2620/head
Seth Samuel 2 years ago
parent dfa83f8822
commit 1e875da4c2
  1. 8
      libs/remix-ui/tree-view/src/lib/tree-view-item/tree-view-item.tsx
  2. 4
      libs/remix-ui/tree-view/src/types/index.ts
  3. 13
      libs/remix-ui/workspace/src/lib/components/file-explorer.tsx
  4. 13
      libs/remix-ui/workspace/src/lib/contexts/index.ts

@ -1,11 +1,11 @@
import React, { useState, useEffect, useRef, useMemo, useContext } from 'react'; // eslint-disable-line import React, { useState, useEffect, useRef, useContext } from 'react'; // eslint-disable-line
import { TreeViewItemProps } from '../../types'; import { TreeViewItemProps } from '../../types';
import './tree-view-item.css'; import './tree-view-item.css';
import { MoveContext } from '../../../../workspace/src/lib/components/file-explorer' import { MoveContext } from '@remix-ui/workspace'
export const TreeViewItem = (props: TreeViewItemProps) => { export const TreeViewItem = (props: TreeViewItemProps) => {
const { id, children, label, labelClass, expand, iconX = 'fas fa-caret-right', iconY = 'fas fa-caret-down', icon, controlBehaviour = false, innerRef, file, showIcon = true, ...otherProps } = props; const { id, children, label, labelClass, expand, iconX = 'fas fa-caret-right', iconY = 'fas fa-caret-down', icon, controlBehaviour = false, file, showIcon = true, ...otherProps } = props;
const [isExpanded, setIsExpanded] = useState(false); const [isExpanded, setIsExpanded] = useState(false);
const dragRef = useRef<HTMLLIElement>(); const dragRef = useRef<HTMLLIElement>();
const moveContext = useContext(MoveContext) const moveContext = useContext(MoveContext)

@ -1,6 +1,4 @@
/* eslint-disable no-undef */ /* eslint-disable no-undef */
import { FileType } from 'libs/remix-ui/workspace/src/lib/types/index'
export interface TreeViewProps { export interface TreeViewProps {
children?: React.ReactNode, children?: React.ReactNode,
id?: string id?: string
@ -27,5 +25,5 @@ export interface TreeViewItemProps {
showIcon?: boolean showIcon?: boolean
expandedPaths?: string[]; expandedPaths?: string[];
handleClickFolder?: (path: string, type: string) => void; handleClickFolder?: (path: string, type: string) => void;
file?: FileType file?: any
} }

@ -10,18 +10,7 @@ import '../css/file-explorer.css'
import { checkSpecialChars, extractNameFromKey, extractParentFromKey, joinPath } from '@remix-ui/helper' import { checkSpecialChars, extractNameFromKey, extractParentFromKey, joinPath } from '@remix-ui/helper'
// eslint-disable-next-line @typescript-eslint/no-unused-vars // eslint-disable-next-line @typescript-eslint/no-unused-vars
import { FileRender } from './file-render' import { FileRender } from './file-render'
import { MoveContext } from '../contexts'
interface MoveContextType{
dragged: string,
moveFile: (dest: string) => void
currentlyMoved: (path: string) => void
}
export const MoveContext = React.createContext<MoveContextType>({
dragged:"",
moveFile:( )=> {},
currentlyMoved: () => {}
})
export const FileExplorer = (props: FileExplorerProps) => { export const FileExplorer = (props: FileExplorerProps) => {
const { name, contextMenuItems, removedContextMenuItems, files, fileState } = props const { name, contextMenuItems, removedContextMenuItems, files, fileState } = props

@ -33,3 +33,16 @@ export const FileSystemContext = createContext<{
dispatchMoveFile: (src: string, dest: string) => Promise<void>, dispatchMoveFile: (src: string, dest: string) => Promise<void>,
dispatchCloneRepository: (url: string) => Promise<void> dispatchCloneRepository: (url: string) => Promise<void>
}>(null) }>(null)
interface MoveContextType{
dragged: string,
moveFile: (dest: string) => void
currentlyMoved: (path: string) => void
}
export const MoveContext = createContext<MoveContextType>({
dragged:"",
moveFile:( )=> {},
currentlyMoved: () => {}
})
Loading…
Cancel
Save