From 24bd5574858451ba3fc09515dfd2c76dda161058 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Timoth=C3=A9e=20Alby?= Date: Mon, 10 Jan 2022 16:47:01 +0100 Subject: [PATCH] Merge pull request #6210 from overleaf/ta-file-tree-data-in-context Remove rootFolder from EditorContext GitOrigin-RevId: 827b046046265ad2418eb91d5a69eae02aa8b5a4 --- .../file-tree/components/file-tree-context.js | 13 +- .../file-tree-modal-create-file-body.js | 4 +- .../file-tree-modal-create-file-footer.js | 4 +- .../file-tree/components/file-tree-root.js | 12 +- .../contexts/file-tree-actionable.js | 4 +- .../file-tree/contexts/file-tree-draggable.js | 4 +- .../contexts/file-tree-selectable.js | 4 +- .../hooks/file-tree-socket-listener.js | 4 +- .../features/file-tree/util/count-in-tree.js | 37 +++++ .../js/shared/context/editor-context.js | 6 - .../context/file-tree-data-context.js} | 149 +++++++++--------- .../js/shared/context/project-context.js | 30 ++-- .../js/shared/context/root-context.js | 21 +-- .../file-tree-modal-create-file.test.js | 10 +- .../components/file-tree-doc.test.js | 6 +- .../components/file-tree-folder-list.test.js | 4 +- .../components/file-tree-folder.test.js | 6 +- .../file-tree-item-inner.test.js | 2 +- .../components/file-tree-root.test.js | 12 +- .../components/file-tree-toolbar.test.js | 2 +- .../file-tree/flows/context-menu.test.js | 4 +- .../file-tree/flows/create-folder.test.js | 8 +- .../file-tree/flows/delete-entity.test.js | 6 +- .../file-tree/flows/rename-entity.test.js | 2 +- .../file-tree/helpers/render-with-context.js | 2 +- .../frontend/helpers/render-with-context.js | 25 ++- 26 files changed, 202 insertions(+), 179 deletions(-) create mode 100644 services/web/frontend/js/features/file-tree/util/count-in-tree.js rename services/web/frontend/js/{features/file-tree/contexts/file-tree-mutable.js => shared/context/file-tree-data-context.js} (63%) diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-context.js b/services/web/frontend/js/features/file-tree/components/file-tree-context.js index ef108dfbe2..db1a748dc7 100644 --- a/services/web/frontend/js/features/file-tree/components/file-tree-context.js +++ b/services/web/frontend/js/features/file-tree/components/file-tree-context.js @@ -2,7 +2,6 @@ import PropTypes from 'prop-types' import { FileTreeMainProvider } from '../contexts/file-tree-main' import { FileTreeActionableProvider } from '../contexts/file-tree-actionable' -import { FileTreeMutableProvider } from '../contexts/file-tree-mutable' import { FileTreeSelectableProvider } from '../contexts/file-tree-selectable' import { FileTreeDraggableProvider } from '../contexts/file-tree-draggable' @@ -26,13 +25,11 @@ function FileTreeContext({ setStartedFreeTrial={setStartedFreeTrial} reindexReferences={reindexReferences} > - - - - {children} - - - + + + {children} + + ) } diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-modal-create-file-body.js b/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-modal-create-file-body.js index 8ab7a9716e..4b9cb235e1 100644 --- a/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-modal-create-file-body.js +++ b/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-modal-create-file-body.js @@ -6,7 +6,7 @@ import FileTreeUploadDoc from './modes/file-tree-upload-doc' import FileTreeModalCreateFileMode from './file-tree-modal-create-file-mode' import FileTreeCreateNameProvider from '../../contexts/file-tree-create-name' import { useFileTreeActionable } from '../../contexts/file-tree-actionable' -import { useFileTreeMutable } from '../../contexts/file-tree-mutable' +import { useFileTreeData } from '../../../../shared/context/file-tree-data-context' import importOverleafModules from '../../../../../macros/import-overleaf-module.macro' @@ -16,7 +16,7 @@ export default function FileTreeModalCreateFileBody() { const { t } = useTranslation() const { newFileCreateMode } = useFileTreeActionable() - const { fileCount } = useFileTreeMutable() + const { fileCount } = useFileTreeData() if (!fileCount || fileCount.status === 'error') { return null diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-modal-create-file-footer.js b/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-modal-create-file-footer.js index 0846e6535f..1ca3165a76 100644 --- a/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-modal-create-file-footer.js +++ b/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-modal-create-file-footer.js @@ -2,13 +2,13 @@ import { useTranslation } from 'react-i18next' import { Alert, Button } from 'react-bootstrap' import { useFileTreeCreateForm } from '../../contexts/file-tree-create-form' import { useFileTreeActionable } from '../../contexts/file-tree-actionable' -import { useFileTreeMutable } from '../../contexts/file-tree-mutable' +import { useFileTreeData } from '../../../../shared/context/file-tree-data-context' import PropTypes from 'prop-types' export default function FileTreeModalCreateFileFooter() { const { valid } = useFileTreeCreateForm() const { newFileCreateMode, inFlight, cancel } = useFileTreeActionable() - const { fileCount } = useFileTreeMutable() + const { fileCount } = useFileTreeData() return ( { if (isReady) onInit() @@ -62,7 +61,7 @@ const FileTreeRoot = React.memo(function FileTreeRoot({ function FileTreeRootFolder() { useFileTreeSocketListener() - const { fileTreeData } = useFileTreeMutable() + const { fileTreeData } = useFileTreeData() const { isOver, dropRef } = useDroppable(fileTreeData._id) @@ -95,7 +94,6 @@ FileTreeRoot.propTypes = { const projectContextPropTypes = { _id: PropTypes.string.isRequired, - rootFolder: PropTypes.array.isRequired, } export default withErrorBoundary(FileTreeRoot, FileTreeError) diff --git a/services/web/frontend/js/features/file-tree/contexts/file-tree-actionable.js b/services/web/frontend/js/features/file-tree/contexts/file-tree-actionable.js index 0629e44ec9..061e40de89 100644 --- a/services/web/frontend/js/features/file-tree/contexts/file-tree-actionable.js +++ b/services/web/frontend/js/features/file-tree/contexts/file-tree-actionable.js @@ -22,7 +22,7 @@ import { isBlockedFilename, isCleanFilename } from '../util/safe-path' import { useProjectContext } from '../../../shared/context/project-context' import { useEditorContext } from '../../../shared/context/editor-context' -import { useFileTreeMutable } from './file-tree-mutable' +import { useFileTreeData } from '../../../shared/context/file-tree-data-context' import { useFileTreeSelectable } from './file-tree-selectable' import { @@ -129,7 +129,7 @@ export function FileTreeActionableProvider({ children }) { defaultState ) - const { fileTreeData, dispatchRename, dispatchMove } = useFileTreeMutable() + const { fileTreeData, dispatchRename, dispatchMove } = useFileTreeData() const { selectedEntityIds } = useFileTreeSelectable() const startRenaming = useCallback(() => { diff --git a/services/web/frontend/js/features/file-tree/contexts/file-tree-draggable.js b/services/web/frontend/js/features/file-tree/contexts/file-tree-draggable.js index 1a2f1b8702..bdd762dff8 100644 --- a/services/web/frontend/js/features/file-tree/contexts/file-tree-draggable.js +++ b/services/web/frontend/js/features/file-tree/contexts/file-tree-draggable.js @@ -11,7 +11,7 @@ import { } from '../util/find-in-tree' import { useFileTreeActionable } from './file-tree-actionable' -import { useFileTreeMutable } from './file-tree-mutable' +import { useFileTreeData } from '../../../shared/context/file-tree-data-context' import { useFileTreeSelectable } from '../contexts/file-tree-selectable' import { useEditorContext } from '../../../shared/context/editor-context' @@ -77,7 +77,7 @@ export function useDraggable(draggedEntityId) { const { t } = useTranslation() const { permissionsLevel } = useEditorContext(editorContextPropTypes) - const { fileTreeData } = useFileTreeMutable() + const { fileTreeData } = useFileTreeData() const { selectedEntityIds } = useFileTreeSelectable() const [isDraggable, setIsDraggable] = useState(true) diff --git a/services/web/frontend/js/features/file-tree/contexts/file-tree-selectable.js b/services/web/frontend/js/features/file-tree/contexts/file-tree-selectable.js index e34479609b..cfe2459c50 100644 --- a/services/web/frontend/js/features/file-tree/contexts/file-tree-selectable.js +++ b/services/web/frontend/js/features/file-tree/contexts/file-tree-selectable.js @@ -12,7 +12,7 @@ import classNames from 'classnames' import _ from 'lodash' import { findInTree } from '../util/find-in-tree' -import { useFileTreeMutable } from './file-tree-mutable' +import { useFileTreeData } from '../../../shared/context/file-tree-data-context' import { useProjectContext } from '../../../shared/context/project-context' import { useEditorContext } from '../../../shared/context/editor-context' import usePersistedState from '../../../shared/hooks/use-persisted-state' @@ -85,7 +85,7 @@ export function FileTreeSelectableProvider({ onSelect, children }) { rootDocId ) - const { fileTreeData } = useFileTreeMutable() + const { fileTreeData } = useFileTreeData() const [selectedEntityIds, dispatch] = useReducer( permissionsLevel === 'readOnly' diff --git a/services/web/frontend/js/features/file-tree/hooks/file-tree-socket-listener.js b/services/web/frontend/js/features/file-tree/hooks/file-tree-socket-listener.js index 3a1e8731b8..0c85efc873 100644 --- a/services/web/frontend/js/features/file-tree/hooks/file-tree-socket-listener.js +++ b/services/web/frontend/js/features/file-tree/hooks/file-tree-socket-listener.js @@ -2,7 +2,7 @@ import { useCallback, useEffect } from 'react' import PropTypes from 'prop-types' import { useUserContext } from '../../../shared/context/user-context' -import { useFileTreeMutable } from '../contexts/file-tree-mutable' +import { useFileTreeData } from '../../../shared/context/file-tree-data-context' import { useFileTreeSelectable } from '../contexts/file-tree-selectable' import { findInTreeOrThrow } from '../util/find-in-tree' @@ -18,7 +18,7 @@ export function useFileTreeSocketListener() { dispatchCreateDoc, dispatchCreateFile, fileTreeData, - } = useFileTreeMutable() + } = useFileTreeData() const { selectedEntityIds, selectedEntityParentIds, select, unselect } = useFileTreeSelectable() const socket = window._ide && window._ide.socket diff --git a/services/web/frontend/js/features/file-tree/util/count-in-tree.js b/services/web/frontend/js/features/file-tree/util/count-in-tree.js new file mode 100644 index 0000000000..90ddd2fb74 --- /dev/null +++ b/services/web/frontend/js/features/file-tree/util/count-in-tree.js @@ -0,0 +1,37 @@ +export function countFiles(fileTreeData) { + if (!fileTreeData) { + return 0 + } + + const files = filesInFolder(fileTreeData) + + // count all the non-deleted entities + const value = files.filter(item => !item.deleted).length + + const limit = window.ExposedSettings.maxEntitiesPerProject + const status = fileCountStatus(value, limit, Math.ceil(limit / 20)) + + return { value, status, limit } +} + +function filesInFolder({ docs, folders, fileRefs }) { + const files = [...docs, ...fileRefs] + + for (const folder of folders) { + files.push(...filesInFolder(folder)) + } + + return files +} + +function fileCountStatus(value, limit, range) { + if (value >= limit) { + return 'error' + } + + if (value >= limit - range) { + return 'warning' + } + + return 'success' +} diff --git a/services/web/frontend/js/shared/context/editor-context.js b/services/web/frontend/js/shared/context/editor-context.js index ed582f2bfd..1508efa169 100644 --- a/services/web/frontend/js/shared/context/editor-context.js +++ b/services/web/frontend/js/shared/context/editor-context.js @@ -34,9 +34,6 @@ EditorContext.Provider.propTypes = { insertSymbol: PropTypes.func, isProjectOwner: PropTypes.bool, isRestrictedTokenMember: PropTypes.bool, - rootFolder: PropTypes.shape({ - children: PropTypes.arrayOf(PropTypes.shape({ type: PropTypes.string })), - }), permissionsLevel: PropTypes.oneOf(['readOnly', 'readAndWrite', 'owner']), }), } @@ -73,7 +70,6 @@ export function EditorProvider({ children, settings }) { const [loading] = useScopeValue('state.loading') const [projectName, setProjectName] = useScopeValue('project.name') - const [rootFolder] = useScopeValue('rootFolder', true) const [permissionsLevel] = useScopeValue('permissionsLevel') const [showSymbolPalette] = useScopeValue('editor.showSymbolPalette') const [toggleSymbolPalette] = useScopeValue('editor.toggleSymbolPalette') @@ -135,7 +131,6 @@ export function EditorProvider({ children, settings }) { permissionsLevel, isProjectOwner: owner?._id === window.user.id, isRestrictedTokenMember: window.isRestrictedTokenMember, - rootFolder, showSymbolPalette, toggleSymbolPalette, insertSymbol, @@ -147,7 +142,6 @@ export function EditorProvider({ children, settings }) { renameProject, permissionsLevel, owner?._id, - rootFolder, showSymbolPalette, toggleSymbolPalette, insertSymbol, diff --git a/services/web/frontend/js/features/file-tree/contexts/file-tree-mutable.js b/services/web/frontend/js/shared/context/file-tree-data-context.js similarity index 63% rename from services/web/frontend/js/features/file-tree/contexts/file-tree-mutable.js rename to services/web/frontend/js/shared/context/file-tree-data-context.js index f9b84f2380..27b9dfc9a5 100644 --- a/services/web/frontend/js/features/file-tree/contexts/file-tree-mutable.js +++ b/services/web/frontend/js/shared/context/file-tree-data-context.js @@ -4,18 +4,36 @@ import { useReducer, useContext, useEffect, + useMemo, } from 'react' import PropTypes from 'prop-types' - +import useScopeValue from '../hooks/use-scope-value' import { renameInTree, deleteInTree, moveInTree, createEntityInTree, -} from '../util/mutate-in-tree' -import { useProjectContext } from '../../../shared/context/project-context' +} from '../../features/file-tree/util/mutate-in-tree' +import { countFiles } from '../../features/file-tree/util/count-in-tree' -const FileTreeMutableContext = createContext() +const FileTreeDataContext = createContext() + +const fileTreeDataPropType = PropTypes.shape({ + _id: PropTypes.string.isRequired, + name: PropTypes.string.isRequired, + docs: PropTypes.array.isRequired, + fileRefs: PropTypes.array.isRequired, + folders: PropTypes.array.isRequired, +}) + +FileTreeDataContext.Provider.propTypes = { + value: PropTypes.shape({ + // fileTreeData is the up-to-date representation of the files list, updated + // by the file tree + fileTreeData: fileTreeDataPropType, + hasFolders: PropTypes.bool, + }), +} const ACTION_TYPES = { RENAME: 'RENAME', @@ -88,13 +106,37 @@ function fileTreeMutableReducer({ fileTreeData }, action) { } } -const initialState = rootFolder => ({ - fileTreeData: rootFolder[0], - fileCount: countFiles(rootFolder[0]), -}) +const initialState = rootFolder => { + const fileTreeData = rootFolder?.[0] + return { + fileTreeData, + fileCount: countFiles(fileTreeData), + } +} -export const FileTreeMutableProvider = function ({ children }) { - const { rootFolder } = useProjectContext(projectContextPropTypes) +export function useFileTreeData(propTypes) { + const context = useContext(FileTreeDataContext) + + if (!context) { + throw new Error( + 'useFileTreeData is only available inside FileTreeDataProvider' + ) + } + + PropTypes.checkPropTypes( + propTypes, + context, + 'data', + 'FileTreeDataContext.Provider' + ) + + return context +} + +export function FileTreeDataProvider({ children }) { + const [project] = useScopeValue('project', true) + + const { rootFolder } = project || {} const [{ fileTreeData, fileCount }, dispatch] = useReducer( fileTreeMutableReducer, @@ -105,7 +147,7 @@ export const FileTreeMutableProvider = function ({ children }) { useEffect(() => { dispatch({ type: ACTION_TYPES.RESET, - fileTreeData: rootFolder[0], + fileTreeData: rootFolder?.[0], }) }, [rootFolder]) @@ -152,7 +194,19 @@ export const FileTreeMutableProvider = function ({ children }) { dispatch({ type: ACTION_TYPES.MOVE, entityId, toFolderId }) }, []) - const value = { + const value = useMemo(() => { + return { + dispatchCreateDoc, + dispatchCreateFile, + dispatchCreateFolder, + dispatchDelete, + dispatchMove, + dispatchRename, + fileCount, + fileTreeData, + hasFolders: fileTreeData?.folders.length > 0, + } + }, [ dispatchCreateDoc, dispatchCreateFile, dispatchCreateFolder, @@ -161,76 +215,15 @@ export const FileTreeMutableProvider = function ({ children }) { dispatchRename, fileCount, fileTreeData, - } + ]) return ( - + {children} - + ) } -FileTreeMutableProvider.propTypes = { - children: PropTypes.oneOfType([ - PropTypes.arrayOf(PropTypes.node), - PropTypes.node, - ]).isRequired, -} - -const projectContextPropTypes = { - rootFolder: PropTypes.arrayOf( - PropTypes.shape({ - _id: PropTypes.string.isRequired, - name: PropTypes.string.isRequired, - docs: PropTypes.array.isRequired, - fileRefs: PropTypes.array.isRequired, - folders: PropTypes.array.isRequired, - }) - ), -} - -export function useFileTreeMutable() { - const context = useContext(FileTreeMutableContext) - - if (!context) { - throw new Error( - 'useFileTreeMutable is only available in FileTreeMutableProvider' - ) - } - - return context -} - -function filesInFolder({ docs, folders, fileRefs }) { - const files = [...docs, ...fileRefs] - - for (const folder of folders) { - files.push(...filesInFolder(folder)) - } - - return files -} - -function countFiles(fileTreeData) { - const files = filesInFolder(fileTreeData) - - // count all the non-deleted entities - const value = files.filter(item => !item.deleted).length - - const limit = window.ExposedSettings.maxEntitiesPerProject - const status = fileCountStatus(value, limit, Math.ceil(limit / 20)) - - return { value, status, limit } -} - -function fileCountStatus(value, limit, range) { - if (value >= limit) { - return 'error' - } - - if (value >= limit - range) { - return 'warning' - } - - return 'success' +FileTreeDataProvider.propTypes = { + children: PropTypes.any, } diff --git a/services/web/frontend/js/shared/context/project-context.js b/services/web/frontend/js/shared/context/project-context.js index c3c127dec5..43433abb20 100644 --- a/services/web/frontend/js/shared/context/project-context.js +++ b/services/web/frontend/js/shared/context/project-context.js @@ -1,17 +1,9 @@ -import { createContext, useContext } from 'react' +import { createContext, useContext, useMemo } from 'react' import PropTypes from 'prop-types' import useScopeValue from '../hooks/use-scope-value' const ProjectContext = createContext() -const fileTreeDataPropType = PropTypes.shape({ - _id: PropTypes.string.isRequired, - name: PropTypes.string.isRequired, - docs: PropTypes.array.isRequired, - fileRefs: PropTypes.array.isRequired, - folders: PropTypes.array.isRequired, -}) - ProjectContext.Provider.propTypes = { value: PropTypes.shape({ _id: PropTypes.string.isRequired, @@ -44,7 +36,6 @@ ProjectContext.Provider.propTypes = { _id: PropTypes.string.isRequired, email: PropTypes.string.isRequired, }), - rootFolder: PropTypes.arrayOf(fileTreeDataPropType), }), } @@ -67,13 +58,24 @@ export function useProjectContext(propTypes) { return context } +// when the provider is created the project is still not added to the Angular +// scope. A few props are populated to prevent errors in existing React +// components +const projectFallback = { + _id: window.project_id, + name: '', + features: {}, +} + export function ProjectProvider({ children }) { const [project] = useScopeValue('project', true) - // when the provider is created the project is still not added to the Angular scope. - // Name is also populated to prevent errors in existing React components - const value = project || { _id: window.project_id, name: '', features: {} } - + const value = useMemo(() => { + return { + ...projectFallback, + ...project, + } + }, [project]) return ( {children} ) diff --git a/services/web/frontend/js/shared/context/root-context.js b/services/web/frontend/js/shared/context/root-context.js index d47f78fb37..71d285ea41 100644 --- a/services/web/frontend/js/shared/context/root-context.js +++ b/services/web/frontend/js/shared/context/root-context.js @@ -10,6 +10,7 @@ import { DetachProvider } from './detach-context' import { ChatProvider } from '../../features/chat/context/chat-context' import { ProjectProvider } from './project-context' import { SplitTestProvider } from './split-test-context' +import { FileTreeDataProvider } from './file-tree-data-context' export function ContextRoot({ children, ide, settings }) { return ( @@ -17,15 +18,17 @@ export function ContextRoot({ children, ide, settings }) { - - - - - {children} - - - - + + + + + + {children} + + + + + diff --git a/services/web/test/frontend/features/file-tree/components/file-tree-create/file-tree-modal-create-file.test.js b/services/web/test/frontend/features/file-tree/components/file-tree-create/file-tree-modal-create-file.test.js index ce2c8dbf8a..32dfc8d782 100644 --- a/services/web/test/frontend/features/file-tree/components/file-tree-create/file-tree-modal-create-file.test.js +++ b/services/web/test/frontend/features/file-tree/components/file-tree-create/file-tree-modal-create-file.test.js @@ -8,7 +8,7 @@ import PropTypes from 'prop-types' import renderWithContext from '../../helpers/render-with-context' import FileTreeModalCreateFile from '../../../../../../frontend/js/features/file-tree/components/modals/file-tree-modal-create-file' import { useFileTreeActionable } from '../../../../../../frontend/js/features/file-tree/contexts/file-tree-actionable' -import { useFileTreeMutable } from '../../../../../../frontend/js/features/file-tree/contexts/file-tree-mutable' +import { useFileTreeData } from '../../../../../../frontend/js/shared/context/file-tree-data-context' describe('', function () { beforeEach(function () { @@ -65,7 +65,7 @@ describe('', function () { ] renderWithContext(, { - contextProps: { projectRootFolder: rootFolder }, + contextProps: { rootFolder }, }) screen.getByRole( @@ -89,7 +89,7 @@ describe('', function () { ] renderWithContext(, { - contextProps: { projectRootFolder: rootFolder }, + contextProps: { rootFolder }, }) screen.getByText(/This project is approaching the file limit \(\d+\/\d+\)/) @@ -127,7 +127,7 @@ describe('', function () { ] renderWithContext(, { - contextProps: { projectRootFolder: rootFolder }, + contextProps: { rootFolder }, }) screen.getByText(/This project is approaching the file limit \(\d+\/\d+\)/) @@ -458,7 +458,7 @@ describe('', function () { function OpenWithMode({ mode }) { const { newFileCreateMode, startCreatingFile } = useFileTreeActionable() - const { fileCount } = useFileTreeMutable() + const { fileCount } = useFileTreeData() // eslint-disable-next-line react-hooks/exhaustive-deps useEffect(() => startCreatingFile(mode), []) diff --git a/services/web/test/frontend/features/file-tree/components/file-tree-doc.test.js b/services/web/test/frontend/features/file-tree/components/file-tree-doc.test.js index abc8ed54f3..068235404c 100644 --- a/services/web/test/frontend/features/file-tree/components/file-tree-doc.test.js +++ b/services/web/test/frontend/features/file-tree/components/file-tree-doc.test.js @@ -19,7 +19,7 @@ describe('', function () { , { contextProps: { - projectRootFolder: [ + rootFolder: [ { _id: 'root-folder-id', name: 'rootFolder', @@ -50,7 +50,7 @@ describe('', function () { it('selects', function () { renderWithContext(, { contextProps: { - projectRootFolder: [ + rootFolder: [ { _id: 'root-folder-id', name: 'rootFolder', @@ -71,7 +71,7 @@ describe('', function () { it('multi-selects', function () { renderWithContext(, { contextProps: { - projectRootFolder: [ + rootFolder: [ { _id: 'root-folder-id', name: 'rootFolder', diff --git a/services/web/test/frontend/features/file-tree/components/file-tree-folder-list.test.js b/services/web/test/frontend/features/file-tree/components/file-tree-folder-list.test.js index 8636294ba5..3c14c7bc89 100644 --- a/services/web/test/frontend/features/file-tree/components/file-tree-folder-list.test.js +++ b/services/web/test/frontend/features/file-tree/components/file-tree-folder-list.test.js @@ -43,7 +43,7 @@ describe('', function () { { contextProps: { permissionsLevel: 'readOnly', - projectRootFolder: [ + rootFolder: [ { _id: 'root-folder-id', name: 'rootFolder', @@ -80,7 +80,7 @@ describe('', function () { , { contextProps: { - projectRootFolder: [ + rootFolder: [ { _id: 'root-folder-id', name: 'rootFolder', diff --git a/services/web/test/frontend/features/file-tree/components/file-tree-folder.test.js b/services/web/test/frontend/features/file-tree/components/file-tree-folder.test.js index b643068f39..a16acc9604 100644 --- a/services/web/test/frontend/features/file-tree/components/file-tree-folder.test.js +++ b/services/web/test/frontend/features/file-tree/components/file-tree-folder.test.js @@ -35,7 +35,7 @@ describe('', function () { />, { contextProps: { - projectRootFolder: [ + rootFolder: [ { _id: 'root-folder-id', name: 'rootFolder', @@ -66,7 +66,7 @@ describe('', function () { />, { contextProps: { - projectRootFolder: [ + rootFolder: [ { _id: 'root-folder-id', name: 'rootFolder', @@ -97,7 +97,7 @@ describe('', function () { />, { contextProps: { - projectRootFolder: [ + rootFolder: [ { _id: 'root-folder-id', name: 'rootFolder', diff --git a/services/web/test/frontend/features/file-tree/components/file-tree-item/file-tree-item-inner.test.js b/services/web/test/frontend/features/file-tree/components/file-tree-item/file-tree-item-inner.test.js index 5d2be5d92b..f3828e42a1 100644 --- a/services/web/test/frontend/features/file-tree/components/file-tree-item/file-tree-item-inner.test.js +++ b/services/web/test/frontend/features/file-tree/components/file-tree-item/file-tree-item-inner.test.js @@ -86,7 +86,7 @@ describe('', function () { { contextProps: { rootDocId: '123abc', - projectRootFolder: [ + rootFolder: [ { _id: 'root-folder-id', name: 'rootFolder', diff --git a/services/web/test/frontend/features/file-tree/components/file-tree-root.test.js b/services/web/test/frontend/features/file-tree/components/file-tree-root.test.js index b250660765..d8247d1123 100644 --- a/services/web/test/frontend/features/file-tree/components/file-tree-root.test.js +++ b/services/web/test/frontend/features/file-tree/components/file-tree-root.test.js @@ -47,7 +47,7 @@ describe('', function () { isConnected />, { - projectRootFolder: rootFolder, + rootFolder, projectId: '123abc', rootDocId: '456def', features: {}, @@ -86,7 +86,7 @@ describe('', function () { isConnected />, { - projectRootFolder: rootFolder, + rootFolder, projectId: '123abc', rootDocId: '456def', features: {}, @@ -128,7 +128,7 @@ describe('', function () { setStartedFreeTrial={() => null} />, { - projectRootFolder: rootFolder, + rootFolder, projectId: '123abc', rootDocId: '456def', features: {}, @@ -163,7 +163,7 @@ describe('', function () { isConnected />, { - projectRootFolder: rootFolder, + rootFolder, projectId: '123abc', rootDocId: '456def', features: {}, @@ -219,7 +219,7 @@ describe('', function () { isConnected />, { - projectRootFolder: rootFolder, + rootFolder, projectId: '123abc', rootDocId: '456def', features: {}, @@ -266,7 +266,7 @@ describe('', function () { isConnected />, { - projectRootFolder: rootFolder, + rootFolder, projectId: '123abc', rootDocId: '456def', features: {}, diff --git a/services/web/test/frontend/features/file-tree/components/file-tree-toolbar.test.js b/services/web/test/frontend/features/file-tree/components/file-tree-toolbar.test.js index b62a5328fc..8812c8a3c7 100644 --- a/services/web/test/frontend/features/file-tree/components/file-tree-toolbar.test.js +++ b/services/web/test/frontend/features/file-tree/components/file-tree-toolbar.test.js @@ -31,7 +31,7 @@ describe('', function () { renderWithContext(, { contextProps: { rootDocId: '456def', - projectRootFolder: [ + rootFolder: [ { _id: 'root-folder-id', name: 'rootFolder', diff --git a/services/web/test/frontend/features/file-tree/flows/context-menu.test.js b/services/web/test/frontend/features/file-tree/flows/context-menu.test.js index bbdc492c3f..005b782d50 100644 --- a/services/web/test/frontend/features/file-tree/flows/context-menu.test.js +++ b/services/web/test/frontend/features/file-tree/flows/context-menu.test.js @@ -39,7 +39,7 @@ describe('FileTree Context Menu Flow', function () { isConnected />, { - projectRootFolder: rootFolder, + rootFolder, projectId: '123abc', rootDocId: '456def', } @@ -74,7 +74,7 @@ describe('FileTree Context Menu Flow', function () { isConnected />, { - projectRootFolder: rootFolder, + rootFolder, projectId: '123abc', rootDocId: '456def', permissionsLevel: 'readOnly', diff --git a/services/web/test/frontend/features/file-tree/flows/create-folder.test.js b/services/web/test/frontend/features/file-tree/flows/create-folder.test.js index 2322e2c6b9..27a2e417ca 100644 --- a/services/web/test/frontend/features/file-tree/flows/create-folder.test.js +++ b/services/web/test/frontend/features/file-tree/flows/create-folder.test.js @@ -48,7 +48,7 @@ describe('FileTree Create Folder Flow', function () { />, { socket: new MockedSocket(), - projectRootFolder: rootFolder, + rootFolder, projectId: '123abc', } ) @@ -110,7 +110,7 @@ describe('FileTree Create Folder Flow', function () { />, { socket: new MockedSocket(), - projectRootFolder: rootFolder, + rootFolder, projectId: '123abc', rootDocId: '789ghi', } @@ -182,7 +182,7 @@ describe('FileTree Create Folder Flow', function () { />, { socket: new MockedSocket(), - projectRootFolder: rootFolder, + rootFolder, projectId: '123abc', rootDocId: '456def', } @@ -243,7 +243,7 @@ describe('FileTree Create Folder Flow', function () { />, { socket: new MockedSocket(), - projectRootFolder: rootFolder, + rootFolder, projectId: '123abc', rootDocId: '456def', } diff --git a/services/web/test/frontend/features/file-tree/flows/delete-entity.test.js b/services/web/test/frontend/features/file-tree/flows/delete-entity.test.js index c847e57475..561b6a6fe0 100644 --- a/services/web/test/frontend/features/file-tree/flows/delete-entity.test.js +++ b/services/web/test/frontend/features/file-tree/flows/delete-entity.test.js @@ -44,7 +44,7 @@ describe('FileTree Delete Entity Flow', function () { />, { socket: new MockedSocket(), - projectRootFolder: rootFolder, + rootFolder, projectId: '123abc', } ) @@ -164,7 +164,7 @@ describe('FileTree Delete Entity Flow', function () { />, { socket: new MockedSocket(), - projectRootFolder: rootFolder, + rootFolder, projectId: '123abc', } ) @@ -223,7 +223,7 @@ describe('FileTree Delete Entity Flow', function () { />, { socket: new MockedSocket(), - projectRootFolder: rootFolder, + rootFolder, projectId: '123abc', } ) diff --git a/services/web/test/frontend/features/file-tree/flows/rename-entity.test.js b/services/web/test/frontend/features/file-tree/flows/rename-entity.test.js index 3132eb6f0f..6d3cc9225a 100644 --- a/services/web/test/frontend/features/file-tree/flows/rename-entity.test.js +++ b/services/web/test/frontend/features/file-tree/flows/rename-entity.test.js @@ -59,7 +59,7 @@ describe('FileTree Rename Entity Flow', function () { />, { socket: new MockedSocket(), - projectRootFolder: rootFolder, + rootFolder, projectId: '123abc', } ) diff --git a/services/web/test/frontend/features/file-tree/helpers/render-with-context.js b/services/web/test/frontend/features/file-tree/helpers/render-with-context.js index c153d654ff..4f2a6049c6 100644 --- a/services/web/test/frontend/features/file-tree/helpers/render-with-context.js +++ b/services/web/test/frontend/features/file-tree/helpers/render-with-context.js @@ -5,7 +5,7 @@ export default (children, options = {}) => { let { contextProps = {}, ...renderOptions } = options contextProps = { projectId: '123abc', - projectRootFolder: [ + rootFolder: [ { _id: 'root-folder-id', name: 'rootFolder', diff --git a/services/web/test/frontend/helpers/render-with-context.js b/services/web/test/frontend/helpers/render-with-context.js index 48a0059d44..2b49416b43 100644 --- a/services/web/test/frontend/helpers/render-with-context.js +++ b/services/web/test/frontend/helpers/render-with-context.js @@ -14,6 +14,7 @@ import { get } from 'lodash' import { ProjectProvider } from '../../../frontend/js/shared/context/project-context' import { SplitTestProvider } from '../../../frontend/js/shared/context/split-test-context' import { CompileProvider } from '../../../frontend/js/shared/context/compile-context' +import { FileTreeDataProvider } from '../../../frontend/js/shared/context/file-tree-data-context' // these constants can be imported in tests instead of // using magic strings @@ -36,8 +37,7 @@ export function EditorProviders({ }, permissionsLevel = 'owner', children, - rootFolder, - projectRootFolder = [ + rootFolder = [ { _id: 'root-folder-id', name: 'rootFolder', @@ -75,10 +75,7 @@ export function EditorProviders({ }, features, rootDoc_id: rootDocId, - rootFolder: projectRootFolder, - }, - rootFolder: rootFolder || { - children: [], + rootFolder, }, ui, $watch: (path, callback) => { @@ -113,13 +110,15 @@ export function EditorProviders({ - - - - {children} - - - + + + + + {children} + + + +