({
...item,
- title: connectedCloudsTypeTitleTranslation(item.providerName, t),
+ title: item.category
+ ? item.category
+ : connectedCloudsTypeTitleTranslation(item.providerName, t),
}));
const [isOpen, setIsOpen] = useState(false);
diff --git a/packages/client/src/components/panels/OperationsPanel/index.js b/packages/client/src/components/panels/OperationsPanel/index.js
index 5b5cd78e8f..889b6d92ab 100644
--- a/packages/client/src/components/panels/OperationsPanel/index.js
+++ b/packages/client/src/components/panels/OperationsPanel/index.js
@@ -153,7 +153,7 @@ const OperationsPanelComponent = (props) => {
diff --git a/packages/client/src/components/panels/SelectFileDialog/ModalView.js b/packages/client/src/components/panels/SelectFileDialog/ModalView.js
deleted file mode 100644
index e211695539..0000000000
--- a/packages/client/src/components/panels/SelectFileDialog/ModalView.js
+++ /dev/null
@@ -1,280 +0,0 @@
-import React from "react";
-import { StyledAsidePanel, StyledSelectFilePanel } from "../StyledPanels";
-import ModalDialog from "@docspace/components/modal-dialog";
-import SelectFolderDialog from "../SelectFolderDialog";
-import FolderTreeBody from "../../FolderTreeBody";
-import FilesListBody from "./FilesListBody";
-import Button from "@docspace/components/button";
-import Text from "@docspace/components/text";
-import { isArrayEqual } from "@docspace/components/utils/array";
-import { getFoldersTree } from "@docspace/common/api/files";
-import {
- exceptSortedByTagsFolders,
- exceptPrivacyTrashFolders,
-} from "../SelectFolderDialog/ExceptionFoldersConstants";
-
-class SelectFileDialogModalView extends React.Component {
- constructor(props) {
- super(props);
- this.state = {
- isLoading: true,
- isAvailable: true,
- };
- this.folderList = "";
- this.noTreeSwitcher = false;
- }
-
- componentDidMount() {
- const { onSetLoadingData } = this.props;
- this.setState({ isLoadingData: true }, function () {
- onSetLoadingData && onSetLoadingData(true);
-
- this.trySwitch();
- });
- }
- trySwitch = async () => {
- const {
- foldersType,
- onSelectFolder,
- selectedFolder,
- passedId,
- foldersList,
- } = this.props;
- switch (foldersType) {
- case "exceptSortedByTags":
- try {
- const foldersTree = await getFoldersTree();
- [
- this.folderList,
- this.noTreeSwitcher,
- ] = SelectFolderDialog.convertFolders(
- foldersTree,
- exceptSortedByTagsFolders
- );
- this.onSetSelectedFolder();
- } catch (err) {
- console.error(err);
- }
-
- this.loadersCompletes();
- break;
- case "exceptPrivacyTrashFolders":
- try {
- const foldersTree = await getFoldersTree();
- [
- this.folderList,
- this.noTreeSwitcher,
- ] = SelectFolderDialog.convertFolders(
- foldersTree,
- exceptPrivacyTrashFolders
- );
- this.onSetSelectedFolder();
- } catch (err) {
- console.error(err);
- }
- this.loadersCompletes();
- break;
- case "common":
- try {
- this.folderList = await SelectFolderDialog.getCommonFolders();
-
- !selectedFolder &&
- onSelectFolder &&
- onSelectFolder(
- `${
- selectedFolder
- ? selectedFolder
- : passedId
- ? passedId
- : this.folderList[0].id
- }`
- );
- } catch (err) {
- console.error(err);
- }
-
- this.loadersCompletes();
- break;
- case "third-party":
- try {
- this.folderList = foldersList
- ? foldersList
- : await SelectFolderDialog.getCommonThirdPartyList();
- this.folderList.length !== 0
- ? this.onSetSelectedFolder()
- : this.setState({ isAvailable: false });
- } catch (err) {
- console.error(err);
- }
-
- this.loadersCompletes();
- break;
- }
- };
-
- loadersCompletes = () => {
- const { onSetLoadingData } = this.props;
- onSetLoadingData && onSetLoadingData(false);
-
- this.setState({
- isLoading: false,
- });
- };
-
- onSetSelectedFolder = () => {
- const { onSelectFolder, selectedFolder, passedId } = this.props;
-
- onSelectFolder &&
- onSelectFolder(
- `${
- selectedFolder
- ? selectedFolder
- : passedId
- ? passedId
- : this.folderList[0].id
- }`
- );
- };
- onSelect = (folder) => {
- const { onSelectFolder, selectedFolder } = this.props;
-
- if (isArrayEqual([folder[0]], [selectedFolder])) {
- return;
- }
-
- onSelectFolder && onSelectFolder(folder[0]);
- };
-
- onMouseEvent = (event) => {
- event.stopPropagation();
- };
- render() {
- const {
- t,
- isPanelVisible,
- onClose,
- zIndex,
- withoutProvider,
- expandedKeys,
- filter,
- onSelectFile,
- filesList,
- hasNextPage,
- isNextPageLoading,
- loadNextPage,
- selectedFolder,
- titleFilesList,
- loadingText,
- selectedFile,
- onClickSave,
- headerName,
- primaryButtonName,
- theme,
- } = this.props;
-
- const { isLoading, isAvailable } = this.state;
-
- const isHeaderChildren = !!titleFilesList;
-
- return (
-
-
-
- {headerName ? headerName : t("SelectFile")}
-
-
-
-
-
-
-
-
- <>
- {titleFilesList && (
-
- {titleFilesList}
-
- )}
- {selectedFolder && (
-
- )}
-
-
-
- );
- }
-}
-
-export default SelectFileDialogModalView;
diff --git a/packages/client/src/components/panels/SelectFileDialog/index.js b/packages/client/src/components/panels/SelectFileDialog/index.js
index 819d6c9ac7..c4b4c06285 100644
--- a/packages/client/src/components/panels/SelectFileDialog/index.js
+++ b/packages/client/src/components/panels/SelectFileDialog/index.js
@@ -5,7 +5,7 @@ import PropTypes from "prop-types";
import throttle from "lodash/throttle";
import SelectFileDialogAsideView from "./AsideView";
import utils from "@docspace/components/utils";
-import { FilterType } from "@docspace/common/constants";
+import { FilterType, FolderType } from "@docspace/common/constants";
import isEqual from "lodash/isEqual";
import SelectionPanel from "../SelectionPanel/SelectionPanelBody";
import toastr from "@docspace/components/toast/toastr";
@@ -14,13 +14,15 @@ const { desktop } = utils.device;
class SelectFileDialog extends React.Component {
constructor(props) {
super(props);
- const { filter } = props;
+ const { filter, folderId, fileInfo } = props;
this.state = {
isVisible: false,
- files: [],
+ selectedFileInfo: {},
displayType: this.getDisplayType(),
isAvailableFolderList: true,
+ selectedFolderId: folderId,
+ selectedFileInfo: fileInfo,
};
this.throttledResize = throttle(this.setDisplayType, 300);
this.newFilter = filter.clone();
@@ -81,14 +83,10 @@ class SelectFileDialog extends React.Component {
async componentDidMount() {
const {
- treeFolders,
- foldersType,
- onSetBaseFolderPath,
+ filteredType,
onSelectFolder,
- foldersList,
- treeFromInput,
+ passedFoldersTree,
displayType,
- setFolderId,
folderId,
withoutBasicSelection,
} = this.props;
@@ -99,18 +97,23 @@ class SelectFileDialog extends React.Component {
let resultingFolderTree, resultingId;
+ const treeFolders = await this.props.fetchTreeFolders();
+ const roomsFolder = treeFolders.find(
+ (f) => f.rootFolderType == FolderType.Rooms
+ );
+ const hasSharedFolder =
+ roomsFolder && roomsFolder.foldersCount ? true : false;
+
try {
[
resultingFolderTree,
resultingId,
] = await SelectionPanel.getBasicFolderInfo(
treeFolders,
- foldersType,
+ filteredType,
folderId,
- onSetBaseFolderPath,
- onSelectFolder,
- foldersList,
- withoutBasicSelection
+ passedFoldersTree,
+ hasSharedFolder
);
} catch (e) {
toastr.error(e);
@@ -118,7 +121,7 @@ class SelectFileDialog extends React.Component {
return;
}
- const tree = treeFromInput ? treeFromInput : resultingFolderTree;
+ const tree = resultingFolderTree;
if (tree.length === 0) {
this.setState({ isAvailable: false });
@@ -126,10 +129,13 @@ class SelectFileDialog extends React.Component {
return;
}
- setFolderId(resultingId);
+ if (!withoutBasicSelection) {
+ onSelectFolder && onSelectFolder(resultingId);
+ }
this.setState({
resultingFolderTree: tree,
+ selectedFolderId: resultingId,
});
}
@@ -140,20 +146,8 @@ class SelectFileDialog extends React.Component {
}
componentWillUnmount() {
- const {
- setFolderId,
- setFile,
- setExpandedPanelKeys,
- withoutResetFolderTree,
- } = this.props;
this.throttledResize && this.throttledResize.cancel();
window.removeEventListener("resize", this.throttledResize);
-
- if (!withoutResetFolderTree) {
- setExpandedPanelKeys(null);
- setFolderId(null);
- setFile(null);
- }
}
getDisplayType = () => {
@@ -183,25 +177,33 @@ class SelectFileDialog extends React.Component {
onSelectFolder = (folder) => {
const { displayType } = this.state;
- const { setFolderId, setFile, folderId } = this.props;
+ const { folderId } = this.props;
const id = displayType === "aside" ? folder : folder[0];
if (id !== folderId) {
- setFolderId(id);
- setFile(null);
+ this.setState({
+ selectedFolderId: id,
+ });
}
};
onSelectFile = (item, index) => {
- const { setFile } = this.props;
-
- setFile(item);
+ this.setState({
+ selectedFileInfo: item,
+ });
};
onClickSave = () => {
- const { onClose, onSelectFile, fileInfo } = this.props;
+ const { onClose, onSelectFile, setFile, setFolderId } = this.props;
+ const { selectedFileInfo, selectedFolderId } = this.state;
- onSelectFile && onSelectFile(fileInfo);
+ setFile(selectedFileInfo);
+
+ if (selectedFileInfo.folderId.toString() === selectedFolderId.toString()) {
+ setFolderId(selectedFolderId);
+ }
+
+ onSelectFile && onSelectFile(selectedFileInfo);
onClose && onClose();
};
@@ -210,7 +212,7 @@ class SelectFileDialog extends React.Component {
t,
isPanelVisible,
onClose,
- foldersType,
+ filteredType,
withoutProvider,
filesListTitle,
theme,
@@ -219,8 +221,6 @@ class SelectFileDialog extends React.Component {
dialogName,
creationButtonPrimary,
maxInputWidth,
- folderId,
- fileInfo,
} = this.props;
const {
isVisible,
@@ -228,6 +228,8 @@ class SelectFileDialog extends React.Component {
isAvailableFolderList,
resultingFolderTree,
isLoadingData,
+ selectedFileInfo,
+ selectedFolderId,
} = this.state;
const buttonName = creationButtonPrimary
@@ -244,7 +246,7 @@ class SelectFileDialog extends React.Component {
isFolderPanelVisible={isVisible}
onClose={onClose}
withoutProvider={withoutProvider}
- folderId={folderId}
+ folderId={selectedFolderId}
resultingFolderTree={resultingFolderTree}
onButtonClick={this.onClickSave}
header={header}
@@ -256,9 +258,9 @@ class SelectFileDialog extends React.Component {
onSelectFolder={this.onSelectFolder}
onSelectFile={this.onSelectFile}
filesListTitle={filesListTitle}
- fileId={fileInfo?.id}
+ fileId={selectedFileInfo.id}
newFilter={this.newFilter}
- foldersType={foldersType}
+ filteredType={filteredType}
onClickInput={this.onClickInput}
onCloseSelectFolderDialog={this.onCloseSelectFolderDialog}
maxInputWidth={maxInputWidth}
@@ -270,7 +272,7 @@ class SelectFileDialog extends React.Component {
isPanelVisible={isPanelVisible}
onClose={onClose}
withoutProvider={withoutProvider}
- folderId={folderId}
+ folderId={selectedFolderId}
resultingFolderTree={resultingFolderTree}
onButtonClick={this.onClickSave}
header={header}
@@ -282,7 +284,7 @@ class SelectFileDialog extends React.Component {
onSelectFolder={this.onSelectFolder}
onSelectFile={this.onSelectFile}
filesListTitle={filesListTitle}
- fileId={fileInfo?.id}
+ fileId={selectedFileInfo.id}
newFilter={this.newFilter}
/>
);
@@ -292,26 +294,20 @@ SelectFileDialog.propTypes = {
onClose: PropTypes.func.isRequired,
isPanelVisible: PropTypes.bool.isRequired,
onSelectFile: PropTypes.func.isRequired,
- foldersType: PropTypes.oneOf([
- "common",
- "third-party",
+ filteredType: PropTypes.oneOf([
"exceptSortedByTags",
- "exceptPrivacyTrashFolders",
+ "exceptPrivacyTrashArchiveFolders",
]),
id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
withoutProvider: PropTypes.bool,
- ignoreSelectedFolderTree: PropTypes.bool,
headerName: PropTypes.string,
filesListTitle: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
- withoutResetFolderTree: PropTypes.bool,
};
SelectFileDialog.defaultProps = {
id: "",
filesListTitle: "",
withoutProvider: false,
- ignoreSelectedFolderTree: false,
- withoutResetFolderTree: false,
};
export default inject(
@@ -329,7 +325,7 @@ export default inject(
setFile,
} = selectFileDialogStore;
- const { treeFolders, setExpandedPanelKeys } = treeFoldersStore;
+ const { setExpandedPanelKeys, fetchTreeFolders } = treeFoldersStore;
const { filter } = filesStore;
const { id: storeFolderId } = selectedFolderStore;
@@ -342,12 +338,12 @@ export default inject(
setFile,
setFolderId,
filter,
- treeFolders,
storeFolderId,
folderId,
theme: theme,
setExpandedPanelKeys,
+ fetchTreeFolders,
};
}
)(
diff --git a/packages/client/src/components/panels/SelectFileInput/index.js b/packages/client/src/components/panels/SelectFileInput/index.js
index 5076d76cb6..acc872cbde 100644
--- a/packages/client/src/components/panels/SelectFileInput/index.js
+++ b/packages/client/src/components/panels/SelectFileInput/index.js
@@ -6,20 +6,23 @@ import StyledComponent from "./StyledSelectFileInput";
import SimpleFileInput from "../../SimpleFileInput";
class SelectFileInput extends React.PureComponent {
- constructor(props) {
- super(props);
-
- const { setExpandedPanelKeys, setFolderId, setFile } = props;
-
- setExpandedPanelKeys(null);
- setFolderId(null);
- setFile(null);
- }
-
componentDidMount() {
this.props.setFirstLoad(false);
}
+ componentWillUnmount() {
+ const {
+ setExpandedPanelKeys,
+ setFolderId,
+ setFile,
+ onSelectFile,
+ } = this.props;
+
+ setExpandedPanelKeys(null);
+ setFolderId(null);
+ setFile({});
+ onSelectFile && onSelectFile({});
+ }
render() {
const {
onClickInput,
diff --git a/packages/client/src/components/panels/SelectFolderDialog/AsideView.js b/packages/client/src/components/panels/SelectFolderDialog/AsideView.js
index d8abdf0d1f..cc036db554 100644
--- a/packages/client/src/components/panels/SelectFolderDialog/AsideView.js
+++ b/packages/client/src/components/panels/SelectFolderDialog/AsideView.js
@@ -22,7 +22,7 @@ const SelectFolderDialogAsideView = ({
isPanelVisible,
onClose,
withoutProvider,
- isNeedArrowIcon,
+ withFileSelectDialog,
isAvailable,
folderId,
isLoadingData,
@@ -50,7 +50,7 @@ const SelectFolderDialogAsideView = ({
>
- {isNeedArrowIcon && (
+ {withFileSelectDialog && (
f.rootFolderType == FolderType.Rooms
+ );
+
+ const hasSharedFolder =
+ roomsFolder && roomsFolder.foldersCount ? true : false;
+
try {
[
resultingFolderTree,
resultingId,
] = await SelectionPanel.getBasicFolderInfo(
treeFolders,
- foldersType,
+ filteredType,
initialFolderId,
- onSetBaseFolderPath,
- onSelectFolder,
- foldersList
+ passedFoldersTree,
+ hasSharedFolder
);
} catch (e) {
toastr.error(e);
@@ -69,46 +78,35 @@ class SelectFolderDialog extends React.Component {
}
}
- const tree =
- isNeedArrowIcon || withInput ? folderTree : resultingFolderTree;
+ const tree = withFileSelectDialog ? folderTree : resultingFolderTree;
if (tree.length === 0) {
this.setState({ isAvailable: false });
- onSelectFolder(null);
+ onSelectFolder && onSelectFolder(null);
return;
}
- const resId = isNeedArrowIcon || withInput ? id : resultingId;
- !withoutBasicSelection && onSelectFolder && onSelectFolder(resId);
- //isNeedArrowIcon && onSetBaseFolderPath(resId);
+ setResultingFoldersTree(tree);
- setFolderId(resId);
+ const resId = withFileSelectDialog ? id : resultingId;
- this.setState({
- resultingFolderTree: tree,
- });
- }
-
- componentDidUpdate(prevProps) {
- const { isReset } = this.props;
-
- if (isReset && isReset !== prevProps.isReset) {
- this.onResetInfo();
+ if (!withoutBasicSelection) {
+ onSelectFolder && onSelectFolder(resId);
+ onSetBaseFolderPath && onSetBaseFolderPath(resId);
}
+
+ setResultingFolderId(resId);
}
componentWillUnmount() {
- const { setFolderTitle, setProviderKey, setFolderId } = this.props;
- //console.log("componentWillUnmount");
+ const { toDefault } = this.props;
if (this.throttledResize) {
this.throttledResize && this.throttledResize.cancel();
window.removeEventListener("resize", this.throttledResize);
}
- setFolderTitle("");
- setProviderKey(null);
- setFolderId(null);
+ toDefault();
}
getDisplayType = () => {
const displayType =
@@ -124,23 +122,27 @@ class SelectFolderDialog extends React.Component {
};
onSelect = async (folder, treeNode) => {
- const { setFolderId, folderId } = this.props;
+ const { setResultingFolderId, resultingFolderId } = this.props;
- if (+folderId === +folder[0]) return;
+ if (+resultingFolderId === +folder[0]) return;
- setFolderId(folder[0]);
+ setResultingFolderId(folder[0]);
};
onClose = () => {
const {
setExpandedPanelKeys,
onClose,
- treeFolders,
- withInput,
- isNeedArrowIcon,
+
+ selectFolderInputExist,
+ withFileSelectDialog,
} = this.props;
- if (!treeFolders.length && !withInput && !isNeedArrowIcon) {
+ if (
+ !treeFolders.length &&
+ !selectFolderInputExist &&
+ !withFileSelectDialog
+ ) {
setExpandedPanelKeys(null);
}
onClose && onClose();
@@ -161,25 +163,20 @@ class SelectFolderDialog extends React.Component {
providerKey,
folderTitle,
- folderId,
+ resultingFolderId,
setSelectedItems,
} = this.props;
setSelectedItems();
- onSubmit && onSubmit(folderId, folderTitle, providerKey);
- onSave && onSave(e, folderId);
- onSetNewFolderPath && onSetNewFolderPath(folderId);
- onSelectFolder && onSelectFolder(folderId);
-
+ onSubmit && onSubmit(resultingFolderId, folderTitle, providerKey);
+ onSave && onSave(e, resultingFolderId);
+ onSetNewFolderPath && onSetNewFolderPath(resultingFolderId);
+ onSelectFolder && onSelectFolder(resultingFolderId);
+ //setResultingFolderId(resultingFolderId);
!withoutImmediatelyClose && this.onClose();
};
- onResetInfo = async () => {
- const { id, setFolderId } = this.props;
- setFolderId(id);
- };
-
render() {
const {
t,
@@ -187,13 +184,13 @@ class SelectFolderDialog extends React.Component {
isPanelVisible,
zIndex,
withoutProvider,
- isNeedArrowIcon, //for aside view when selected file
+ withFileSelectDialog,
header,
dialogName,
footer,
buttonName,
isDisableTree,
- folderId,
+ resultingFolderId,
folderTitle,
expandedKeys,
isDisableButton,
@@ -201,13 +198,9 @@ class SelectFolderDialog extends React.Component {
currentFolderId,
selectionFiles,
sharedRoomId,
- } = this.props;
- const {
- displayType,
- isLoadingData,
- isAvailable,
resultingFolderTree,
- } = this.state;
+ } = this.props;
+ const { displayType, isLoadingData, isAvailable } = this.state;
const primaryButtonName = buttonName
? buttonName
@@ -217,7 +210,12 @@ class SelectFolderDialog extends React.Component {
// console.log("Render Folder Component?", this.state);
const folderSelectionDisabled =
- folderId === sharedRoomId || folderId === sharedRoomId?.toString();
+ resultingFolderId === sharedRoomId ||
+ resultingFolderId === sharedRoomId?.toString();
+
+ const buttonIsDisabled =
+ isDisableButton ||
+ (isRecycleBin && currentFolderId === resultingFolderId);
return displayType === "aside" ? (
) : (
);
}
@@ -284,12 +280,9 @@ SelectFolderDialog.propTypes = {
onSelectFolder: PropTypes.func,
onClose: PropTypes.func,
isPanelVisible: PropTypes.bool.isRequired,
- foldersType: PropTypes.oneOf([
- "common",
- "third-party",
+ filteredType: PropTypes.oneOf([
"exceptSortedByTags",
- "exceptPrivacyTrashFolders",
- "rooms",
+ "exceptPrivacyTrashArchiveFolders",
"",
]),
displayType: PropTypes.oneOf(["aside", "modal"]),
@@ -303,6 +296,7 @@ SelectFolderDialog.defaultProps = {
withoutProvider: false,
withoutImmediatelyClose: false,
isDisableTree: false,
+ filteredType: "",
};
export default inject(
@@ -318,9 +312,9 @@ export default inject(
{ selectedId }
) => {
const {
- treeFolders,
setExpandedPanelKeys,
sharedRoomId,
+ fetchTreeFolders,
} = treeFoldersStore;
const { filter } = filesStore;
@@ -328,12 +322,16 @@ export default inject(
const { id } = selectedFolderStore;
const {
- setFolderId,
+ setResultingFolderId,
setFolderTitle,
setProviderKey,
providerKey,
folderTitle,
- folderId,
+ resultingFolderId,
+ setIsLoading,
+ resultingFolderTree,
+ setResultingFoldersTree,
+ toDefault,
} = selectFolderDialogStore;
const { settingsStore } = auth;
@@ -345,15 +343,19 @@ export default inject(
storeFolderId: selectedFolderId,
providerKey,
folderTitle,
- folderId,
+ resultingFolderId,
setExpandedPanelKeys,
- setFolderId,
+ setResultingFolderId,
setFolderTitle,
setProviderKey,
- treeFolders,
filter,
setSelectedItems,
sharedRoomId,
+ fetchTreeFolders,
+ setIsLoading,
+ resultingFolderTree,
+ toDefault,
+ setResultingFoldersTree,
};
}
)(
diff --git a/packages/client/src/components/panels/SelectFolderInput/index.js b/packages/client/src/components/panels/SelectFolderInput/index.js
index 64859fbefd..8b9f482721 100644
--- a/packages/client/src/components/panels/SelectFolderInput/index.js
+++ b/packages/client/src/components/panels/SelectFolderInput/index.js
@@ -12,111 +12,25 @@ import { FolderType } from "@docspace/common/constants";
class SelectFolderInput extends React.PureComponent {
constructor(props) {
super(props);
- const { id, foldersType, withoutBasicSelection } = this.props;
+ const { id, withoutBasicSelection, setIsLoading } = this.props;
- const isNeedLoader =
- !!id || !withoutBasicSelection || foldersType === "common";
-
- this.state = {
- isLoading: isNeedLoader,
- baseFolderPath: "",
- newFolderPath: "",
- resultingFolderTree: [],
- baseId: "",
- };
+ const isNeedLoadPath = !!id || !withoutBasicSelection;
+ setIsLoading(isNeedLoadPath);
this._isMount = false;
}
- setBaseInfo = async () => {
- const {
- foldersType,
- id,
- onSelectFolder,
- foldersList,
- withoutBasicSelection,
- } = this.props;
-
- let resultingFolderTree, resultingId;
-
- try {
- [
- resultingFolderTree,
- resultingId,
- ] = await SelectionPanel.getBasicFolderInfo(
- null,
- foldersType,
- id,
- this.onSetBaseFolderPath,
- onSelectFolder,
- foldersList,
- withoutBasicSelection
- );
- } catch (e) {
- toastr.error(e);
- this._isMount &&
- this.setState({
- isLoading: false,
- });
- return;
- }
-
- this._isMount &&
- this.setState({
- isPathError: false,
- resultingFolderTree,
- baseId: resultingId,
- baseFolderPath: "",
- newFolderPath: "",
- ...(withoutBasicSelection && { isLoading: false }),
- });
- };
-
componentDidMount() {
this._isMount = true;
- const { setFirstLoad, isWaitingUpdate } = this.props;
+ const { setFirstLoad } = this.props;
setFirstLoad(false);
- !isWaitingUpdate && this.setBaseInfo();
- }
-
- componentDidUpdate(prevProps) {
- const {
- isSuccessSave,
- isReset,
- id,
-
- isWaitingUpdate,
- } = this.props;
- const { newFolderPath, baseFolderPath } = this.state;
-
- if (!isSuccessSave && isSuccessSave !== prevProps.isSuccessSave) {
- newFolderPath &&
- this.setState({
- baseFolderPath: newFolderPath,
- baseId: id,
- newId: null,
- isPathError: false,
- });
- }
-
- if (!isReset && isReset !== prevProps.isReset) {
- this.setState({
- newFolderPath: baseFolderPath,
- baseId: id,
- newId: null,
- isPathError: false,
- });
- }
-
- if (!isWaitingUpdate && isWaitingUpdate !== prevProps.isWaitingUpdate) {
- this.setBaseInfo();
- }
}
componentWillUnmount() {
this._isMount = false;
+ this.props.toDefault();
}
setFolderPath = async (folderId) => {
const foldersArray = await getFolderPath(folderId);
@@ -143,48 +57,53 @@ class SelectFolderInput extends React.PureComponent {
return convertFoldersArray;
};
onSetNewFolderPath = async (folderId) => {
+ const { setIsLoading, setNewFolderPath, setIsPathError } = this.props;
let timerId = setTimeout(() => {
- this._isMount && this.setState({ isLoading: true });
+ setIsLoading(true);
}, 500);
- try {
- const convertFoldersArray = await this.setFolderPath(folderId);
- clearTimeout(timerId);
- timerId = null;
- this._isMount &&
- this.setState({
- newFolderPath: convertFoldersArray,
- isLoading: false,
- newId: folderId,
- isPathError: false,
- });
- } catch (e) {
- toastr.error(e);
- clearTimeout(timerId);
- timerId = null;
- this._isMount &&
- this.setState({
- isLoading: false,
- isPathError: true,
- });
- }
- };
- onSetBaseFolderPath = async (folderId) => {
+
try {
const convertFoldersArray = await this.setFolderPath(folderId);
- this._isMount &&
- this.setState({
- baseFolderPath: convertFoldersArray,
- isLoading: false,
- ...(!convertFoldersArray && { isPathError: true }),
- });
+ setNewFolderPath(convertFoldersArray);
+
+ clearTimeout(timerId);
+ timerId = null;
+ setIsPathError(false);
+ setIsLoading(false);
} catch (e) {
toastr.error(e);
- this._isMount &&
- this.setState({
- isLoading: false,
- isPathError: true,
- });
+ clearTimeout(timerId);
+ setIsLoading(false);
+ timerId = null;
+ setIsPathError(true);
+ }
+ };
+ onSetBaseFolderPath = async (folderId) => {
+ const {
+ setIsLoading,
+ setBaseFolderPath,
+ setIsPathError,
+ setResultingFolderId,
+ resultingFolderTree,
+ } = this.props;
+
+ try {
+ const convertFoldersArray = await this.setFolderPath(folderId);
+ setBaseFolderPath(convertFoldersArray);
+ setIsLoading(false);
+ if (!convertFoldersArray) {
+ setIsPathError(true);
+
+ this.onSetFolderInfo(resultingFolderTree[0].id);
+ setResultingFolderId(resultingFolderTree[0].id);
+ }
+ } catch (e) {
+ toastr.error(e);
+ setIsLoading(false);
+ setIsPathError(true);
+ this.onSetFolderInfo(resultingFolderTree[0].id);
+ setResultingFolderId(resultingFolderTree[0].id);
}
};
onSelectFolder = (folderId) => {
@@ -195,25 +114,19 @@ class SelectFolderInput extends React.PureComponent {
};
onSetFolderInfo = (folderId) => {
const { setExpandedPanelKeys, setParentId } = this.props;
+
getFolder(folderId)
.then((data) => {
const pathParts = data.pathParts.map((item) => item.toString());
pathParts?.pop();
+
setExpandedPanelKeys(pathParts);
setParentId(data.current.parentId);
})
.catch((e) => toastr.error(e));
};
+
render() {
- const {
- isLoading,
- baseFolderPath,
- newFolderPath,
- baseId,
- resultingFolderTree,
- newId,
- isPathError,
- } = this.state;
const {
onClickInput,
isError,
@@ -222,14 +135,19 @@ class SelectFolderInput extends React.PureComponent {
maxInputWidth,
isDisabled,
isPanelVisible,
- id,
+
theme,
isFolderTreeLoading = false,
onSelectFolder,
+ isLoading,
+ newFolderPath,
+ baseFolderPath,
+ isPathError,
+ isWaitingUpdate,
...rest
} = this.props;
- const passedId = newId ? newId : baseId;
+ const isReady = !isFolderTreeLoading && !isWaitingUpdate;
return (
@@ -240,19 +158,12 @@ class SelectFolderInput extends React.PureComponent {
isError={isError || isPathError}
onClickInput={onClickInput}
placeholder={placeholder}
- isDisabled={
- isFolderTreeLoading ||
- isDisabled ||
- isLoading ||
- resultingFolderTree?.length === 0
- }
+ isDisabled={isFolderTreeLoading || isDisabled || isLoading}
/>
- {!isFolderTreeLoading && isPanelVisible && (
+ {isReady && (
{
const { setFirstLoad } = filesStore;
const { setExpandedPanelKeys } = treeFoldersStore;
- const { setFolderId } = selectFolderDialogStore;
+ const {
+ isLoading,
+ setIsLoading,
+ baseFolderPath,
+ setBaseFolderPath,
+ newFolderPath,
+ setNewFolderPath,
+ toDefault,
+ setIsPathError,
+ isPathError,
+ resultingFolderTree,
+ setResultingFolderId,
+ } = selectFolderDialogStore;
const { setParentId } = selectedFolderStore;
+
return {
setFirstLoad,
-
- setFolderId,
setExpandedPanelKeys,
setParentId,
+ isLoading,
+ setIsLoading,
+ setBaseFolderPath,
+ baseFolderPath,
+ newFolderPath,
+ setNewFolderPath,
+ toDefault,
+ setIsPathError,
+ isPathError,
+ resultingFolderTree,
+ setResultingFolderId,
};
}
)(observer(withTranslation("Translations")(SelectFolderInput)));
diff --git a/packages/client/src/components/panels/SelectionPanel/ExceptionFoldersConstants.js b/packages/client/src/components/panels/SelectionPanel/ExceptionFoldersConstants.js
index af60cfe7f3..b3edd7b7b0 100644
--- a/packages/client/src/components/panels/SelectionPanel/ExceptionFoldersConstants.js
+++ b/packages/client/src/components/panels/SelectionPanel/ExceptionFoldersConstants.js
@@ -8,4 +8,8 @@ export const exceptSortedByTagsFolders = [
FolderType.Archive,
];
-export const exceptPrivacyTrashFolders = [FolderType.Privacy, FolderType.TRASH];
+export const exceptPrivacyTrashArchiveFolders = [
+ FolderType.Privacy,
+ FolderType.TRASH,
+ FolderType.Archive,
+];
diff --git a/packages/client/src/components/panels/SelectionPanel/FilesListWrapper.js b/packages/client/src/components/panels/SelectionPanel/FilesListWrapper.js
index 2833659676..1da2726e26 100644
--- a/packages/client/src/components/panels/SelectionPanel/FilesListWrapper.js
+++ b/packages/client/src/components/panels/SelectionPanel/FilesListWrapper.js
@@ -55,7 +55,7 @@ class FilesListWrapper extends React.Component {
folderId,
setFolderTitle,
setProviderKey,
- setFolderId,
+ setResultingFolderId,
folderSelection,
} = this.props;
@@ -89,7 +89,7 @@ class FilesListWrapper extends React.Component {
if (page === 0 && folderSelection) {
setFolderTitle(data.current.title);
setProviderKey(data.current.providerKey);
- setFolderId(folderId);
+ setResultingFolderId(folderId);
}
const finalData = [...data.files];
@@ -144,7 +144,7 @@ export default inject(
({ selectedFolderStore, selectFolderDialogStore, auth }) => {
const { id } = selectedFolderStore;
const {
- setFolderId,
+ setResultingFolderId,
setFolderTitle,
setProviderKey,
} = selectFolderDialogStore;
@@ -155,7 +155,7 @@ export default inject(
return {
theme: theme,
storeFolderId: id,
- setFolderId,
+ setResultingFolderId,
setFolderTitle,
setProviderKey,
};
diff --git a/packages/client/src/components/panels/SelectionPanel/SelectionPanelBody.js b/packages/client/src/components/panels/SelectionPanel/SelectionPanelBody.js
index bcf4ae35c7..67f7748a8c 100644
--- a/packages/client/src/components/panels/SelectionPanel/SelectionPanelBody.js
+++ b/packages/client/src/components/panels/SelectionPanel/SelectionPanelBody.js
@@ -13,11 +13,13 @@ import {
import toastr from "@docspace/components/toast/toastr";
import {
exceptSortedByTagsFolders,
- exceptPrivacyTrashFolders,
+ exceptPrivacyTrashArchiveFolders,
} from "./ExceptionFoldersConstants";
import { StyledBody, StyledModalDialog } from "./StyledSelectionPanel";
import Text from "@docspace/components/text";
import Loaders from "@docspace/common/components/Loaders";
+import { FolderType } from "@docspace/common/constants";
+
const SelectionPanelBody = ({
t,
isPanelVisible,
@@ -172,53 +174,20 @@ class SelectionPanel extends React.Component {
};
static getBasicFolderInfo = async (
treeFolders,
- foldersType,
+ filteredType,
id,
- onSetBaseFolderPath,
- onSelectFolder,
- foldersList,
- withoutBasicSelection = false
+ passedFoldersTree = [],
+ hasSharedFolder
) => {
- const getRequestFolderTree = () => {
- switch (foldersType) {
- case "exceptSortedByTags":
- case "exceptPrivacyTrashFolders":
- try {
- return getFoldersTree();
- } catch (err) {
- console.error(err);
- }
- break;
- case "common":
- try {
- return getCommonFoldersTree();
- } catch (err) {
- console.error(err);
- }
- break;
-
- case "third-party":
- try {
- return getThirdPartyCommonFolderTree();
- } catch (err) {
- console.error(err);
- }
- break;
-
- default:
- try {
- return getFoldersTree();
- } catch (err) {
- console.error(err);
- }
- }
- };
-
const filterFoldersTree = (folders, arrayOfExceptions) => {
+ const arr = !hasSharedFolder
+ ? [...arrayOfExceptions, FolderType.Rooms]
+ : arrayOfExceptions;
+
let newArray = [];
for (let i = 0; i < folders.length; i++) {
- if (!arrayOfExceptions.includes(folders[i].rootFolderType)) {
+ if (!arr.includes(folders[i].rootFolderType)) {
newArray.push(folders[i]);
}
}
@@ -227,43 +196,27 @@ class SelectionPanel extends React.Component {
};
const getExceptionsFolders = (treeFolders) => {
- switch (foldersType) {
+ switch (filteredType) {
case "exceptSortedByTags":
return filterFoldersTree(treeFolders, exceptSortedByTagsFolders);
- case "exceptPrivacyTrashFolders":
- return filterFoldersTree(treeFolders, exceptPrivacyTrashFolders);
+ case "exceptPrivacyTrashArchiveFolders":
+ return filterFoldersTree(
+ treeFolders,
+ exceptPrivacyTrashArchiveFolders
+ );
}
};
- let requestedTreeFolders, filteredTreeFolders;
-
- const treeFoldersLength = treeFolders?.length;
-
- if (treeFoldersLength === 0 || !treeFoldersLength) {
- try {
- requestedTreeFolders = foldersList
- ? foldersList
- : await getRequestFolderTree();
- } catch (e) {
- toastr.error(e);
- return;
- }
- }
+ let filteredTreeFolders;
const foldersTree =
- treeFoldersLength > 0 ? treeFolders : requestedTreeFolders;
+ passedFoldersTree.length > 0 ? passedFoldersTree : treeFolders;
- const passedId = id ? id : foldersTree[0]?.id;
-
- !withoutBasicSelection &&
- onSetBaseFolderPath &&
- onSetBaseFolderPath(passedId);
-
- !withoutBasicSelection && onSelectFolder && onSelectFolder(passedId);
+ const passedId = id ? id : foldersTree[0].id;
if (
- foldersType === "exceptSortedByTags" ||
- foldersType === "exceptPrivacyTrashFolders"
+ filteredType === "exceptSortedByTags" ||
+ filteredType === "exceptPrivacyTrashArchiveFolders"
) {
filteredTreeFolders = getExceptionsFolders(foldersTree);
}
diff --git a/packages/client/src/pages/About/AboutContent.js b/packages/client/src/pages/About/AboutContent.js
index c195dd4eae..abd0f82a00 100644
--- a/packages/client/src/pages/About/AboutContent.js
+++ b/packages/client/src/pages/About/AboutContent.js
@@ -6,14 +6,14 @@ import NoUserSelect from "@docspace/components/utils/commonStyles";
import { useTranslation } from "react-i18next";
import styled from "styled-components";
import { ReactSVG } from "react-svg";
-import { isDesktop, isMobile } from "react-device-detect";
+import { isMobile } from "react-device-detect";
import { ColorTheme, ThemeType } from "@docspace/common/components/ColorTheme";
const StyledAboutBody = styled.div`
width: 100%;
.avatar {
- margin-top: ${isDesktop ? "0px" : "32px"};
+ margin-top: ${!isMobile ? "0px" : "32px"};
margin-bottom: 16px;
}
diff --git a/packages/client/src/pages/FormGallery/TilesView/FileTile.js b/packages/client/src/pages/FormGallery/TilesView/FileTile.js
index 3f371f5e98..09c91284aa 100644
--- a/packages/client/src/pages/FormGallery/TilesView/FileTile.js
+++ b/packages/client/src/pages/FormGallery/TilesView/FileTile.js
@@ -2,7 +2,7 @@ import React from "react";
import Tile from "./sub-components/Tile";
import { SimpleFilesTileContent } from "./StyledTileView";
import Link from "@docspace/components/link";
-import { isDesktop } from "react-device-detect";
+import { isMobile } from "react-device-detect";
const FileTile = (props) => {
const { item } = props;
@@ -16,7 +16,7 @@ const FileTile = (props) => {
containerWidth="100%"
type="page"
fontWeight="600"
- fontSize={isDesktop ? "13px" : "14px"}
+ fontSize={!isMobile ? "13px" : "14px"}
target="_blank"
isTextOverflow
>
diff --git a/packages/client/src/pages/FormGallery/TilesView/sub-components/Tile.js b/packages/client/src/pages/FormGallery/TilesView/sub-components/Tile.js
index 0e0d48d56b..670c118a48 100644
--- a/packages/client/src/pages/FormGallery/TilesView/sub-components/Tile.js
+++ b/packages/client/src/pages/FormGallery/TilesView/sub-components/Tile.js
@@ -66,13 +66,6 @@ class Tile extends React.PureComponent {
);
};
- onFileIconClick = () => {
- if (isDesktop) return;
-
- const { onSelect, item } = this.props;
- onSelect && onSelect(true, item);
- };
-
getContextModel = () => {
return [
{
@@ -153,7 +146,6 @@ class Tile extends React.PureComponent {
isSelected={isSelected}
onContextMenu={onContextMenu}
isActive={isActive}
- isDesktop={isDesktop}
showHotkeyBorder={showHotkeyBorder}
onDoubleClick={this.onCreateForm}
onClick={this.onSelectForm}
@@ -163,9 +155,7 @@ class Tile extends React.PureComponent {
-
- {element}
-
+
{element}
@@ -578,6 +580,7 @@ export default inject(
setAlreadyFetchingRooms,
categoryType,
+ isEmptyPage,
} = filesStore;
const {
@@ -676,6 +679,7 @@ export default inject(
enablePlugins,
setRestoreAllPanelVisible,
+ isEmptyPage,
};
}
)(
diff --git a/packages/client/src/pages/Home/index.js b/packages/client/src/pages/Home/index.js
index 64d4455255..767b652b6e 100644
--- a/packages/client/src/pages/Home/index.js
+++ b/packages/client/src/pages/Home/index.js
@@ -479,7 +479,7 @@ class PureHome extends React.Component {
showFilter,
frameConfig,
withPaging,
- isEmptyFilesList,
+ isEmptyPage,
} = this.props;
if (window.parent && !frameConfig) {
@@ -524,7 +524,7 @@ class PureHome extends React.Component {
)}
- {!isEmptyFilesList && (
+ {!isEmptyPage && (
+