mirror of
https://github.com/overleaf/overleaf.git
synced 2024-11-21 20:47:08 -05:00
Merge pull request #4023 from overleaf/ae-reset-file-tree-state
Reset file tree component state when rootFolder prop changes GitOrigin-RevId: acf23ce7c7a8f175c4e12b367bfa9e48d2f946c8
This commit is contained in:
parent
4f20319167
commit
fb9579c2b7
3 changed files with 36 additions and 9 deletions
|
@ -15,7 +15,7 @@ import {
|
|||
syncMove,
|
||||
syncCreateEntity,
|
||||
} from '../util/sync-mutation'
|
||||
import { findInTreeOrThrow } from '../util/find-in-tree'
|
||||
import { findInTree, findInTreeOrThrow } from '../util/find-in-tree'
|
||||
import { isNameUniqueInFolder } from '../util/is-name-unique-in-folder'
|
||||
import { isBlockedFilename, isCleanFilename } from '../util/safe-path'
|
||||
|
||||
|
@ -380,7 +380,13 @@ function getSelectedParentFolderId(fileTreeData, selectedEntityIds) {
|
|||
return fileTreeData._id
|
||||
}
|
||||
|
||||
const found = findInTreeOrThrow(fileTreeData, selectedEntityId)
|
||||
const found = findInTree(fileTreeData, selectedEntityId)
|
||||
|
||||
if (!found) {
|
||||
// if the entity isn't in the tree, return the root folder id.
|
||||
return fileTreeData._id
|
||||
}
|
||||
|
||||
return found.type === 'folder' ? found.entity._id : found.parentFolderId
|
||||
}
|
||||
|
||||
|
|
|
@ -3,6 +3,7 @@ import React, {
|
|||
useCallback,
|
||||
useReducer,
|
||||
useContext,
|
||||
useEffect,
|
||||
} from 'react'
|
||||
import PropTypes from 'prop-types'
|
||||
|
||||
|
@ -17,6 +18,7 @@ const FileTreeMutableContext = createContext()
|
|||
|
||||
const ACTION_TYPES = {
|
||||
RENAME: 'RENAME',
|
||||
RESET: 'RESET',
|
||||
DELETE: 'DELETE',
|
||||
MOVE: 'MOVE',
|
||||
CREATE_ENTITY: 'CREATE_ENTITY',
|
||||
|
@ -24,6 +26,15 @@ const ACTION_TYPES = {
|
|||
|
||||
function fileTreeMutableReducer({ fileTreeData }, action) {
|
||||
switch (action.type) {
|
||||
case ACTION_TYPES.RESET: {
|
||||
const newFileTreeData = action.fileTreeData
|
||||
|
||||
return {
|
||||
fileTreeData: newFileTreeData,
|
||||
fileCount: countFiles(newFileTreeData),
|
||||
}
|
||||
}
|
||||
|
||||
case ACTION_TYPES.RENAME: {
|
||||
const newFileTreeData = renameInTree(fileTreeData, action.id, {
|
||||
newName: action.newName,
|
||||
|
@ -76,15 +87,25 @@ function fileTreeMutableReducer({ fileTreeData }, action) {
|
|||
}
|
||||
}
|
||||
|
||||
const initialState = rootFolder => ({
|
||||
fileTreeData: rootFolder[0],
|
||||
fileCount: countFiles(rootFolder[0]),
|
||||
})
|
||||
|
||||
export const FileTreeMutableProvider = function ({ rootFolder, children }) {
|
||||
const [{ fileTreeData, fileCount }, dispatch] = useReducer(
|
||||
fileTreeMutableReducer,
|
||||
{
|
||||
fileTreeData: rootFolder[0],
|
||||
fileCount: countFiles(rootFolder[0]),
|
||||
}
|
||||
rootFolder,
|
||||
initialState
|
||||
)
|
||||
|
||||
useEffect(() => {
|
||||
dispatch({
|
||||
type: ACTION_TYPES.RESET,
|
||||
fileTreeData: rootFolder[0],
|
||||
})
|
||||
}, [rootFolder])
|
||||
|
||||
const dispatchCreateFolder = useCallback((parentFolderId, entity) => {
|
||||
entity.type = 'folder'
|
||||
dispatch({
|
||||
|
|
|
@ -123,9 +123,9 @@ export function FileTreeSelectableProvider({
|
|||
|
||||
// calls `onSelect` on entities selection
|
||||
useEffect(() => {
|
||||
const selectedEntities = Array.from(selectedEntityIds).map(id =>
|
||||
findInTree(fileTreeData, id)
|
||||
)
|
||||
const selectedEntities = Array.from(selectedEntityIds)
|
||||
.map(id => findInTree(fileTreeData, id))
|
||||
.filter(Boolean)
|
||||
onSelect(selectedEntities)
|
||||
}, [fileTreeData, selectedEntityIds, onSelect])
|
||||
|
||||
|
|
Loading…
Reference in a new issue