diff --git a/packages/client-core/i18n/en/editor.json b/packages/client-core/i18n/en/editor.json
index cbd6e57567..0798255141 100755
--- a/packages/client-core/i18n/en/editor.json
+++ b/packages/client-core/i18n/en/editor.json
@@ -1196,7 +1196,7 @@
"placeObjectAtOrigin": "Place Object at Origin"
},
"filebrowser": {
- "tab-name": "Project Files",
+ "tab-name": "Files",
"addNewFolder": "Add New Folder",
"cutAsset": "Cut",
"copyAsset": "Copy",
diff --git a/packages/editor/src/components/EditorContainer.tsx b/packages/editor/src/components/EditorContainer.tsx
index e62b06f908..aa1f700692 100644
--- a/packages/editor/src/components/EditorContainer.tsx
+++ b/packages/editor/src/components/EditorContainer.tsx
@@ -27,7 +27,6 @@ import { PopoverState } from '@etherealengine/client-core/src/common/services/Po
import { staticResourcePath } from '@etherealengine/common/src/schema.type.module'
import { NO_PROXY, getMutableState, useHookstate, useMutableState } from '@etherealengine/hyperflux'
import { AssetsPanelTab } from '@etherealengine/ui/src/components/editor/panels/Assets'
-import { FilesPanelTab } from '@etherealengine/ui/src/components/editor/panels/Files'
import { HierarchyPanelTab } from '@etherealengine/ui/src/components/editor/panels/Hierarchy'
import { MaterialsPanelTab } from '@etherealengine/ui/src/components/editor/panels/Materials'
import { PropertiesPanelTab } from '@etherealengine/ui/src/components/editor/panels/Properties'
@@ -60,6 +59,7 @@ import 'rc-dock/dist/rc-dock.css'
import { useTranslation } from 'react-i18next'
import { IoHelpCircleOutline } from 'react-icons/io5'
import { setCurrentEditorScene } from '../functions/sceneFunctions'
+import { FilesPanelTab } from '../panels/files'
import './EditorContainer.css'
export const DockContainer = ({ children, id = 'editor-dock', dividerAlpha = 0 }) => {
diff --git a/packages/editor/src/components/assets/FileBrowser/FileBrowserState.tsx b/packages/editor/src/components/assets/FileBrowser/FileBrowserState.tsx
deleted file mode 100644
index c4e08e8e16..0000000000
--- a/packages/editor/src/components/assets/FileBrowser/FileBrowserState.tsx
+++ /dev/null
@@ -1,55 +0,0 @@
-/*
-CPAL-1.0 License
-
-The contents of this file are subject to the Common Public Attribution License
-Version 1.0. (the "License"); you may not use this file except in compliance
-with the License. You may obtain a copy of the License at
-https://github.com/EtherealEngine/etherealengine/blob/dev/LICENSE.
-The License is based on the Mozilla Public License Version 1.1, but Sections 14
-and 15 have been added to cover use of software over a computer network and
-provide for limited attribution for the Original Developer. In addition,
-Exhibit A has been modified to be consistent with Exhibit B.
-
-Software distributed under the License is distributed on an "AS IS" basis,
-WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License for the
-specific language governing rights and limitations under the License.
-
-The Original Code is Ethereal Engine.
-
-The Original Developer is the Initial Developer. The Initial Developer of the
-Original Code is the Ethereal Engine team.
-
-All portions of the code written by the Ethereal Engine team are Copyright © 2021-2023
-Ethereal Engine. All Rights Reserved.
-*/
-
-import { defineState, syncStateWithLocalStorage } from '@etherealengine/hyperflux'
-
-export const FilesViewModeState = defineState({
- name: 'FilesViewModeState',
- initial: {
- viewMode: 'icons' as 'icons' | 'list'
- },
- extension: syncStateWithLocalStorage(['viewMode'])
-})
-
-export const availableTableColumns = ['name', 'type', 'dateModified', 'size'] as const
-
-export const FilesViewModeSettings = defineState({
- name: 'FilesViewModeSettings',
- initial: {
- icons: {
- iconSize: 90
- },
- list: {
- fontSize: 15,
- selectedTableColumns: {
- name: true,
- type: true,
- dateModified: true,
- size: true
- }
- }
- },
- extension: syncStateWithLocalStorage(['icons', 'list'])
-})
diff --git a/packages/ui/src/components/editor/panels/Files/download/projectDownload.tsx b/packages/editor/src/panels/files/download.tsx
similarity index 94%
rename from packages/ui/src/components/editor/panels/Files/download/projectDownload.tsx
rename to packages/editor/src/panels/files/download.tsx
index bb6b4406dc..f09874c268 100644
--- a/packages/ui/src/components/editor/panels/Files/download/projectDownload.tsx
+++ b/packages/editor/src/panels/files/download.tsx
@@ -30,9 +30,9 @@ import { bytesToSize } from '@etherealengine/common/src/utils/btyesToSize'
import { Engine } from '@etherealengine/ecs'
import { downloadBlobAsZip } from '@etherealengine/editor/src/functions/assetFunctions'
import { defineState, getMutableState, useMutableState } from '@etherealengine/hyperflux'
+import Progress from '@etherealengine/ui/src/primitives/tailwind/Progress'
import React from 'react'
import { useTranslation } from 'react-i18next'
-import Progress from '../../../../../primitives/tailwind/Progress'
const DownloadProjectState = defineState({
name: 'DownloadProjectState',
@@ -55,11 +55,11 @@ export const handleDownloadProject = async (projectName: string, selectedDirecto
const downloadState = getMutableState(DownloadProjectState)
- downloadState.isDownloading.set(true) // Start Download
+ downloadState.isDownloading.set(true)
const response = await fetch(`${config.client.fileServer}/${data}`)
const totalBytes = parseInt(response.headers.get('Content-Length') || '0', 10)
- downloadState.total.set(totalBytes) // Set the total bytes
+ downloadState.total.set(totalBytes)
const reader = response.body?.getReader()
const chunks: Uint8Array[] = []
@@ -74,7 +74,7 @@ export const handleDownloadProject = async (projectName: string, selectedDirecto
}
const blob = new Blob(chunks)
- downloadState.isDownloading.set(false) // Mark as completed
+ downloadState.isDownloading.set(false)
downloadState.progress.set(0)
downloadState.total.set(0)
diff --git a/packages/editor/src/panels/files/filebrowser.tsx b/packages/editor/src/panels/files/filebrowser.tsx
new file mode 100644
index 0000000000..b0b6d91283
--- /dev/null
+++ b/packages/editor/src/panels/files/filebrowser.tsx
@@ -0,0 +1,79 @@
+/*
+CPAL-1.0 License
+
+The contents of this file are subject to the Common Public Attribution License
+Version 1.0. (the "License"); you may not use this file except in compliance
+with the License. You may obtain a copy of the License at
+https://github.com/EtherealEngine/etherealengine/blob/dev/LICENSE.
+The License is based on the Mozilla Public License Version 1.1, but Sections 14
+and 15 have been added to cover use of software over a computer network and
+provide for limited attribution for the Original Developer. In addition,
+Exhibit A has been modified to be consistent with Exhibit B.
+
+Software distributed under the License is distributed on an "AS IS" basis,
+WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License for the
+specific language governing rights and limitations under the License.
+
+The Original Code is Ethereal Engine.
+
+The Original Developer is the Initial Developer. The Initial Developer of the
+Original Code is the Ethereal Engine team.
+
+All portions of the code written by the Ethereal Engine team are Copyright © 2021-2023
+Ethereal Engine. All Rights Reserved.
+*/
+
+import { projectPath } from '@etherealengine/common/src/schema.type.module'
+import { Engine } from '@etherealengine/ecs'
+import { useMutableState } from '@etherealengine/hyperflux'
+import React, { useEffect } from 'react'
+import { useTranslation } from 'react-i18next'
+import { EditorState } from '../../services/EditorServices'
+import { FilesQueryProvider, FilesState } from '../../services/FilesState'
+import FilesToolbar from './toolbar'
+
+const getValidProjectForFileBrowser = async (path: string) => {
+ const [orgName, projectName] = path.split('/').slice(2, 4)
+ const projects = await Engine.instance.api.service(projectPath).find({
+ query: {
+ $or: [
+ {
+ name: `${orgName}/${projectName}`
+ },
+ {
+ name: orgName
+ }
+ ],
+ action: 'studio',
+ allowed: true
+ }
+ })
+ return (
+ projects.data.find((project) => project.name === orgName || project.name === `${orgName}/${projectName}`)?.name ??
+ ''
+ )
+}
+
+export default function FileBrowser() {
+ const { t } = useTranslation()
+ const filesState = useMutableState(FilesState)
+
+ const originalPath = useMutableState(EditorState).projectName.value
+ useEffect(() => {
+ if (originalPath) filesState.selectedDirectory.set(originalPath)
+ }, [originalPath])
+
+ useEffect(() => {
+ ;(async () => {
+ const projectName = await getValidProjectForFileBrowser(filesState.selectedDirectory.value)
+ const orgName = projectName.includes('/') ? projectName.split('/')[0] : ''
+ filesState.merge({ projectName, orgName })
+ })()
+ }, [filesState.selectedDirectory])
+
+ return (
+
+
+
+ )
+}
diff --git a/packages/ui/src/components/editor/panels/Files/index.tsx b/packages/editor/src/panels/files/index.tsx
similarity index 78%
rename from packages/ui/src/components/editor/panels/Files/index.tsx
rename to packages/editor/src/panels/files/index.tsx
index fefd67a1f2..1a0f6b7b65 100644
--- a/packages/ui/src/components/editor/panels/Files/index.tsx
+++ b/packages/editor/src/panels/files/index.tsx
@@ -23,32 +23,24 @@ All portions of the code written by the Ethereal Engine team are Copyright © 20
Ethereal Engine. All Rights Reserved.
*/
+import { PanelDragContainer, PanelTitle } from '@etherealengine/ui/src/components/editor/layout/Panel'
import { TabData } from 'rc-dock'
import React from 'react'
import { useTranslation } from 'react-i18next'
+import FileBrowser from './filebrowser'
-import { PanelDragContainer, PanelTitle } from '../../layout/Panel'
-import FilesPanelContainer from './container'
-
-export const FilesPanelTitle = () => {
+const FilesPanelTitle = () => {
const { t } = useTranslation()
-
return (
-
+
+ {t('editor:layout.filebrowser.tab-name')}
+
)
}
-export default FilesPanelTitle
-
export const FilesPanelTab: TabData = {
id: 'filesPanel',
closable: true,
title: ,
- content:
+ content:
}
diff --git a/packages/editor/src/panels/files/toolbar.tsx b/packages/editor/src/panels/files/toolbar.tsx
new file mode 100644
index 0000000000..8abcefbe17
--- /dev/null
+++ b/packages/editor/src/panels/files/toolbar.tsx
@@ -0,0 +1,304 @@
+/*
+CPAL-1.0 License
+
+The contents of this file are subject to the Common Public Attribution License
+Version 1.0. (the "License"); you may not use this file except in compliance
+with the License. You may obtain a copy of the License at
+https://github.com/EtherealEngine/etherealengine/blob/dev/LICENSE.
+The License is based on the Mozilla Public License Version 1.1, but Sections 14
+and 15 have been added to cover use of software over a computer network and
+provide for limited attribution for the Original Developer. In addition,
+Exhibit A has been modified to be consistent with Exhibit B.
+
+Software distributed under the License is distributed on an "AS IS" basis,
+WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License for the
+specific language governing rights and limitations under the License.
+
+The Original Code is Ethereal Engine.
+
+The Original Developer is the Initial Developer. The Initial Developer of the
+Original Code is the Ethereal Engine team.
+
+All portions of the code written by the Ethereal Engine team are Copyright © 2021-2023
+Ethereal Engine. All Rights Reserved.
+*/
+
+import { NotificationService } from '@etherealengine/client-core/src/common/services/NotificationService'
+import { NO_PROXY, useMutableState } from '@etherealengine/hyperflux'
+import BooleanInput from '@etherealengine/ui/src/components/editor/input/Boolean'
+import InputGroup from '@etherealengine/ui/src/components/editor/input/Group'
+import { Popup } from '@etherealengine/ui/src/components/tailwind/Popup'
+import Button from '@etherealengine/ui/src/primitives/tailwind/Button'
+import Input from '@etherealengine/ui/src/primitives/tailwind/Input'
+import Slider from '@etherealengine/ui/src/primitives/tailwind/Slider'
+import Tooltip from '@etherealengine/ui/src/primitives/tailwind/Tooltip'
+import React, { Fragment } from 'react'
+import { useTranslation } from 'react-i18next'
+import { FaList } from 'react-icons/fa'
+import { FiDownload, FiGrid, FiRefreshCcw } from 'react-icons/fi'
+import { HiOutlineFolder, HiOutlinePlusCircle } from 'react-icons/hi'
+import { HiMagnifyingGlass } from 'react-icons/hi2'
+import { IoArrowBack, IoSettingsSharp } from 'react-icons/io5'
+import { PiFolderPlusBold } from 'react-icons/pi'
+import { inputFileWithAddToScene } from '../../functions/assetFunctions'
+import { EditorState } from '../../services/EditorServices'
+import {
+ FilesState,
+ FilesViewModeSettings,
+ FilesViewModeState,
+ availableTableColumns,
+ useFilesQuery
+} from '../../services/FilesState'
+import { handleDownloadProject } from './download'
+
+const VIEW_MODES = [
+ { mode: 'list', icon: },
+ { mode: 'icons', icon: }
+]
+
+function extractDirectoryWithoutOrgName(directory: string, orgName: string) {
+ if (!orgName) return directory
+ return directory.replace(`projects/${orgName}`, 'projects/')
+}
+
+function BreadcrumbItems() {
+ const filesState = useMutableState(FilesState)
+ const { onChangeDirectoryByPath } = useFilesQuery()
+
+ const handleBreadcrumbDirectoryClick = (targetFolder: string) => {
+ if (filesState.orgName.value && targetFolder === 'projects') return
+ const pattern = /([^/]+)/g
+ const result = filesState.selectedDirectory.value.match(pattern)
+ if (!result) return
+ let newPath = '/'
+ for (const folder of result) {
+ newPath += folder + '/'
+ if (folder === targetFolder) {
+ break
+ }
+ }
+ onChangeDirectoryByPath(newPath)
+ }
+
+ let breadcrumbDirectoryFiles = extractDirectoryWithoutOrgName(
+ filesState.selectedDirectory.value,
+ filesState.orgName.value
+ )
+ .slice(1, -1)
+ .split('/')
+
+ const nestedIndex = breadcrumbDirectoryFiles.indexOf('projects')
+
+ breadcrumbDirectoryFiles = breadcrumbDirectoryFiles.filter((_, idx) => idx >= nestedIndex)
+
+ return (
+
+ )
+}
+
+const ViewModeSettings = () => {
+ const { t } = useTranslation()
+ const viewModeSettings = useMutableState(FilesViewModeSettings)
+ const filesViewMode = useMutableState(FilesViewModeState).viewMode
+
+ return (
+
+ } className="h-7 w-7 rounded-lg bg-[#2F3137] p-0" />
+
+ }
+ >
+ {filesViewMode.value === 'icons' ? (
+
+
+
+ ) : (
+ <>
+
+
+
+
+
+
+
+
+
+ {availableTableColumns.map((column) => (
+
+ viewModeSettings.list.selectedTableColumns[column].set(value)}
+ />
+
+ ))}
+
+
+ >
+ )}
+
+ )
+}
+
+export default function FilesToolbar() {
+ const { t } = useTranslation()
+ const filesState = useMutableState(FilesState)
+
+ const originalPath = useMutableState(EditorState).projectName.value
+ const filesViewMode = useMutableState(FilesViewModeState).viewMode
+
+ const showBackButton = filesState.selectedDirectory.value.split('/').length > (originalPath?.split('/').length || 0)
+ const showDownloadButtons = filesState.selectedDirectory.value.startsWith(
+ '/projects/' + filesState.projectName.value + '/'
+ )
+ const showUploadButtons =
+ filesState.selectedDirectory.value.startsWith('/projects/' + filesState.projectName.value + '/public/') ||
+ filesState.selectedDirectory.value.startsWith('/projects/' + filesState.projectName.value + '/assets/')
+
+ const { onBackDirectory, onRefreshDirectory, onCreateNewFolder } = useFilesQuery()
+
+ return (
+
+
+ {showBackButton && (
+
+
+ } className={`p-0`} onClick={onBackDirectory} />
+
+
+ )}
+
+
+
+ } className="p-0" onClick={onRefreshDirectory} />
+
+
+
+
+
+
+ {VIEW_MODES.map(({ mode, icon }) => (
+
+
+
+
+ {
+ filesState.searchText.set(e.target.value)
+ }}
+ labelClassname="text-sm text-red-500"
+ containerClassname="flex h-full w-auto"
+ className="h-7 rounded-lg border border-theme-input bg-[#141619] px-2 py-0 text-xs text-[#A3A3A3] placeholder:text-[#A3A3A3] focus-visible:ring-0"
+ startComponent={}
+ />
+
+
+
+
+ }
+ className="p-0"
+ onClick={() => handleDownloadProject(filesState.projectName.value, filesState.selectedDirectory.value)}
+ disabled={!showDownloadButtons}
+ />
+
+
+
+
+
+ } className="p-0" onClick={onCreateNewFolder} />
+
+
+
+
}
+ disabled={!showUploadButtons}
+ rounded="none"
+ className="h-full whitespace-nowrap bg-theme-highlight px-2"
+ size="small"
+ onClick={() =>
+ inputFileWithAddToScene({
+ projectName: filesState.projectName.value,
+ directoryPath: filesState.selectedDirectory.get(NO_PROXY).slice(1)
+ })
+ .then(() => onRefreshDirectory())
+ .catch((err) => {
+ NotificationService.dispatchNotify(err.message, { variant: 'error' })
+ })
+ }
+ >
+ {t('editor:layout.filebrowser.uploadFiles')}
+
+
}
+ disabled={!showUploadButtons}
+ rounded="none"
+ className="h-full whitespace-nowrap bg-theme-highlight px-2"
+ size="small"
+ onClick={() =>
+ inputFileWithAddToScene({
+ projectName: filesState.projectName.value,
+ directoryPath: filesState.selectedDirectory.get(NO_PROXY).slice(1),
+ preserveDirectory: true
+ })
+ .then(onRefreshDirectory)
+ .catch((err) => {
+ NotificationService.dispatchNotify(err.message, { variant: 'error' })
+ })
+ }
+ >
+ {t('editor:layout.filebrowser.uploadFolder')}
+
+
+ )
+}
diff --git a/packages/editor/src/services/FilesState.tsx b/packages/editor/src/services/FilesState.tsx
new file mode 100644
index 0000000000..7ee0bda57a
--- /dev/null
+++ b/packages/editor/src/services/FilesState.tsx
@@ -0,0 +1,131 @@
+/*
+CPAL-1.0 License
+
+The contents of this file are subject to the Common Public Attribution License
+Version 1.0. (the "License"); you may not use this file except in compliance
+with the License. You may obtain a copy of the License at
+https://github.com/EtherealEngine/etherealengine/blob/dev/LICENSE.
+The License is based on the Mozilla Public License Version 1.1, but Sections 14
+and 15 have been added to cover use of software over a computer network and
+provide for limited attribution for the Original Developer. In addition,
+Exhibit A has been modified to be consistent with Exhibit B.
+
+Software distributed under the License is distributed on an "AS IS" basis,
+WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License for the
+specific language governing rights and limitations under the License.
+
+The Original Code is Ethereal Engine.
+
+The Original Developer is the Initial Developer. The Initial Developer of the
+Original Code is the Ethereal Engine team.
+
+All portions of the code written by the Ethereal Engine team are Copyright © 2021-2023
+Ethereal Engine. All Rights Reserved.
+*/
+
+import { fileBrowserPath } from '@etherealengine/common/src/schema.type.module'
+import { defineState, syncStateWithLocalStorage, useMutableState } from '@etherealengine/hyperflux'
+import { useFind, useMutation, useSearch } from '@etherealengine/spatial/src/common/functions/FeathersHooks'
+import React, { ReactNode, createContext, useContext } from 'react'
+
+export const FilesViewModeState = defineState({
+ name: 'FilesViewModeState',
+ initial: {
+ viewMode: 'icons' as 'icons' | 'list'
+ },
+ extension: syncStateWithLocalStorage(['viewMode'])
+})
+
+export const availableTableColumns = ['name', 'type', 'dateModified', 'size'] as const
+
+export const FilesViewModeSettings = defineState({
+ name: 'FilesViewModeSettings',
+ initial: {
+ icons: {
+ iconSize: 90
+ },
+ list: {
+ fontSize: 15,
+ selectedTableColumns: {
+ name: true,
+ type: true,
+ dateModified: true,
+ size: true
+ }
+ }
+ },
+ extension: syncStateWithLocalStorage(['icons', 'list'])
+})
+
+export const FILES_PAGE_LIMIT = 100
+
+export const FilesState = defineState({
+ name: 'FilesState',
+ initial: () => ({
+ selectedDirectory: '',
+ projectName: '',
+ orgName: '',
+ searchText: ''
+ })
+})
+
+const FilesQueryContext = createContext({
+ filesQuery: null as null | ReturnType>,
+ onChangeDirectoryByPath: (_path: string) => {},
+ onBackDirectory: () => {},
+ onRefreshDirectory: () => {},
+ onCreateNewFolder: () => {}
+})
+
+export const FilesQueryProvider = ({ children }: { children?: ReactNode }) => {
+ const filesState = useMutableState(FilesState)
+
+ const filesQuery = useFind(fileBrowserPath, {
+ query: {
+ $limit: FILES_PAGE_LIMIT * 100,
+ directory: filesState.selectedDirectory.value
+ }
+ })
+
+ useSearch(
+ filesQuery,
+ {
+ key: {
+ $like: `%${filesState.searchText.value}%`
+ }
+ },
+ filesState.searchText.value
+ )
+
+ const onChangeDirectoryByPath = (path: string) => {
+ filesState.merge({ selectedDirectory: path })
+ filesQuery.setPage(0)
+ }
+
+ const onBackDirectory = () => {
+ const pattern = /([^/]+)/g
+ const result = filesState.selectedDirectory.value.match(pattern)
+ if (!result || result.length === 1 || (filesState.orgName && result.length === 2)) return
+ let newPath = '/'
+ for (let i = 0; i < result.length - 1; i++) {
+ newPath += result[i] + '/'
+ }
+ onChangeDirectoryByPath(newPath)
+ }
+
+ const onRefreshDirectory = async () => {
+ await filesQuery.refetch()
+ }
+
+ const onCreateNewFolder = () => useMutation(fileBrowserPath).create(`${filesState.selectedDirectory.value}New_Folder`)
+
+ return (
+
+ {children}
+
+ )
+}
+
+export const useFilesQuery = () => useContext(FilesQueryContext)
diff --git a/packages/ui/src/components/editor/layout/Panel.tsx b/packages/ui/src/components/editor/layout/Panel.tsx
index 7d1a757fc6..55b793d36e 100755
--- a/packages/ui/src/components/editor/layout/Panel.tsx
+++ b/packages/ui/src/components/editor/layout/Panel.tsx
@@ -26,11 +26,7 @@ Ethereal Engine. All Rights Reserved.
import React, { ReactNode } from 'react'
import Text from '../../../primitives/tailwind/Text'
-const PanelIcon = ({ as: IconComponent, size = 12 }) => {
- return
-}
-
-export const PanelTitle = ({ children }) => {
+export const PanelTitle = ({ children }: { children: ReactNode }) => {
return (
{children}
@@ -38,28 +34,6 @@ export const PanelTitle = ({ children }) => {
)
}
-export const PanelDragContainer = ({ children }) => {
- return {children}
+export const PanelDragContainer = ({ children }: { children: ReactNode }) => {
+ return {children}
}
-
-interface PanelProps {
- icon?: React.ElementType
- title: string
- toolbarContent?: React.ReactNode
- children?: ReactNode
-}
-
-const Panel: React.FC = ({ icon, title, children, toolbarContent, ...rest }) => {
- return (
-
-
- {icon &&
}
-
{title}
- {toolbarContent}
-
-
{children}
-
- )
-}
-
-export default Panel
diff --git a/packages/ui/src/components/editor/panels/Assets/container/index.tsx b/packages/ui/src/components/editor/panels/Assets/container/index.tsx
index 75977e7330..798d1f02fc 100644
--- a/packages/ui/src/components/editor/panels/Assets/container/index.tsx
+++ b/packages/ui/src/components/editor/panels/Assets/container/index.tsx
@@ -38,9 +38,9 @@ import {
import { Engine } from '@etherealengine/ecs/src/Engine'
import { AssetsPanelCategories } from '@etherealengine/editor/src/components/assets/AssetsPanelCategories'
import { AssetSelectionChangePropsType } from '@etherealengine/editor/src/components/assets/AssetsPreviewPanel'
-import { FilesViewModeSettings } from '@etherealengine/editor/src/components/assets/FileBrowser/FileBrowserState'
import { inputFileWithAddToScene } from '@etherealengine/editor/src/functions/assetFunctions'
import { EditorState } from '@etherealengine/editor/src/services/EditorServices'
+import { FilesViewModeSettings } from '@etherealengine/editor/src/services/FilesState'
import { ClickPlacementState } from '@etherealengine/editor/src/systems/ClickPlacementSystem'
import { AssetLoader } from '@etherealengine/engine/src/assets/classes/AssetLoader'
import { NO_PROXY, State, getMutableState, getState, useHookstate, useMutableState } from '@etherealengine/hyperflux'
diff --git a/packages/ui/src/components/editor/panels/Files/browserGrid/index.tsx b/packages/ui/src/components/editor/panels/Files/browserGrid/index.tsx
index a0bfc3f0be..624985382d 100644
--- a/packages/ui/src/components/editor/panels/Files/browserGrid/index.tsx
+++ b/packages/ui/src/components/editor/panels/Files/browserGrid/index.tsx
@@ -26,14 +26,11 @@ Ethereal Engine. All Rights Reserved.
import { PopoverState } from '@etherealengine/client-core/src/common/services/PopoverState'
import { fileBrowserPath } from '@etherealengine/common/src/schema.type.module'
import { CommonKnownContentTypes } from '@etherealengine/common/src/utils/CommonKnownContentTypes'
-import {
- FilesViewModeSettings,
- availableTableColumns
-} from '@etherealengine/editor/src/components/assets/FileBrowser/FileBrowserState'
import { FileDataType } from '@etherealengine/editor/src/components/assets/FileBrowser/FileDataType'
import { SupportedFileTypes } from '@etherealengine/editor/src/constants/AssetTypes'
import { addMediaNode } from '@etherealengine/editor/src/functions/addMediaNode'
import { getSpawnPositionAtCenter } from '@etherealengine/editor/src/functions/screenSpaceFunctions'
+import { FilesViewModeSettings, availableTableColumns } from '@etherealengine/editor/src/services/FilesState'
import { getMutableState, useHookstate } from '@etherealengine/hyperflux'
import { useMutation } from '@etherealengine/spatial/src/common/functions/FeathersHooks'
import { TransformComponent } from '@etherealengine/spatial/src/transform/components/TransformComponent'
diff --git a/packages/ui/src/components/editor/panels/Files/container/index.stories.tsx b/packages/ui/src/components/editor/panels/Files/container/index.stories.tsx
deleted file mode 100644
index b37f34cdd0..0000000000
--- a/packages/ui/src/components/editor/panels/Files/container/index.stories.tsx
+++ /dev/null
@@ -1,44 +0,0 @@
-/*
-CPAL-1.0 License
-
-The contents of this file are subject to the Common Public Attribution License
-Version 1.0. (the "License"); you may not use this file except in compliance
-with the License. You may obtain a copy of the License at
-https://github.com/EtherealEngine/etherealengine/blob/dev/LICENSE.
-The License is based on the Mozilla Public License Version 1.1, but Sections 14
-and 15 have been added to cover use of software over a computer network and
-provide for limited attribution for the Original Developer. In addition,
-Exhibit A has been modified to be consistent with Exhibit B.
-
-Software distributed under the License is distributed on an "AS IS" basis,
-WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License for the
-specific language governing rights and limitations under the License.
-
-The Original Code is Ethereal Engine.
-
-The Original Developer is the Initial Developer. The Initial Developer of the
-Original Code is the Ethereal Engine team.
-
-All portions of the code written by the Ethereal Engine team are Copyright © 2021-2023
-Ethereal Engine. All Rights Reserved.
-*/
-
-import Component from './index'
-
-const argTypes = {}
-
-export default {
- title: 'Editor/Panel/Files/Container',
- component: Component,
- parameters: {
- componentSubtitle: 'FilesPanel',
- jest: 'FilesPanelTitle.test.tsx',
- design: {
- type: 'figma',
- url: ''
- }
- },
- argTypes
-}
-
-export const Default = { args: {} }
diff --git a/packages/ui/src/components/editor/panels/Files/container/index.tsx b/packages/ui/src/components/editor/panels/Files/container/index.tsx
index 5793b4bc76..06ddae1e3a 100644
--- a/packages/ui/src/components/editor/panels/Files/container/index.tsx
+++ b/packages/ui/src/components/editor/panels/Files/container/index.tsx
@@ -37,18 +37,19 @@ import { CommonKnownContentTypes } from '@etherealengine/common/src/utils/Common
import { bytesToSize } from '@etherealengine/common/src/utils/btyesToSize'
import { unique } from '@etherealengine/common/src/utils/miscUtils'
import { AssetSelectionChangePropsType } from '@etherealengine/editor/src/components/assets/AssetsPreviewPanel'
-import {
- FilesViewModeSettings,
- FilesViewModeState,
- availableTableColumns
-} from '@etherealengine/editor/src/components/assets/FileBrowser/FileBrowserState'
import { FileDataType } from '@etherealengine/editor/src/components/assets/FileBrowser/FileDataType'
import ImageCompressionPanel from '@etherealengine/editor/src/components/assets/ImageCompressionPanel'
import ModelCompressionPanel from '@etherealengine/editor/src/components/assets/ModelCompressionPanel'
import { DndWrapper } from '@etherealengine/editor/src/components/dnd/DndWrapper'
import { SupportedFileTypes } from '@etherealengine/editor/src/constants/AssetTypes'
import { handleUploadFiles, inputFileWithAddToScene } from '@etherealengine/editor/src/functions/assetFunctions'
+import { ProjectDownloadProgress, handleDownloadProject } from '@etherealengine/editor/src/panels/files/download'
import { EditorState } from '@etherealengine/editor/src/services/EditorServices'
+import {
+ FilesViewModeSettings,
+ FilesViewModeState,
+ availableTableColumns
+} from '@etherealengine/editor/src/services/FilesState'
import { ClickPlacementState } from '@etherealengine/editor/src/systems/ClickPlacementSystem'
import { AssetLoader } from '@etherealengine/engine/src/assets/classes/AssetLoader'
import { ImmutableArray, NO_PROXY, getMutableState, useHookstate, useMutableState } from '@etherealengine/hyperflux'
@@ -80,7 +81,6 @@ import InputGroup from '../../../input/Group'
import { FileBrowserItem, FileTableWrapper, canDropItemOverFolder } from '../browserGrid'
import DeleteFileModal from '../browserGrid/DeleteFileModal'
import FilePropertiesModal from '../browserGrid/FilePropertiesModal'
-import { ProjectDownloadProgress, handleDownloadProject } from '../download/projectDownload'
import { FileUploadProgress } from '../upload/FileUploadProgress'
type FileBrowserContentPanelProps = {
diff --git a/packages/ui/src/components/editor/panels/Files/index.stories.tsx b/packages/ui/src/components/editor/panels/Files/index.stories.tsx
deleted file mode 100644
index dab8343489..0000000000
--- a/packages/ui/src/components/editor/panels/Files/index.stories.tsx
+++ /dev/null
@@ -1,44 +0,0 @@
-/*
-CPAL-1.0 License
-
-The contents of this file are subject to the Common Public Attribution License
-Version 1.0. (the "License"); you may not use this file except in compliance
-with the License. You may obtain a copy of the License at
-https://github.com/EtherealEngine/etherealengine/blob/dev/LICENSE.
-The License is based on the Mozilla Public License Version 1.1, but Sections 14
-and 15 have been added to cover use of software over a computer network and
-provide for limited attribution for the Original Developer. In addition,
-Exhibit A has been modified to be consistent with Exhibit B.
-
-Software distributed under the License is distributed on an "AS IS" basis,
-WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License for the
-specific language governing rights and limitations under the License.
-
-The Original Code is Ethereal Engine.
-
-The Original Developer is the Initial Developer. The Initial Developer of the
-Original Code is the Ethereal Engine team.
-
-All portions of the code written by the Ethereal Engine team are Copyright © 2021-2023
-Ethereal Engine. All Rights Reserved.
-*/
-
-import Component from './index'
-
-const argTypes = {}
-
-export default {
- title: 'Editor/Panel/Files',
- component: Component,
- parameters: {
- componentSubtitle: 'FilesPanelTitle',
- jest: 'FilesPanelTitle.test.tsx',
- design: {
- type: 'figma',
- url: ''
- }
- },
- argTypes
-}
-
-export const Default = { args: {} }