Merge branch 'develop' into feature/oauth2-client
This commit is contained in:
commit
8f4ddba367
3
.github/codeql/config-codeql.yml
vendored
3
.github/codeql/config-codeql.yml
vendored
@ -1,3 +0,0 @@
|
||||
---
|
||||
paths:
|
||||
- ./**
|
||||
1
.github/workflows/codeql.yaml
vendored
1
.github/workflows/codeql.yaml
vendored
@ -56,7 +56,6 @@ jobs:
|
||||
uses: github/codeql-action/init@v2
|
||||
with:
|
||||
languages: ${{ matrix.language }}
|
||||
config-file: .github/codeql/config-codeql.yml
|
||||
# If you wish to specify custom queries, you can do so here or in a config file.
|
||||
# By default, queries listed here will override any specified in a config file.
|
||||
# Prefix the list here with "+" to use these queries and those in the config file.
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "docspace",
|
||||
"version": "2.5.1",
|
||||
"version": "2.6.0",
|
||||
"private": true,
|
||||
"workspaces": {
|
||||
"packages": [
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@docspace/client",
|
||||
"version": "2.5.1",
|
||||
"version": "2.6.0",
|
||||
"private": true,
|
||||
"homepage": "",
|
||||
"scripts": {
|
||||
|
||||
@ -6,7 +6,6 @@
|
||||
"Width": "Width",
|
||||
"Link": "Link",
|
||||
"DisplaySettings": "Display settings",
|
||||
"EmbeddingDescription": "Embed Public room into your website or blog. Apply additional display settings for customizing the embedded content.",
|
||||
"CodeSuccessfullyCopied": "Code to insert successfully copied to clipboard",
|
||||
"LinkProtectedWithPassword": "The link is protected with a password.",
|
||||
"ContentRestricted": "Content copying, file downloading and printing are restricted.",
|
||||
|
||||
@ -131,8 +131,8 @@ export default function withBadges(WrappedComponent) {
|
||||
|
||||
const file = {
|
||||
...options,
|
||||
ExtraLocationTitle: draftLocation.folderTitle,
|
||||
ExtraLocation: draftLocation.folderId,
|
||||
parentId: draftLocation.folderId,
|
||||
parentTitle: draftLocation.folderTitle,
|
||||
id: draftLocation.fileId,
|
||||
title: draftLocation.fileTitle,
|
||||
};
|
||||
|
||||
@ -23,9 +23,10 @@
|
||||
// All the Product's GUI elements, including illustrations and icon sets, as well as technical writing
|
||||
// content are licensed under the terms of the Creative Commons Attribution-ShareAlike 4.0
|
||||
// International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
|
||||
|
||||
import { useMemo } from "react";
|
||||
import { inject } from "mobx-react";
|
||||
import { withTranslation } from "react-i18next";
|
||||
import { decode } from "he";
|
||||
|
||||
import { Avatar } from "@docspace/shared/components/avatar";
|
||||
import { Text } from "@docspace/shared/components/text";
|
||||
@ -39,7 +40,10 @@ const ChangeRoomOwner = ({
|
||||
onOwnerChange,
|
||||
currentColorScheme,
|
||||
}) => {
|
||||
const userName = roomOwner.displayName ?? roomOwner.label;
|
||||
const userName = useMemo(
|
||||
() => decode(roomOwner.displayName ?? roomOwner.label),
|
||||
[roomOwner.displayName, roomOwner.label],
|
||||
);
|
||||
|
||||
return (
|
||||
<Styled.ChangeRoomOwner>
|
||||
|
||||
@ -32,13 +32,17 @@ import { Backdrop } from "@docspace/shared/components/backdrop";
|
||||
import PeopleSelector from "@docspace/shared/selectors/People";
|
||||
import { withTranslation } from "react-i18next";
|
||||
import Filter from "@docspace/shared/api/people/filter";
|
||||
import { EmployeeType, DeviceType } from "@docspace/shared/enums";
|
||||
import { EmployeeType } from "@docspace/shared/enums";
|
||||
import { Portal } from "@docspace/shared/components/portal";
|
||||
import { PRODUCT_NAME } from "@docspace/shared/constants";
|
||||
|
||||
const StyledChangeRoomOwner = styled.div`
|
||||
display: contents;
|
||||
|
||||
.change-owner_people-selector {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
${({ showBackButton }) =>
|
||||
!showBackButton &&
|
||||
css`
|
||||
@ -93,12 +97,7 @@ const ChangeRoomOwner = (props) => {
|
||||
if (e.keyCode === 13 || e.which === 13) onChangeRoomOwner();
|
||||
};
|
||||
|
||||
const onChangeRoomOwner = async (
|
||||
user,
|
||||
selectedAccess,
|
||||
newFooterInputValue,
|
||||
isChecked,
|
||||
) => {
|
||||
const onChangeRoomOwner = async (user, isChecked) => {
|
||||
if (showBackButton) {
|
||||
setRoomParams && setRoomParams(user[0]);
|
||||
} else {
|
||||
@ -164,16 +163,13 @@ const ChangeRoomOwner = (props) => {
|
||||
emptyScreenDescription={t("CreateEditRoomDialog:PeopleSelectorInfo", {
|
||||
productName: PRODUCT_NAME,
|
||||
})}
|
||||
className="change-owner_people-selector"
|
||||
/>
|
||||
</Aside>
|
||||
</StyledChangeRoomOwner>
|
||||
);
|
||||
|
||||
return currentDeviceType === DeviceType.mobile ? (
|
||||
<Portal visible={visible} element={asideComponent} />
|
||||
) : (
|
||||
asideComponent
|
||||
);
|
||||
return <Portal visible={visible} element={asideComponent} />;
|
||||
};
|
||||
|
||||
export default inject(
|
||||
|
||||
@ -57,11 +57,6 @@ const StyledBody = styled.div`
|
||||
}
|
||||
|
||||
.embedding-panel_body {
|
||||
.embedding-panel_description {
|
||||
color: ${({ theme }) => theme.embeddingPanel.descriptionTextColor};
|
||||
margin: 18px 0;
|
||||
}
|
||||
|
||||
.embedding-panel_bar {
|
||||
.embedding-panel_bar-header {
|
||||
display: flex;
|
||||
|
||||
@ -26,11 +26,12 @@
|
||||
|
||||
import { useState, useEffect, useCallback, useRef } from "react";
|
||||
import { inject, observer } from "mobx-react";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import { withTranslation, Trans } from "react-i18next";
|
||||
import copy from "copy-to-clipboard";
|
||||
import isEqual from "lodash/isEqual";
|
||||
import { objectToGetParams } from "@docspace/shared/utils/common";
|
||||
import { combineUrl } from "@docspace/shared/utils/combineUrl";
|
||||
import config from "PACKAGE_FILE";
|
||||
|
||||
import { Text } from "@docspace/shared/components/text";
|
||||
import { toastr } from "@docspace/shared/components/toast";
|
||||
@ -103,7 +104,7 @@ type EmbeddingPanelProps = {
|
||||
visible: boolean;
|
||||
setEmbeddingPanelData: (value: {
|
||||
visible: boolean;
|
||||
fileId?: string | number;
|
||||
itemId?: string | number;
|
||||
}) => void;
|
||||
setEditLinkPanelIsVisible: (value: boolean) => void;
|
||||
currentColorScheme: TColorScheme;
|
||||
@ -111,7 +112,8 @@ type EmbeddingPanelProps = {
|
||||
setLinkParams: (linkParams: LinkParamsType) => void;
|
||||
fetchExternalLinks: (roomId: string | number) => LinkParamsLinkType[];
|
||||
isAdmin: boolean;
|
||||
fileId?: string | number;
|
||||
itemId?: string | number;
|
||||
isRoom: boolean;
|
||||
};
|
||||
|
||||
type TOptionType = TOption & {
|
||||
@ -130,18 +132,17 @@ const EmbeddingPanelComponent = (props: EmbeddingPanelProps) => {
|
||||
setLinkParams,
|
||||
fetchExternalLinks,
|
||||
isAdmin,
|
||||
fileId,
|
||||
itemId,
|
||||
isRoom,
|
||||
} = props;
|
||||
|
||||
const { roomId, link } = linkParams;
|
||||
|
||||
const navigate = useNavigate();
|
||||
|
||||
const [sharedLinksOptions, setSharedLinksOptions] = useState<TOptionType[]>(
|
||||
[],
|
||||
);
|
||||
const [selectedLink, setSelectedLink] = useState<TOptionType>();
|
||||
const [barIsVisible, setBarIsVisible] = useState(!!fileId);
|
||||
const [barIsVisible, setBarIsVisible] = useState(true);
|
||||
const [isLoading, setIsLoading] = useState(false);
|
||||
|
||||
const dataDimensions = [
|
||||
@ -164,7 +165,7 @@ const EmbeddingPanelComponent = (props: EmbeddingPanelProps) => {
|
||||
height: `${heightValue}${dataDimensions[1].label}`,
|
||||
frameId: "ds-frame",
|
||||
init: true,
|
||||
id: fileId,
|
||||
id: itemId,
|
||||
};
|
||||
|
||||
const roomConfig = {
|
||||
@ -190,10 +191,14 @@ const EmbeddingPanelComponent = (props: EmbeddingPanelProps) => {
|
||||
},
|
||||
};
|
||||
|
||||
const [config, setConfig] = useState(fileId ? fileConfig : roomConfig);
|
||||
const isFile = itemId && !isRoom;
|
||||
|
||||
const params = objectToGetParams(config);
|
||||
const codeBlock = `<div id="${config.frameId}">Fallback text</div>\n<script src="${SDK_SCRIPT_URL}${params}"></script>`;
|
||||
const [embeddingConfig, setEmbeddingConfig] = useState(
|
||||
isFile ? fileConfig : roomConfig,
|
||||
);
|
||||
|
||||
const params = objectToGetParams(embeddingConfig);
|
||||
const codeBlock = `<div id="${embeddingConfig.frameId}">Fallback text</div>\n<script src="${SDK_SCRIPT_URL}${params}"></script>`;
|
||||
|
||||
const currentLink = selectedLink ?? link;
|
||||
|
||||
@ -217,7 +222,7 @@ const EmbeddingPanelComponent = (props: EmbeddingPanelProps) => {
|
||||
}
|
||||
|
||||
const showLinkBar =
|
||||
selectedLink?.sharedTo?.password || selectedLink?.sharedTo?.denyDownload;
|
||||
currentLink?.sharedTo?.password || currentLink?.sharedTo?.denyDownload;
|
||||
|
||||
const onClose = () => {
|
||||
setEmbeddingPanelData({ visible: false });
|
||||
@ -225,28 +230,28 @@ const EmbeddingPanelComponent = (props: EmbeddingPanelProps) => {
|
||||
|
||||
const onChangeWidth = (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||
setWidthValue(e.target.value);
|
||||
setConfig((config) => {
|
||||
setEmbeddingConfig((config) => {
|
||||
return { ...config, width: `${e.target.value}${widthDimension.label}` };
|
||||
});
|
||||
};
|
||||
|
||||
const onChangeHeight = (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||
setHeightValue(e.target.value);
|
||||
setConfig((config) => {
|
||||
setEmbeddingConfig((config) => {
|
||||
return { ...config, height: `${e.target.value}${heightDimension.label}` };
|
||||
});
|
||||
};
|
||||
|
||||
const onChangeWidthDimension = (item: TOption) => {
|
||||
setWidthDimension(item);
|
||||
setConfig((config) => {
|
||||
setEmbeddingConfig((config) => {
|
||||
return { ...config, width: `${widthValue}${item.label}` };
|
||||
});
|
||||
};
|
||||
|
||||
const onChangeHeightDimension = (item: TOption) => {
|
||||
setHeightDimension(item);
|
||||
setConfig((config) => {
|
||||
setEmbeddingConfig((config) => {
|
||||
return { ...config, height: `${heightValue}${item.label}` };
|
||||
});
|
||||
};
|
||||
@ -257,13 +262,13 @@ const EmbeddingPanelComponent = (props: EmbeddingPanelProps) => {
|
||||
};
|
||||
|
||||
const onHeaderChange = () => {
|
||||
setConfig((config) => {
|
||||
setEmbeddingConfig((config) => {
|
||||
return { ...config, showTitle: !config.showTitle };
|
||||
});
|
||||
};
|
||||
|
||||
const onTitleChange = () => {
|
||||
setConfig((config) => {
|
||||
setEmbeddingConfig((config) => {
|
||||
return { ...config, showFilter: !config.showFilter };
|
||||
});
|
||||
};
|
||||
@ -280,7 +285,7 @@ const EmbeddingPanelComponent = (props: EmbeddingPanelProps) => {
|
||||
|
||||
const onChangeSharedLink = (item: TOptionType) => {
|
||||
setSelectedLink(item);
|
||||
setConfig((config) => {
|
||||
setEmbeddingConfig((config) => {
|
||||
return { ...config, requestToken: item?.sharedTo?.requestToken };
|
||||
});
|
||||
};
|
||||
@ -290,8 +295,14 @@ const EmbeddingPanelComponent = (props: EmbeddingPanelProps) => {
|
||||
};
|
||||
|
||||
const onOpenDevTools = () => {
|
||||
navigate("/portal-settings/developer-tools");
|
||||
onClose();
|
||||
const url = combineUrl(
|
||||
window.location.origin,
|
||||
window.ClientConfig?.proxy?.url,
|
||||
config.homepage,
|
||||
"/portal-settings/developer-tools",
|
||||
);
|
||||
|
||||
window.open(url, "_blank");
|
||||
};
|
||||
|
||||
const onKeyPress = (e: KeyboardEvent) => {
|
||||
@ -332,10 +343,10 @@ const EmbeddingPanelComponent = (props: EmbeddingPanelProps) => {
|
||||
}, [roomId, fetchExternalLinks]);
|
||||
|
||||
useEffect(() => {
|
||||
if (fileId) {
|
||||
if (itemId) {
|
||||
getLinks();
|
||||
}
|
||||
}, [fileId, getLinks]);
|
||||
}, [itemId, getLinks]);
|
||||
|
||||
const usePrevious = (value: LinkParamsLinkType | null) => {
|
||||
const ref = useRef<LinkParamsLinkType | null>();
|
||||
@ -393,6 +404,7 @@ const EmbeddingPanelComponent = (props: EmbeddingPanelProps) => {
|
||||
<StyledModalDialog
|
||||
visible={visible}
|
||||
onClose={onClose}
|
||||
withBodyScroll
|
||||
displayType={ModalDialogType.aside}
|
||||
>
|
||||
<ModalDialog.Header>{t("Files:EmbeddingSettings")}</ModalDialog.Header>
|
||||
@ -431,12 +443,6 @@ const EmbeddingPanelComponent = (props: EmbeddingPanelProps) => {
|
||||
</div>
|
||||
)}
|
||||
<div className="embedding-panel_body">
|
||||
{!fileId && (
|
||||
<Text fontSize="12px" className="embedding-panel_description">
|
||||
{t("EmbeddingPanel:EmbeddingDescription")}
|
||||
</Text>
|
||||
)}
|
||||
|
||||
{sharedLinksOptions && sharedLinksOptions.length > 1 && (
|
||||
<>
|
||||
<Text
|
||||
@ -492,7 +498,7 @@ const EmbeddingPanelComponent = (props: EmbeddingPanelProps) => {
|
||||
/>
|
||||
</div>
|
||||
|
||||
{!fileId && (
|
||||
{!isFile && (
|
||||
<>
|
||||
<Text
|
||||
className="embedding-panel_header-text"
|
||||
@ -506,7 +512,7 @@ const EmbeddingPanelComponent = (props: EmbeddingPanelProps) => {
|
||||
<CheckboxElement
|
||||
label={t("Common:Title")}
|
||||
onChange={onHeaderChange}
|
||||
isChecked={config.showTitle}
|
||||
isChecked={embeddingConfig.showTitle}
|
||||
img={theme.isBase ? HeaderUrl : HeaderDarkUrl}
|
||||
title={t("JavascriptSdk:Header")}
|
||||
description={t("JavascriptSdk:HeaderDescription")}
|
||||
@ -514,7 +520,7 @@ const EmbeddingPanelComponent = (props: EmbeddingPanelProps) => {
|
||||
<CheckboxElement
|
||||
label={t("JavascriptSdk:SearchFilterAndSort")}
|
||||
onChange={onTitleChange}
|
||||
isChecked={config.showFilter}
|
||||
isChecked={embeddingConfig.showFilter}
|
||||
img={theme.isBase ? SearchUrl : SearchDarkUrl}
|
||||
title={t("JavascriptSdk:SearchBlock")}
|
||||
description={t(
|
||||
@ -567,18 +573,8 @@ const EmbeddingPanelComponent = (props: EmbeddingPanelProps) => {
|
||||
);
|
||||
};
|
||||
|
||||
export default inject(
|
||||
({
|
||||
dialogsStore,
|
||||
settingsStore,
|
||||
userStore,
|
||||
publicRoomStore,
|
||||
}: {
|
||||
dialogsStore: DialogsStore;
|
||||
settingsStore: SettingsStore;
|
||||
userStore: UserStore;
|
||||
publicRoomStore: PublicRoomStore;
|
||||
}) => {
|
||||
export default inject<TStore>(
|
||||
({ dialogsStore, settingsStore, userStore, publicRoomStore }) => {
|
||||
const {
|
||||
embeddingPanelData,
|
||||
setEmbeddingPanelData,
|
||||
@ -594,7 +590,8 @@ export default inject(
|
||||
theme,
|
||||
currentColorScheme,
|
||||
visible: embeddingPanelData.visible,
|
||||
fileId: embeddingPanelData.fileId,
|
||||
itemId: embeddingPanelData.item?.id,
|
||||
isRoom: embeddingPanelData.item?.isRoom,
|
||||
setEmbeddingPanelData,
|
||||
setEditLinkPanelIsVisible,
|
||||
linkParams,
|
||||
|
||||
@ -24,16 +24,13 @@
|
||||
// content are licensed under the terms of the Creative Commons Attribution-ShareAlike 4.0
|
||||
// International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
|
||||
|
||||
import { useRef, useEffect } from "react";
|
||||
import { useRef } from "react";
|
||||
import { withTranslation } from "react-i18next";
|
||||
import { inject, observer } from "mobx-react";
|
||||
import styled from "styled-components";
|
||||
import { ContextMenu } from "@docspace/shared/components/context-menu";
|
||||
import { ContextMenuButton } from "@docspace/shared/components/context-menu-button";
|
||||
|
||||
const generalKeys = ["select", "show-info"];
|
||||
const roomKeys = ["separator0", "room-info"];
|
||||
|
||||
const StyledItemContextOptions = styled.div`
|
||||
height: 16px;
|
||||
margin: ${({ theme }) =>
|
||||
@ -45,7 +42,6 @@ const RoomsContextBtn = ({
|
||||
selection,
|
||||
itemTitleRef,
|
||||
|
||||
getItemContextOptionsKeys,
|
||||
getItemContextOptionsActions,
|
||||
onSelectItem,
|
||||
}) => {
|
||||
@ -62,37 +58,7 @@ const RoomsContextBtn = ({
|
||||
};
|
||||
|
||||
const getData = () => {
|
||||
let item = { ...selection };
|
||||
if (!selection.contextOptions) {
|
||||
const contextOptions = getItemContextOptionsKeys(selection, true);
|
||||
item = { ...item, contextOptions };
|
||||
}
|
||||
|
||||
const options = getItemContextOptionsActions(item, t, true);
|
||||
|
||||
const removeOptionByKey = (key) => {
|
||||
const idx = options.findIndex((o) => o.key === key);
|
||||
if (idx !== -1) options.splice(idx, 1);
|
||||
};
|
||||
|
||||
generalKeys.forEach((key) => removeOptionByKey(key));
|
||||
if (selection.isRoom) roomKeys.forEach((key) => removeOptionByKey(key));
|
||||
|
||||
options.forEach((item, index) => {
|
||||
const isSeparator = item.key.includes("separator");
|
||||
const isFirst = index === options.length - 1;
|
||||
const isLast = index === 0;
|
||||
const nextItem = isLast ? null : options[index + 1];
|
||||
const nextIsSeparator = nextItem && nextItem.key.includes("separator");
|
||||
if (
|
||||
(isFirst && isSeparator) ||
|
||||
(isLast && isSeparator) ||
|
||||
(isSeparator && nextIsSeparator)
|
||||
)
|
||||
options.splice(index, 1);
|
||||
});
|
||||
|
||||
return options;
|
||||
return getItemContextOptionsActions(selection, t, true);
|
||||
};
|
||||
|
||||
return (
|
||||
@ -120,8 +86,7 @@ const RoomsContextBtn = ({
|
||||
);
|
||||
};
|
||||
|
||||
export default inject(({ filesStore, contextOptionsStore }) => ({
|
||||
getItemContextOptionsKeys: filesStore.getFilesContextOptions,
|
||||
export default inject(({ contextOptionsStore }) => ({
|
||||
getItemContextOptionsActions: contextOptionsStore.getFilesContextOptions,
|
||||
}))(
|
||||
withTranslation([
|
||||
|
||||
@ -386,6 +386,8 @@ const InsideGroupTableRow = (props) => {
|
||||
modernView
|
||||
manualWidth={"fit-content"}
|
||||
isLoading={isLoading}
|
||||
optionStyle={{ maxWidth: "400px" }}
|
||||
textOverflow
|
||||
/>
|
||||
);
|
||||
|
||||
|
||||
@ -390,6 +390,8 @@ const PeopleTableRow = (props) => {
|
||||
modernView
|
||||
manualWidth={"fit-content"}
|
||||
isLoading={isLoading}
|
||||
optionStyle={{ maxWidth: "400px" }}
|
||||
textOverflow
|
||||
/>
|
||||
);
|
||||
|
||||
|
||||
@ -283,7 +283,7 @@ const FilesRowContent = ({
|
||||
return value;
|
||||
}
|
||||
|
||||
if (!fileExst && !contentLength && !providerKey && !isMobile())
|
||||
if (!fileExst && !contentLength && !providerKey)
|
||||
return `${foldersCount} ${t("Translations:Folders")} | ${filesCount} ${t(
|
||||
"Translations:Files",
|
||||
)}`;
|
||||
@ -323,15 +323,17 @@ const FilesRowContent = ({
|
||||
{!isRoom && !isRooms && quickButtons}
|
||||
</div>
|
||||
|
||||
<Text
|
||||
containerMinWidth="200px"
|
||||
containerWidth="15%"
|
||||
fontSize="12px"
|
||||
fontWeight={400}
|
||||
className="row_update-text"
|
||||
>
|
||||
{mainInfo}
|
||||
</Text>
|
||||
{mainInfo && (
|
||||
<Text
|
||||
containerMinWidth="200px"
|
||||
containerWidth="15%"
|
||||
fontSize="12px"
|
||||
fontWeight={400}
|
||||
className="row_update-text"
|
||||
>
|
||||
{mainInfo}
|
||||
</Text>
|
||||
)}
|
||||
|
||||
<Text
|
||||
containerMinWidth="90px"
|
||||
|
||||
@ -323,6 +323,12 @@ const StyledTableRow = styled(TableRow)`
|
||||
`}
|
||||
}
|
||||
`}
|
||||
|
||||
.no-extra-space {
|
||||
p {
|
||||
margin-right: 0px !important;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const StyledDragAndDrop = styled(DragAndDrop)`
|
||||
|
||||
@ -111,7 +111,7 @@ class FilesTableHeader extends React.Component {
|
||||
key: "QuickButtons",
|
||||
title: "",
|
||||
enable: this.props.roomColumnQuickButtonsIsEnabled,
|
||||
defaultSize: 75,
|
||||
defaultSize: 52,
|
||||
resizable: false,
|
||||
},
|
||||
];
|
||||
@ -201,7 +201,7 @@ class FilesTableHeader extends React.Component {
|
||||
key: "QuickButtons",
|
||||
title: "",
|
||||
enable: this.props.quickButtonsColumnIsEnabled,
|
||||
defaultSize: 75,
|
||||
defaultSize: 52,
|
||||
resizable: false,
|
||||
},
|
||||
];
|
||||
@ -280,7 +280,7 @@ class FilesTableHeader extends React.Component {
|
||||
key: "QuickButtons",
|
||||
title: "",
|
||||
enable: this.props.quickButtonsColumnIsEnabled,
|
||||
defaultSize: 75,
|
||||
defaultSize: 52,
|
||||
resizable: false,
|
||||
},
|
||||
];
|
||||
@ -350,7 +350,7 @@ class FilesTableHeader extends React.Component {
|
||||
key: "QuickButtons",
|
||||
title: "",
|
||||
enable: this.props.quickButtonsColumnIsEnabled,
|
||||
defaultSize: 75,
|
||||
defaultSize: 52,
|
||||
resizable: false,
|
||||
},
|
||||
];
|
||||
|
||||
@ -32,7 +32,7 @@ import TypeCell from "./TypeCell";
|
||||
import AuthorCell from "./AuthorCell";
|
||||
import DateCell from "./DateCell";
|
||||
import SizeCell from "./SizeCell";
|
||||
import { classNames } from "@docspace/shared/utils";
|
||||
import { classNames, getLastColumn } from "@docspace/shared/utils";
|
||||
import {
|
||||
StyledBadgesContainer,
|
||||
StyledQuickButtonsContainer,
|
||||
@ -59,8 +59,11 @@ const RecentRowDataComponent = (props) => {
|
||||
showHotkeyBorder,
|
||||
badgesComponent,
|
||||
quickButtonsComponent,
|
||||
tableStorageName,
|
||||
} = props;
|
||||
|
||||
const lastColumn = getLastColumn(tableStorageName);
|
||||
|
||||
return (
|
||||
<>
|
||||
<TableCell
|
||||
@ -90,6 +93,10 @@ const RecentRowDataComponent = (props) => {
|
||||
!authorColumnIsEnabled ? { background: "none" } : dragStyles.style
|
||||
}
|
||||
{...selectionProp}
|
||||
className={classNames(
|
||||
selectionProp?.className,
|
||||
lastColumn === "Author" ? "no-extra-space" : "",
|
||||
)}
|
||||
>
|
||||
<AuthorCell
|
||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||
@ -108,6 +115,10 @@ const RecentRowDataComponent = (props) => {
|
||||
: dragStyles.style
|
||||
}
|
||||
{...selectionProp}
|
||||
className={classNames(
|
||||
selectionProp?.className,
|
||||
lastColumn === "Created" ? "no-extra-space" : "",
|
||||
)}
|
||||
>
|
||||
<DateCell
|
||||
create
|
||||
@ -127,6 +138,10 @@ const RecentRowDataComponent = (props) => {
|
||||
: dragStyles.style
|
||||
}
|
||||
{...selectionProp}
|
||||
className={classNames(
|
||||
selectionProp?.className,
|
||||
lastColumn === "LastOpened" ? "no-extra-space" : "",
|
||||
)}
|
||||
>
|
||||
<DateCell
|
||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||
@ -143,6 +158,10 @@ const RecentRowDataComponent = (props) => {
|
||||
!modifiedColumnIsEnabled ? { background: "none" } : dragStyles.style
|
||||
}
|
||||
{...selectionProp}
|
||||
className={classNames(
|
||||
selectionProp?.className,
|
||||
lastColumn === "Modified" ? "no-extra-space" : "",
|
||||
)}
|
||||
>
|
||||
<DateCell
|
||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||
@ -159,6 +178,10 @@ const RecentRowDataComponent = (props) => {
|
||||
!sizeColumnIsEnabled ? { background: "none" } : dragStyles.style
|
||||
}
|
||||
{...selectionProp}
|
||||
className={classNames(
|
||||
selectionProp?.className,
|
||||
lastColumn === "Size" ? "no-extra-space" : "",
|
||||
)}
|
||||
>
|
||||
<SizeCell
|
||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||
@ -177,6 +200,10 @@ const RecentRowDataComponent = (props) => {
|
||||
: dragStyles.style
|
||||
}
|
||||
{...selectionProp}
|
||||
className={classNames(
|
||||
selectionProp?.className,
|
||||
lastColumn === "Type" ? "no-extra-space" : "",
|
||||
)}
|
||||
>
|
||||
<TypeCell
|
||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||
@ -219,6 +246,7 @@ export default inject(({ tableStore }) => {
|
||||
typeColumnIsEnabled,
|
||||
quickButtonsColumnIsEnabled,
|
||||
lastOpenedColumnIsEnabled,
|
||||
tableStorageName,
|
||||
} = tableStore;
|
||||
|
||||
return {
|
||||
@ -229,5 +257,6 @@ export default inject(({ tableStore }) => {
|
||||
typeColumnIsEnabled,
|
||||
quickButtonsColumnIsEnabled,
|
||||
lastOpenedColumnIsEnabled,
|
||||
tableStorageName,
|
||||
};
|
||||
})(observer(RecentRowDataComponent));
|
||||
|
||||
@ -32,7 +32,7 @@ import TypeCell from "./TypeCell";
|
||||
import TagsCell from "./TagsCell";
|
||||
import AuthorCell from "./AuthorCell";
|
||||
import DateCell from "./DateCell";
|
||||
import { classNames } from "@docspace/shared/utils";
|
||||
import { classNames, getLastColumn } from "@docspace/shared/utils";
|
||||
import { StyledBadgesContainer } from "../StyledTable";
|
||||
import { StyledQuickButtonsContainer } from "../StyledTable";
|
||||
import SpaceQuota from "SRC_DIR/components/SpaceQuota";
|
||||
@ -59,8 +59,11 @@ const RoomsRowDataComponent = (props) => {
|
||||
badgesComponent,
|
||||
quickButtonsComponent,
|
||||
item,
|
||||
tableStorageName,
|
||||
} = props;
|
||||
|
||||
const lastColumn = getLastColumn(tableStorageName);
|
||||
|
||||
return (
|
||||
<>
|
||||
<TableCell
|
||||
@ -92,6 +95,10 @@ const RoomsRowDataComponent = (props) => {
|
||||
: dragStyles.style
|
||||
}
|
||||
{...selectionProp}
|
||||
className={classNames(
|
||||
selectionProp?.className,
|
||||
lastColumn === "Type" ? "no-extra-space" : "",
|
||||
)}
|
||||
>
|
||||
<TypeCell
|
||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||
@ -128,6 +135,10 @@ const RoomsRowDataComponent = (props) => {
|
||||
: dragStyles.style
|
||||
}
|
||||
{...selectionProp}
|
||||
className={classNames(
|
||||
selectionProp?.className,
|
||||
lastColumn === "Owner" ? "no-extra-space" : "",
|
||||
)}
|
||||
>
|
||||
<AuthorCell
|
||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||
@ -146,6 +157,10 @@ const RoomsRowDataComponent = (props) => {
|
||||
: dragStyles.style
|
||||
}
|
||||
{...selectionProp}
|
||||
className={classNames(
|
||||
selectionProp?.className,
|
||||
lastColumn === "Activity" ? "no-extra-space" : "",
|
||||
)}
|
||||
>
|
||||
<DateCell
|
||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||
@ -200,6 +215,7 @@ export default inject(({ currentQuotaStore, tableStore }) => {
|
||||
roomColumnTagsIsEnabled,
|
||||
roomColumnActivityIsEnabled,
|
||||
roomQuotaColumnIsEnable,
|
||||
tableStorageName,
|
||||
} = tableStore;
|
||||
|
||||
const { showStorageInfo } = currentQuotaStore;
|
||||
@ -211,5 +227,6 @@ export default inject(({ currentQuotaStore, tableStore }) => {
|
||||
roomColumnTagsIsEnabled,
|
||||
roomColumnActivityIsEnabled,
|
||||
showStorageInfo,
|
||||
tableStorageName,
|
||||
};
|
||||
})(observer(RoomsRowDataComponent));
|
||||
|
||||
@ -32,7 +32,7 @@ import TypeCell from "./TypeCell";
|
||||
import AuthorCell from "./AuthorCell";
|
||||
import DateCell from "./DateCell";
|
||||
import SizeCell from "./SizeCell";
|
||||
import { classNames } from "@docspace/shared/utils";
|
||||
import { classNames, getLastColumn } from "@docspace/shared/utils";
|
||||
import {
|
||||
StyledBadgesContainer,
|
||||
StyledQuickButtonsContainer,
|
||||
@ -58,8 +58,11 @@ const RowDataComponent = (props) => {
|
||||
showHotkeyBorder,
|
||||
badgesComponent,
|
||||
quickButtonsComponent,
|
||||
tableStorageName,
|
||||
} = props;
|
||||
|
||||
const lastColumn = getLastColumn(tableStorageName);
|
||||
|
||||
return (
|
||||
<>
|
||||
<TableCell
|
||||
@ -89,6 +92,10 @@ const RowDataComponent = (props) => {
|
||||
!authorColumnIsEnabled ? { background: "none" } : dragStyles.style
|
||||
}
|
||||
{...selectionProp}
|
||||
className={classNames(
|
||||
selectionProp?.className,
|
||||
lastColumn === "Author" ? "no-extra-space" : "",
|
||||
)}
|
||||
>
|
||||
<AuthorCell
|
||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||
@ -107,6 +114,10 @@ const RowDataComponent = (props) => {
|
||||
: dragStyles.style
|
||||
}
|
||||
{...selectionProp}
|
||||
className={classNames(
|
||||
selectionProp?.className,
|
||||
lastColumn === "Created" ? "no-extra-space" : "",
|
||||
)}
|
||||
>
|
||||
<DateCell
|
||||
create
|
||||
@ -124,6 +135,10 @@ const RowDataComponent = (props) => {
|
||||
!modifiedColumnIsEnabled ? { background: "none" } : dragStyles.style
|
||||
}
|
||||
{...selectionProp}
|
||||
className={classNames(
|
||||
selectionProp?.className,
|
||||
lastColumn === "Modified" ? "no-extra-space" : "",
|
||||
)}
|
||||
>
|
||||
<DateCell
|
||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||
@ -140,6 +155,10 @@ const RowDataComponent = (props) => {
|
||||
!sizeColumnIsEnabled ? { background: "none" } : dragStyles.style
|
||||
}
|
||||
{...selectionProp}
|
||||
className={classNames(
|
||||
selectionProp?.className,
|
||||
lastColumn === "Size" ? "no-extra-space" : "",
|
||||
)}
|
||||
>
|
||||
<SizeCell
|
||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||
@ -158,6 +177,10 @@ const RowDataComponent = (props) => {
|
||||
: dragStyles.style
|
||||
}
|
||||
{...selectionProp}
|
||||
className={classNames(
|
||||
selectionProp?.className,
|
||||
lastColumn === "Type" ? "no-extra-space" : "",
|
||||
)}
|
||||
>
|
||||
<TypeCell
|
||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||
@ -199,6 +222,7 @@ export default inject(({ tableStore }) => {
|
||||
sizeColumnIsEnabled,
|
||||
typeColumnIsEnabled,
|
||||
quickButtonsColumnIsEnabled,
|
||||
tableStorageName,
|
||||
} = tableStore;
|
||||
|
||||
return {
|
||||
@ -208,5 +232,6 @@ export default inject(({ tableStore }) => {
|
||||
sizeColumnIsEnabled,
|
||||
typeColumnIsEnabled,
|
||||
quickButtonsColumnIsEnabled,
|
||||
tableStorageName,
|
||||
};
|
||||
})(observer(RowDataComponent));
|
||||
|
||||
@ -32,7 +32,7 @@ import TypeCell from "./TypeCell";
|
||||
import AuthorCell from "./AuthorCell";
|
||||
import DateCell from "./DateCell";
|
||||
import SizeCell from "./SizeCell";
|
||||
import { classNames } from "@docspace/shared/utils";
|
||||
import { classNames, getLastColumn } from "@docspace/shared/utils";
|
||||
import {
|
||||
StyledBadgesContainer,
|
||||
StyledQuickButtonsContainer,
|
||||
@ -61,8 +61,11 @@ const TrashRowDataComponent = (props) => {
|
||||
showHotkeyBorder,
|
||||
badgesComponent,
|
||||
quickButtonsComponent,
|
||||
tableStorageName,
|
||||
} = props;
|
||||
|
||||
const lastColumn = getLastColumn(tableStorageName);
|
||||
|
||||
return (
|
||||
<>
|
||||
<TableCell
|
||||
@ -92,6 +95,10 @@ const TrashRowDataComponent = (props) => {
|
||||
!roomColumnIsEnabled ? { background: "none" } : dragStyles.style
|
||||
}
|
||||
{...selectionProp}
|
||||
className={classNames(
|
||||
selectionProp?.className,
|
||||
lastColumn === "Room" ? "no-extra-space" : "",
|
||||
)}
|
||||
>
|
||||
<RoomCell
|
||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||
@ -110,6 +117,10 @@ const TrashRowDataComponent = (props) => {
|
||||
: dragStyles.style
|
||||
}
|
||||
{...selectionProp}
|
||||
className={classNames(
|
||||
selectionProp?.className,
|
||||
lastColumn === "AuthorTrash" ? "no-extra-space" : "",
|
||||
)}
|
||||
>
|
||||
<AuthorCell
|
||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||
@ -128,6 +139,10 @@ const TrashRowDataComponent = (props) => {
|
||||
: dragStyles.style
|
||||
}
|
||||
{...selectionProp}
|
||||
className={classNames(
|
||||
selectionProp?.className,
|
||||
lastColumn === "CreatedTrash" ? "no-extra-space" : "",
|
||||
)}
|
||||
>
|
||||
<DateCell
|
||||
create
|
||||
@ -145,6 +160,10 @@ const TrashRowDataComponent = (props) => {
|
||||
!erasureColumnIsEnabled ? { background: "none" } : dragStyles.style
|
||||
}
|
||||
{...selectionProp}
|
||||
className={classNames(
|
||||
selectionProp?.className,
|
||||
lastColumn === "Erasure" ? "no-extra-space" : "",
|
||||
)}
|
||||
>
|
||||
<ErasureCell
|
||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||
@ -163,6 +182,10 @@ const TrashRowDataComponent = (props) => {
|
||||
: dragStyles.style
|
||||
}
|
||||
{...selectionProp}
|
||||
className={classNames(
|
||||
selectionProp?.className,
|
||||
lastColumn === "SizeTrash" ? "no-extra-space" : "",
|
||||
)}
|
||||
>
|
||||
<SizeCell
|
||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||
@ -181,6 +204,10 @@ const TrashRowDataComponent = (props) => {
|
||||
: dragStyles.style
|
||||
}
|
||||
{...selectionProp}
|
||||
className={classNames(
|
||||
selectionProp?.className,
|
||||
lastColumn === "TypeTrash" ? "no-extra-space" : "",
|
||||
)}
|
||||
>
|
||||
<TypeCell
|
||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||
@ -223,6 +250,7 @@ export default inject(({ tableStore }) => {
|
||||
sizeTrashColumnIsEnabled,
|
||||
typeTrashColumnIsEnabled,
|
||||
quickButtonsColumnIsEnabled,
|
||||
tableStorageName,
|
||||
} = tableStore;
|
||||
|
||||
return {
|
||||
@ -233,5 +261,6 @@ export default inject(({ tableStore }) => {
|
||||
sizeTrashColumnIsEnabled,
|
||||
typeTrashColumnIsEnabled,
|
||||
quickButtonsColumnIsEnabled,
|
||||
tableStorageName,
|
||||
};
|
||||
})(observer(TrashRowDataComponent));
|
||||
|
||||
@ -155,6 +155,14 @@ const SectionBodyContent = (props) => {
|
||||
}
|
||||
};
|
||||
|
||||
const isHeaderOptionButton = (event) => {
|
||||
const parent = document.querySelector("#header_optional-button");
|
||||
|
||||
if (!parent || !event.target) return false;
|
||||
|
||||
return parent.contains(event.target);
|
||||
};
|
||||
|
||||
const onMouseDown = (e) => {
|
||||
if (
|
||||
(e.target.closest(".scroll-body") &&
|
||||
@ -165,7 +173,8 @@ const SectionBodyContent = (props) => {
|
||||
!e.target.closest(".document-catalog")) ||
|
||||
e.target.closest(".files-main-button") ||
|
||||
e.target.closest(".add-button") ||
|
||||
e.target.closest("#filter_search-input")
|
||||
e.target.closest("#filter_search-input") ||
|
||||
isHeaderOptionButton(e)
|
||||
) {
|
||||
setSelection([]);
|
||||
setBufferSelection(null);
|
||||
|
||||
@ -24,63 +24,32 @@
|
||||
// content are licensed under the terms of the Creative Commons Attribution-ShareAlike 4.0
|
||||
// International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
|
||||
|
||||
import ClearTrashReactSvgUrl from "PUBLIC_DIR/images/clear.trash.react.svg?url";
|
||||
import ReconnectSvgUrl from "PUBLIC_DIR/images/reconnect.svg?url";
|
||||
import SettingsReactSvgUrl from "PUBLIC_DIR/images/catalog.settings.react.svg?url";
|
||||
import CopyToReactSvgUrl from "PUBLIC_DIR/images/copyTo.react.svg?url";
|
||||
import DownloadReactSvgUrl from "PUBLIC_DIR/images/download.react.svg?url";
|
||||
import MoveReactSvgUrl from "PUBLIC_DIR/images/move.react.svg?url";
|
||||
import RenameReactSvgUrl from "PUBLIC_DIR/images/rename.react.svg?url";
|
||||
import ShareReactSvgUrl from "PUBLIC_DIR/images/share.react.svg?url";
|
||||
import InvitationLinkReactSvgUrl from "PUBLIC_DIR/images/invitation.link.react.svg?url";
|
||||
import InfoOutlineReactSvgUrl from "PUBLIC_DIR/images/info.outline.react.svg?url";
|
||||
import PersonReactSvgUrl from "PUBLIC_DIR/images/person.react.svg?url";
|
||||
|
||||
import RoomArchiveSvgUrl from "PUBLIC_DIR/images/room.archive.svg?url";
|
||||
import CopyReactSvgUrl from "PUBLIC_DIR/images/copy.react.svg?url";
|
||||
import CatalogTrashReactSvgUrl from "PUBLIC_DIR/images/catalog.trash.react.svg?url";
|
||||
|
||||
import PublicRoomIconUrl from "PUBLIC_DIR/images/public-room.react.svg?url";
|
||||
|
||||
import LeaveRoomSvgUrl from "PUBLIC_DIR/images/logout.react.svg?url";
|
||||
import CatalogRoomsReactSvgUrl from "PUBLIC_DIR/images/catalog.rooms.react.svg?url";
|
||||
import TabletLinkReactSvgUrl from "PUBLIC_DIR/images/tablet-link.react.svg?url";
|
||||
|
||||
import React from "react";
|
||||
import { inject, observer } from "mobx-react";
|
||||
import { withTranslation } from "react-i18next";
|
||||
import styled, { css } from "styled-components";
|
||||
import copy from "copy-to-clipboard";
|
||||
import { useNavigate, useLocation, useParams } from "react-router-dom";
|
||||
|
||||
import { useLocation, useParams } from "react-router-dom";
|
||||
import { SectionHeaderSkeleton } from "@docspace/shared/skeletons/sections";
|
||||
import Navigation from "@docspace/shared/components/navigation";
|
||||
import FilesFilter from "@docspace/shared/api/files/filter";
|
||||
|
||||
import { DropDownItem } from "@docspace/shared/components/drop-down-item";
|
||||
import { tablet, mobile, Consumer, getLogoUrl } from "@docspace/shared/utils";
|
||||
|
||||
import { toastr } from "@docspace/shared/components/toast";
|
||||
import { TableGroupMenu } from "@docspace/shared/components/table";
|
||||
import {
|
||||
Events,
|
||||
RoomsType,
|
||||
DeviceType,
|
||||
FolderType,
|
||||
ShareAccessRights,
|
||||
FilesSelectorFilterTypes,
|
||||
WhiteLabelLogoType,
|
||||
} from "@docspace/shared/enums";
|
||||
|
||||
import { copyShareLink } from "@docspace/shared/utils/copy";
|
||||
|
||||
import { CategoryType } from "SRC_DIR/helpers/constants";
|
||||
import {
|
||||
getCategoryTypeByFolderType,
|
||||
getCategoryUrl,
|
||||
} from "SRC_DIR/helpers/utils";
|
||||
import TariffBar from "SRC_DIR/components/TariffBar";
|
||||
import { PRODUCT_NAME } from "@docspace/shared/constants";
|
||||
|
||||
const StyledContainer = styled.div`
|
||||
width: 100%;
|
||||
@ -180,16 +149,12 @@ const StyledContainer = styled.div`
|
||||
|
||||
const SectionHeaderContent = (props) => {
|
||||
const {
|
||||
currentFolderId,
|
||||
currentGroup,
|
||||
insideGroupTempTitle,
|
||||
getGroupContextOptions,
|
||||
t,
|
||||
isRoomsFolder,
|
||||
security,
|
||||
setIsFolderActions,
|
||||
setBufferSelection,
|
||||
setMoveToPanelVisible,
|
||||
tReady,
|
||||
isInfoPanelVisible,
|
||||
isRootFolder,
|
||||
@ -213,26 +178,7 @@ const SectionHeaderContent = (props) => {
|
||||
isGroupMenuBlocked,
|
||||
|
||||
onClickBack,
|
||||
activeFiles,
|
||||
activeFolders,
|
||||
selectedFolder,
|
||||
setCopyPanelVisible,
|
||||
setSharingPanelVisible,
|
||||
deleteAction,
|
||||
confirmDelete,
|
||||
setDeleteDialogVisible,
|
||||
isThirdPartySelection,
|
||||
|
||||
getFolderInfo,
|
||||
|
||||
setEmptyTrashDialogVisible,
|
||||
setRestoreAllPanelVisible,
|
||||
isGracePeriod,
|
||||
setInviteUsersWarningDialogVisible,
|
||||
setRestoreAllArchive,
|
||||
setRestoreRoomDialogVisible,
|
||||
onCopyLink,
|
||||
setShareFolderDialogVisible,
|
||||
|
||||
setSelected,
|
||||
cbMenuItems,
|
||||
@ -257,42 +203,29 @@ const SectionHeaderContent = (props) => {
|
||||
setAccountsSelected,
|
||||
setGroupsSelected,
|
||||
isRoomAdmin,
|
||||
isCollaborator,
|
||||
isEmptyPage,
|
||||
|
||||
isLoading,
|
||||
|
||||
emptyTrashInProgress,
|
||||
categoryType,
|
||||
isPublicRoom,
|
||||
isFormRoomType,
|
||||
theme,
|
||||
downloadAction,
|
||||
isPublicRoomType,
|
||||
isCustomRoomType,
|
||||
primaryLink,
|
||||
getPrimaryLink,
|
||||
setExternalLink,
|
||||
moveToPublicRoom,
|
||||
currentDeviceType,
|
||||
isFrame,
|
||||
showTitle,
|
||||
hideInfoPanel,
|
||||
onClickArchive,
|
||||
setLeaveRoomDialogVisible,
|
||||
inRoom,
|
||||
onClickCreateRoom,
|
||||
onCreateAndCopySharedLink,
|
||||
showNavigationButton,
|
||||
setSelectFileFormRoomDialogVisible,
|
||||
deleteRooms,
|
||||
setSelection,
|
||||
startUpload,
|
||||
getFolderModel,
|
||||
onCreateRoom,
|
||||
onEmptyTrashAction,
|
||||
getHeaderOptions,
|
||||
setBufferSelection,
|
||||
} = props;
|
||||
|
||||
const navigate = useNavigate();
|
||||
const location = useLocation();
|
||||
const { groupId } = useParams();
|
||||
|
||||
@ -313,412 +246,20 @@ const SectionHeaderContent = (props) => {
|
||||
|
||||
const onInputClick = React.useCallback((e) => (e.target.value = null), []);
|
||||
|
||||
const createLinkForPortalUsers = () => {
|
||||
copy(
|
||||
`${window.location.origin}/filter?folder=${currentFolderId}`, //TODO: Change url by category
|
||||
);
|
||||
|
||||
toastr.success(t("Translations:LinkCopySuccess"));
|
||||
};
|
||||
|
||||
const onMoveAction = () => {
|
||||
setIsFolderActions(true);
|
||||
setBufferSelection(selectedFolder);
|
||||
return setMoveToPanelVisible(true);
|
||||
};
|
||||
|
||||
const onCopyAction = () => {
|
||||
setIsFolderActions(true);
|
||||
setBufferSelection(selectedFolder);
|
||||
return setCopyPanelVisible(true);
|
||||
};
|
||||
|
||||
const onDownloadAction = () => {
|
||||
downloadAction(t("Translations:ArchivingData"), selectedFolder, [
|
||||
currentFolderId,
|
||||
]).catch((err) => toastr.error(err));
|
||||
};
|
||||
|
||||
const onClickArchiveAction = (e) => {
|
||||
setBufferSelection(selectedFolder);
|
||||
onClickArchive(e);
|
||||
};
|
||||
|
||||
const onLeaveRoom = () => {
|
||||
setLeaveRoomDialogVisible(true);
|
||||
};
|
||||
|
||||
const renameAction = () => {
|
||||
const event = new Event(Events.RENAME);
|
||||
|
||||
event.item = selectedFolder;
|
||||
|
||||
window.dispatchEvent(event);
|
||||
};
|
||||
|
||||
const onOpenSharingPanel = () => {
|
||||
setBufferSelection(selectedFolder);
|
||||
setIsFolderActions(true);
|
||||
return setSharingPanelVisible(true);
|
||||
};
|
||||
|
||||
const onClickShare = () => {
|
||||
setShareFolderDialogVisible(true);
|
||||
};
|
||||
|
||||
const onDeleteAction = () => {
|
||||
setIsFolderActions(true);
|
||||
|
||||
if (confirmDelete || isThirdPartySelection) {
|
||||
getFolderInfo(currentFolderId).then((data) => {
|
||||
setBufferSelection(data);
|
||||
setDeleteDialogVisible(true);
|
||||
});
|
||||
} else {
|
||||
const translations = {
|
||||
deleteOperation: t("Translations:DeleteOperation"),
|
||||
deleteFromTrash: t("Translations:DeleteFromTrash"),
|
||||
deleteSelectedElem: t("Translations:DeleteSelectedElem"),
|
||||
FolderRemoved: t("Files:FolderRemoved"),
|
||||
};
|
||||
|
||||
deleteAction(translations, [selectedFolder], true).catch((err) =>
|
||||
toastr.error(err),
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
const onEmptyTrashAction = () => {
|
||||
const isExistActiveItems = [...activeFiles, ...activeFolders].length > 0;
|
||||
|
||||
if (isExistActiveItems || emptyTrashInProgress) return;
|
||||
|
||||
setEmptyTrashDialogVisible(true);
|
||||
};
|
||||
|
||||
const onRestoreAllAction = () => {
|
||||
setRestoreAllPanelVisible;
|
||||
const isExistActiveItems = [...activeFiles, ...activeFolders].length > 0;
|
||||
|
||||
if (isExistActiveItems) return;
|
||||
|
||||
setRestoreAllPanelVisible(true);
|
||||
};
|
||||
|
||||
const onRestoreAllArchiveAction = () => {
|
||||
const isExistActiveItems = [...activeFiles, ...activeFolders].length > 0;
|
||||
|
||||
if (isExistActiveItems) return;
|
||||
|
||||
if (isGracePeriod) {
|
||||
setInviteUsersWarningDialogVisible(true);
|
||||
return;
|
||||
}
|
||||
|
||||
setRestoreAllArchive(true);
|
||||
setRestoreRoomDialogVisible(true);
|
||||
};
|
||||
|
||||
const onShowInfo = () => {
|
||||
const { setIsInfoPanelVisible } = props;
|
||||
setIsInfoPanelVisible(true);
|
||||
};
|
||||
|
||||
const onToggleInfoPanel = () => {
|
||||
setIsInfoPanelVisible(!isInfoPanelVisible);
|
||||
};
|
||||
|
||||
const onCopyLinkAction = () => {
|
||||
onCopyLink && onCopyLink({ ...selectedFolder, isFolder: true }, t);
|
||||
};
|
||||
|
||||
const onDownloadAll = () => {
|
||||
onDownloadAction();
|
||||
};
|
||||
|
||||
const onShareRoom = () => {
|
||||
copy(window.location.href);
|
||||
toastr.success(t("Translations:LinkCopySuccess"));
|
||||
};
|
||||
|
||||
const onDeleteRoomInArchive = () => {
|
||||
setSelection([selectedFolder]);
|
||||
deleteRooms(t);
|
||||
};
|
||||
|
||||
const getContextOptionsFolder = () => {
|
||||
const {
|
||||
t,
|
||||
isRoom,
|
||||
isRecycleBinFolder,
|
||||
isArchiveFolder,
|
||||
isPersonalRoom,
|
||||
|
||||
selectedFolder,
|
||||
|
||||
onClickEditRoom,
|
||||
onClickInviteUsers,
|
||||
onShowInfoPanel,
|
||||
onClickReconnectStorage,
|
||||
|
||||
canRestoreAll,
|
||||
canDeleteAll,
|
||||
|
||||
security,
|
||||
haveLinksRight,
|
||||
isPublicRoom,
|
||||
isFrame,
|
||||
} = props;
|
||||
|
||||
const isArchive = selectedFolder.rootFolderType === FolderType.Archive;
|
||||
|
||||
if (isPublicRoom) {
|
||||
return [
|
||||
{
|
||||
key: "public-room_share",
|
||||
label: t("Files:CopyLink"),
|
||||
icon: TabletLinkReactSvgUrl,
|
||||
onClick: onShareRoom,
|
||||
disabled: isFrame,
|
||||
},
|
||||
{
|
||||
key: "public-room_edit",
|
||||
label: t("Common:Download"),
|
||||
icon: DownloadReactSvgUrl,
|
||||
onClick: onDownloadAll,
|
||||
disabled: !security?.Download,
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
const isDisabled = isRecycleBinFolder || isRoom;
|
||||
|
||||
if (isArchiveFolder) {
|
||||
return [
|
||||
{
|
||||
id: "header_option_empty-archive",
|
||||
key: "empty-archive",
|
||||
label: t("ArchiveAction"),
|
||||
onClick: onEmptyTrashAction,
|
||||
disabled: !canDeleteAll,
|
||||
icon: ClearTrashReactSvgUrl,
|
||||
},
|
||||
{
|
||||
id: "header_option_restore-all",
|
||||
key: "restore-all",
|
||||
label: t("RestoreAll"),
|
||||
onClick: onRestoreAllArchiveAction,
|
||||
disabled: !canRestoreAll,
|
||||
icon: MoveReactSvgUrl,
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
if (isInsideGroup) {
|
||||
return getGroupContextOptions(t, currentGroup, false, true);
|
||||
}
|
||||
|
||||
return [
|
||||
{
|
||||
id: "header_option_sharing-settings",
|
||||
key: "sharing-settings",
|
||||
label: t("Common:Share"),
|
||||
onClick: onClickShare,
|
||||
disabled: !selectedFolder.security?.CreateRoomFrom,
|
||||
icon: ShareReactSvgUrl,
|
||||
},
|
||||
{
|
||||
id: "header_option_link-portal-users",
|
||||
key: "link-portal-users",
|
||||
label: t("LinkForPortalUsers", { productName: PRODUCT_NAME }),
|
||||
onClick: createLinkForPortalUsers,
|
||||
disabled: true,
|
||||
icon: InvitationLinkReactSvgUrl,
|
||||
},
|
||||
{
|
||||
id: "header_option_link-for-room-members",
|
||||
key: "link-for-room-members",
|
||||
label: t("Files:CopyLink"),
|
||||
onClick: onCopyLinkAction,
|
||||
disabled:
|
||||
isRecycleBinFolder ||
|
||||
isPersonalRoom ||
|
||||
((isPublicRoomType || isCustomRoomType || isFormRoomType) &&
|
||||
haveLinksRight &&
|
||||
!isArchive),
|
||||
icon: InvitationLinkReactSvgUrl,
|
||||
},
|
||||
{
|
||||
id: "header_option_empty-trash",
|
||||
key: "empty-trash",
|
||||
label: t("Files:EmptyRecycleBin"),
|
||||
onClick: onEmptyTrashAction,
|
||||
disabled: !isRecycleBinFolder,
|
||||
icon: ClearTrashReactSvgUrl,
|
||||
},
|
||||
{
|
||||
id: "header_option_restore-all",
|
||||
key: "restore-all",
|
||||
label: t("RestoreAll"),
|
||||
onClick: onRestoreAllAction,
|
||||
disabled: !isRecycleBinFolder,
|
||||
icon: MoveReactSvgUrl,
|
||||
},
|
||||
{
|
||||
id: "header_option_show-info",
|
||||
key: "show-info",
|
||||
label: t("Common:Info"),
|
||||
onClick: onShowInfo,
|
||||
disabled: isDisabled,
|
||||
icon: InfoOutlineReactSvgUrl,
|
||||
},
|
||||
{
|
||||
id: "header_option_reconnect-storage",
|
||||
key: "reconnect-storage",
|
||||
label: t("Common:ReconnectStorage"),
|
||||
icon: ReconnectSvgUrl,
|
||||
onClick: () => onClickReconnectStorage(selectedFolder, t),
|
||||
disabled: !security?.EditRoom || !security?.Reconnect,
|
||||
},
|
||||
{
|
||||
id: "header_option_edit-room",
|
||||
key: "edit-room",
|
||||
label: t("EditRoom"),
|
||||
icon: SettingsReactSvgUrl,
|
||||
onClick: () => onClickEditRoom(selectedFolder),
|
||||
disabled: !isRoom || !security?.EditRoom,
|
||||
},
|
||||
{
|
||||
id: "header_option_copy-external-link",
|
||||
key: "copy-external-link",
|
||||
label: t("Files:CopySharedLink"),
|
||||
icon: CopyToReactSvgUrl,
|
||||
onClick: async () => {
|
||||
if (primaryLink) {
|
||||
copyShareLink(primaryLink.sharedTo.shareLink);
|
||||
toastr.success(t("Translations:LinkCopySuccess"));
|
||||
} else {
|
||||
const link = await getPrimaryLink(currentFolderId);
|
||||
if (link) {
|
||||
copyShareLink(link.sharedTo.shareLink);
|
||||
toastr.success(t("Files:LinkSuccessfullyCreatedAndCopied"));
|
||||
setExternalLink(link);
|
||||
}
|
||||
}
|
||||
},
|
||||
disabled:
|
||||
(!isPublicRoomType && !isCustomRoomType && !isFormRoomType) ||
|
||||
!haveLinksRight ||
|
||||
isArchive,
|
||||
},
|
||||
{
|
||||
id: "header_option_invite-users-to-room",
|
||||
key: "invite-users-to-room",
|
||||
label: t("Common:InviteUsers"),
|
||||
icon: PersonReactSvgUrl,
|
||||
onClick: () =>
|
||||
onClickInviteUsers(selectedFolder.id, selectedFolder.roomType),
|
||||
disabled: !isRoom || !security?.EditAccess,
|
||||
},
|
||||
{
|
||||
id: "header_option_room-info",
|
||||
key: "room-info",
|
||||
label: t("Common:Info"),
|
||||
icon: InfoOutlineReactSvgUrl,
|
||||
onClick: onToggleInfoPanel,
|
||||
disabled: !isRoom,
|
||||
},
|
||||
{
|
||||
id: "header_option_separator-2",
|
||||
key: "separator-2",
|
||||
isSeparator: true,
|
||||
disabled: isRecycleBinFolder,
|
||||
},
|
||||
{
|
||||
id: "header_option_archive-room",
|
||||
key: "archive-room",
|
||||
label: t("MoveToArchive"),
|
||||
icon: RoomArchiveSvgUrl,
|
||||
onClick: onClickArchiveAction,
|
||||
disabled: !isRoom || !security?.Move || isArchive,
|
||||
"data-action": "archive",
|
||||
action: "archive",
|
||||
},
|
||||
{
|
||||
id: "option_create-room",
|
||||
label: t("Files:CreateRoom"),
|
||||
key: "create-room",
|
||||
icon: CatalogRoomsReactSvgUrl,
|
||||
onClick: () => {
|
||||
onClickCreateRoom({ title: selectedFolder.title, isFolder: true });
|
||||
},
|
||||
disabled: !selectedFolder.security?.CreateRoomFrom,
|
||||
},
|
||||
{
|
||||
id: "option_leave-room",
|
||||
key: "leave-room",
|
||||
label: t("LeaveTheRoom"),
|
||||
icon: LeaveRoomSvgUrl,
|
||||
onClick: onLeaveRoom,
|
||||
disabled: isArchive || !inRoom || isPublicRoom,
|
||||
},
|
||||
{
|
||||
id: "header_option_download",
|
||||
key: "download",
|
||||
label: t("Common:Download"),
|
||||
onClick: onDownloadAction,
|
||||
disabled: !security?.Download,
|
||||
icon: DownloadReactSvgUrl,
|
||||
},
|
||||
{
|
||||
id: "header_option_unarchive-room",
|
||||
key: "unarchive-room",
|
||||
label: t("Common:Restore"),
|
||||
onClick: onClickArchiveAction,
|
||||
disabled: !isArchive || !isRoom,
|
||||
icon: MoveReactSvgUrl,
|
||||
},
|
||||
{
|
||||
id: "header_option_move-to",
|
||||
key: "move-to",
|
||||
label: t("Common:MoveTo"),
|
||||
onClick: onMoveAction,
|
||||
disabled: isDisabled || !security?.MoveTo,
|
||||
icon: MoveReactSvgUrl,
|
||||
},
|
||||
{
|
||||
id: "header_option_copy",
|
||||
key: "copy",
|
||||
label: t("Common:Copy"),
|
||||
onClick: onCopyAction,
|
||||
disabled:
|
||||
isDisabled || (isArchive ? !security?.Copy : !security?.CopyTo),
|
||||
return getHeaderOptions(t, selectedFolder);
|
||||
};
|
||||
|
||||
icon: CopyReactSvgUrl,
|
||||
},
|
||||
{
|
||||
id: "header_option_rename",
|
||||
key: "rename",
|
||||
label: t("Common:Rename"),
|
||||
onClick: renameAction,
|
||||
disabled: isDisabled || !security?.Rename,
|
||||
icon: RenameReactSvgUrl,
|
||||
},
|
||||
{
|
||||
id: "header_option_separator-3",
|
||||
key: "separator-3",
|
||||
isSeparator: true,
|
||||
disabled: isDisabled || !security?.Delete,
|
||||
},
|
||||
{
|
||||
id: "header_option_delete",
|
||||
key: "delete",
|
||||
label: t("Common:Delete"),
|
||||
onClick: isArchive ? onDeleteRoomInArchive : onDeleteAction,
|
||||
disabled: isArchive ? !isRoom : isDisabled || !security?.Delete,
|
||||
icon: CatalogTrashReactSvgUrl,
|
||||
},
|
||||
];
|
||||
const onContextOptionsClick = () => {
|
||||
setBufferSelection(selectedFolder);
|
||||
};
|
||||
|
||||
const onSelect = (e) => {
|
||||
@ -1004,6 +545,7 @@ const SectionHeaderContent = (props) => {
|
||||
onNavigationButtonClick={onNavigationButtonClick}
|
||||
tariffBar={<TariffBar />}
|
||||
showNavigationButton={!!showNavigationButton}
|
||||
onContextOptionsClick={onContextOptionsClick}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
@ -1040,23 +582,19 @@ export default inject(
|
||||
({
|
||||
filesStore,
|
||||
peopleStore,
|
||||
dialogsStore,
|
||||
selectedFolderStore,
|
||||
treeFoldersStore,
|
||||
filesActionsStore,
|
||||
filesSettingsStore,
|
||||
clientLoadingStore,
|
||||
publicRoomStore,
|
||||
contextOptionsStore,
|
||||
infoPanelStore,
|
||||
userStore,
|
||||
currentTariffStatusStore,
|
||||
settingsStore,
|
||||
uploadDataStore,
|
||||
}) => {
|
||||
const { startUpload } = uploadDataStore;
|
||||
const isRoomAdmin = userStore.user?.isRoomAdmin;
|
||||
const isCollaborator = userStore.user?.isCollaborator;
|
||||
|
||||
const {
|
||||
setSelected,
|
||||
@ -1064,16 +602,10 @@ export default inject(
|
||||
isHeaderVisible,
|
||||
isHeaderIndeterminate,
|
||||
isHeaderChecked,
|
||||
isThirdPartySelection,
|
||||
cbMenuItems,
|
||||
getCheckboxItemLabel,
|
||||
getCheckboxItemId,
|
||||
isEmptyFilesList,
|
||||
getFolderInfo,
|
||||
setBufferSelection,
|
||||
|
||||
activeFiles,
|
||||
activeFolders,
|
||||
|
||||
roomsForRestore,
|
||||
roomsForDelete,
|
||||
@ -1081,8 +613,7 @@ export default inject(
|
||||
isEmptyPage,
|
||||
|
||||
categoryType,
|
||||
getPrimaryLink,
|
||||
setSelection,
|
||||
setBufferSelection,
|
||||
} = filesStore;
|
||||
|
||||
const {
|
||||
@ -1096,58 +627,27 @@ export default inject(
|
||||
setIsSectionFilterLoading(param);
|
||||
};
|
||||
|
||||
const {
|
||||
setSharingPanelVisible,
|
||||
setMoveToPanelVisible,
|
||||
setCopyPanelVisible,
|
||||
setDeleteDialogVisible,
|
||||
setEmptyTrashDialogVisible,
|
||||
setIsFolderActions,
|
||||
setRestoreAllPanelVisible,
|
||||
setRestoreRoomDialogVisible,
|
||||
setRestoreAllArchive,
|
||||
setInviteUsersWarningDialogVisible,
|
||||
setLeaveRoomDialogVisible,
|
||||
setSelectFileFormRoomDialogVisible,
|
||||
setShareFolderDialogVisible,
|
||||
} = dialogsStore;
|
||||
const { isRecycleBinFolder, isRoomsFolder, isArchiveFolder } =
|
||||
treeFoldersStore;
|
||||
|
||||
const {
|
||||
isRecycleBinFolder,
|
||||
isRoomsFolder,
|
||||
isArchiveFolder,
|
||||
isPersonalRoom,
|
||||
isArchiveFolderRoot,
|
||||
} = treeFoldersStore;
|
||||
|
||||
const {
|
||||
deleteAction,
|
||||
downloadAction,
|
||||
getHeaderMenu,
|
||||
isGroupMenuBlocked,
|
||||
moveToRoomsPage,
|
||||
onClickBack,
|
||||
emptyTrashInProgress,
|
||||
moveToPublicRoom,
|
||||
onClickCreateRoom,
|
||||
deleteRooms,
|
||||
} = filesActionsStore;
|
||||
|
||||
const { setIsVisible, isVisible } = infoPanelStore;
|
||||
|
||||
const {
|
||||
title,
|
||||
id,
|
||||
roomType,
|
||||
pathParts,
|
||||
navigationPath,
|
||||
security,
|
||||
inRoom,
|
||||
access,
|
||||
canCopyPublicLink,
|
||||
rootFolderType,
|
||||
parentRoomType,
|
||||
isFolder,
|
||||
shared,
|
||||
} = selectedFolderStore;
|
||||
|
||||
@ -1160,7 +660,6 @@ export default inject(
|
||||
} = peopleStore.groupsStore;
|
||||
|
||||
const { theme, frameConfig, isFrame, currentDeviceType } = settingsStore;
|
||||
const { isGracePeriod } = currentTariffStatusStore;
|
||||
|
||||
const isRoom = !!roomType;
|
||||
const isPublicRoomType = roomType === RoomsType.PublicRoom;
|
||||
@ -1168,15 +667,11 @@ export default inject(
|
||||
const isFormRoomType = roomType === RoomsType.FormRoom;
|
||||
|
||||
const {
|
||||
onClickEditRoom,
|
||||
onClickInviteUsers,
|
||||
onShowInfoPanel,
|
||||
onClickArchive,
|
||||
onClickReconnectStorage,
|
||||
onCopyLink,
|
||||
onCreateAndCopySharedLink,
|
||||
getFolderModel,
|
||||
onCreateRoom,
|
||||
getHeaderOptions,
|
||||
onEmptyTrashAction,
|
||||
} = contextOptionsStore;
|
||||
|
||||
const canRestoreAll = isArchiveFolder && roomsForRestore.length > 0;
|
||||
@ -1204,7 +699,7 @@ export default inject(
|
||||
} = headerMenuStore;
|
||||
|
||||
const { setSelected: setAccountsSelected } = selectionStore;
|
||||
const { isPublicRoom, primaryLink, setExternalLink } = publicRoomStore;
|
||||
const { isPublicRoom } = publicRoomStore;
|
||||
|
||||
let folderPath = navigationPath;
|
||||
|
||||
@ -1217,10 +712,6 @@ export default inject(
|
||||
? pathParts?.length === 1 || pathParts?.length === 2
|
||||
: pathParts?.length === 1;
|
||||
|
||||
const haveLinksRight =
|
||||
access === ShareAccessRights.RoomManager ||
|
||||
access === ShareAccessRights.None;
|
||||
|
||||
const isArchive = rootFolderType === FolderType.Archive;
|
||||
|
||||
const sharedItem = navigationPath.find((r) => r.shared);
|
||||
@ -1236,17 +727,13 @@ export default inject(
|
||||
(sharedItem && sharedItem.canCopyPublicLink);
|
||||
|
||||
return {
|
||||
isGracePeriod,
|
||||
setInviteUsersWarningDialogVisible,
|
||||
showText: settingsStore.showText,
|
||||
isDesktop: settingsStore.isDesktopClient,
|
||||
showHeaderLoader,
|
||||
isLoading,
|
||||
isRootFolder: isPublicRoom && !folderPath?.length ? true : isRoot,
|
||||
isPersonalRoom,
|
||||
title,
|
||||
isRoom,
|
||||
currentFolderId: id,
|
||||
|
||||
navigationPath: folderPath,
|
||||
|
||||
@ -1255,70 +742,36 @@ export default inject(
|
||||
isHeaderVisible,
|
||||
isHeaderIndeterminate,
|
||||
isHeaderChecked,
|
||||
isThirdPartySelection,
|
||||
isTabletView: settingsStore.isTabletView,
|
||||
confirmDelete: filesSettingsStore.confirmDelete,
|
||||
cbMenuItems,
|
||||
setSelectedNode: treeFoldersStore.setSelectedNode,
|
||||
getFolderInfo,
|
||||
|
||||
setSelected,
|
||||
security,
|
||||
canCopyPublicLink,
|
||||
|
||||
setSharingPanelVisible,
|
||||
setMoveToPanelVisible,
|
||||
setCopyPanelVisible,
|
||||
setBufferSelection,
|
||||
setIsFolderActions,
|
||||
deleteAction,
|
||||
setDeleteDialogVisible,
|
||||
downloadAction,
|
||||
getHeaderMenu,
|
||||
getCheckboxItemLabel,
|
||||
getCheckboxItemId,
|
||||
|
||||
isRecycleBinFolder,
|
||||
setEmptyTrashDialogVisible,
|
||||
isEmptyFilesList,
|
||||
isEmptyArchive,
|
||||
isArchiveFolder,
|
||||
|
||||
setIsLoading,
|
||||
|
||||
activeFiles,
|
||||
activeFolders,
|
||||
|
||||
isRoomsFolder,
|
||||
|
||||
setRestoreAllPanelVisible,
|
||||
|
||||
setRestoreRoomDialogVisible,
|
||||
setRestoreAllArchive,
|
||||
|
||||
selectedFolder,
|
||||
|
||||
onClickEditRoom,
|
||||
onClickCreateRoom,
|
||||
onClickInviteUsers,
|
||||
onShowInfoPanel,
|
||||
onClickArchive,
|
||||
onCopyLink,
|
||||
|
||||
isEmptyArchive,
|
||||
canRestoreAll,
|
||||
canDeleteAll,
|
||||
isGroupMenuBlocked,
|
||||
|
||||
moveToRoomsPage,
|
||||
onClickBack,
|
||||
isPublicRoomType,
|
||||
isCustomRoomType,
|
||||
isFormRoomType,
|
||||
isPublicRoom,
|
||||
primaryLink,
|
||||
getPrimaryLink,
|
||||
setExternalLink,
|
||||
|
||||
moveToPublicRoom,
|
||||
|
||||
@ -1335,31 +788,24 @@ export default inject(
|
||||
getAccountsCheckboxItemLabel,
|
||||
setAccountsSelected,
|
||||
isRoomAdmin,
|
||||
isCollaborator,
|
||||
isEmptyPage,
|
||||
emptyTrashInProgress,
|
||||
categoryType,
|
||||
theme,
|
||||
isFrame,
|
||||
showTitle: frameConfig?.showTitle,
|
||||
hideInfoPanel: isFrame && !frameConfig?.infoPanelVisible,
|
||||
currentDeviceType,
|
||||
setLeaveRoomDialogVisible,
|
||||
inRoom,
|
||||
insideGroupTempTitle,
|
||||
currentGroup,
|
||||
getGroupContextOptions,
|
||||
onCreateAndCopySharedLink,
|
||||
showNavigationButton,
|
||||
haveLinksRight,
|
||||
setSelectFileFormRoomDialogVisible,
|
||||
deleteRooms,
|
||||
setSelection,
|
||||
setShareFolderDialogVisible,
|
||||
startUpload,
|
||||
onClickReconnectStorage,
|
||||
getFolderModel,
|
||||
onCreateRoom,
|
||||
onEmptyTrashAction,
|
||||
getHeaderOptions,
|
||||
setBufferSelection,
|
||||
};
|
||||
},
|
||||
)(
|
||||
|
||||
@ -74,7 +74,7 @@ const LDAP = ({
|
||||
}
|
||||
};
|
||||
|
||||
if (!isLoaded) return <LdapLoader />;
|
||||
if (!isLoaded && isLdapAvailable) return <LdapLoader />;
|
||||
return (
|
||||
<StyledLdapPage
|
||||
isSmallWindow={isSmallWindow}
|
||||
|
||||
@ -74,6 +74,10 @@ const StyledTableRow = styled(TableRow)`
|
||||
margin-left: 8px;
|
||||
`}
|
||||
}
|
||||
|
||||
.remove-cell {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
`;
|
||||
|
||||
StyledTableRow.defaultProps = { theme: Base };
|
||||
@ -137,15 +141,13 @@ const SessionsTableRow = (props) => {
|
||||
</TableCell>
|
||||
|
||||
{showRemoveIcon && (
|
||||
<TableCell>
|
||||
<Box style={{ marginLeft: "8px" }}>
|
||||
<IconButton
|
||||
size={20}
|
||||
iconName={RemoveSessionSvgUrl}
|
||||
isClickable
|
||||
onClick={onRemoveClick}
|
||||
/>
|
||||
</Box>
|
||||
<TableCell className="remove-cell">
|
||||
<IconButton
|
||||
size={20}
|
||||
iconName={RemoveSessionSvgUrl}
|
||||
isClickable
|
||||
onClick={onRemoveClick}
|
||||
/>
|
||||
</TableCell>
|
||||
)}
|
||||
</StyledTableRow>
|
||||
|
||||
@ -102,7 +102,9 @@ const VersionRow = (props) => {
|
||||
|
||||
const versionDate = getCorrectDate(culture, info.updated, "L", "LTS");
|
||||
|
||||
const title = `${Encoder.htmlDecode(info.updatedBy?.displayName)}`;
|
||||
const title = info.updatedBy?.isAnonim
|
||||
? t("Common:Anonymous")
|
||||
: `${Encoder.htmlDecode(info.updatedBy?.displayName)}`;
|
||||
|
||||
const onDownloadAction = () =>
|
||||
openUrl(`${info.viewUrl}&version=${info.version}`, UrlActionType.Download);
|
||||
@ -278,16 +280,27 @@ const VersionRow = (props) => {
|
||||
>
|
||||
{versionDate}
|
||||
</Link>
|
||||
<Link
|
||||
onClick={onUserClick}
|
||||
fontWeight={600}
|
||||
fontSize="14px"
|
||||
title={title}
|
||||
isTextOverflow={true}
|
||||
className="version-link-file"
|
||||
>
|
||||
{title}
|
||||
</Link>
|
||||
{info.updatedBy?.isAnonim ? (
|
||||
<Text
|
||||
fontWeight={600}
|
||||
color={theme.filesVersionHistory.color}
|
||||
fontSize="14px"
|
||||
title={title}
|
||||
>
|
||||
{title}
|
||||
</Text>
|
||||
) : (
|
||||
<Link
|
||||
onClick={onUserClick}
|
||||
fontWeight={600}
|
||||
fontSize="14px"
|
||||
title={title}
|
||||
isTextOverflow={true}
|
||||
className="version-link-file"
|
||||
>
|
||||
{title}
|
||||
</Link>
|
||||
)}
|
||||
</Box>
|
||||
|
||||
{/*<Text
|
||||
|
||||
@ -56,7 +56,6 @@ import UnmuteReactSvgUrl from "PUBLIC_DIR/images/unmute.react.svg?url";
|
||||
import MuteReactSvgUrl from "PUBLIC_DIR/images/icons/16/mute.react.svg?url";
|
||||
import ShareReactSvgUrl from "PUBLIC_DIR/images/share.react.svg?url";
|
||||
import InvitationLinkReactSvgUrl from "PUBLIC_DIR/images/invitation.link.react.svg?url";
|
||||
import CopyToReactSvgUrl from "PUBLIC_DIR/images/copyTo.react.svg?url";
|
||||
import TabletLinkReactSvgUrl from "PUBLIC_DIR/images/tablet-link.react.svg?url";
|
||||
import MailReactSvgUrl from "PUBLIC_DIR/images/mail.react.svg?url";
|
||||
import RoomArchiveSvgUrl from "PUBLIC_DIR/images/room.archive.svg?url";
|
||||
@ -70,7 +69,6 @@ import PersonDefaultReactSvgUrl from "PUBLIC_DIR/images/person.default.react.svg
|
||||
import InviteAgainReactSvgUrl from "PUBLIC_DIR/images/invite.again.react.svg?url";
|
||||
import PersonUserReactSvgUrl from "PUBLIC_DIR/images/person.user.react.svg?url";
|
||||
import GroupReactSvgUrl from "PUBLIC_DIR/images/group.react.svg?url";
|
||||
import FolderLockedReactSvgUrl from "PUBLIC_DIR/images/folder.locked.react.svg?url";
|
||||
import ActionsDocumentsReactSvgUrl from "PUBLIC_DIR/images/actions.documents.react.svg?url";
|
||||
import SpreadsheetReactSvgUrl from "PUBLIC_DIR/images/spreadsheet.react.svg?url";
|
||||
import ActionsPresentationReactSvgUrl from "PUBLIC_DIR/images/actions.presentation.react.svg?url";
|
||||
@ -81,17 +79,18 @@ import CatalogFolderReactSvgUrl from "PUBLIC_DIR/images/catalog.folder.react.svg
|
||||
import ActionsUploadReactSvgUrl from "PUBLIC_DIR/images/actions.upload.react.svg?url";
|
||||
import PluginMoreReactSvgUrl from "PUBLIC_DIR/images/plugin.more.react.svg?url";
|
||||
import CodeReactSvgUrl from "PUBLIC_DIR/images/code.react.svg?url";
|
||||
import ClearTrashReactSvgUrl from "PUBLIC_DIR/images/clear.trash.react.svg?url";
|
||||
|
||||
import { getCategoryUrl } from "@docspace/client/src/helpers/utils";
|
||||
|
||||
import { makeAutoObservable } from "mobx";
|
||||
import copy from "copy-to-clipboard";
|
||||
import saveAs from "file-saver";
|
||||
import { isMobile, isIOS, isTablet } from "react-device-detect";
|
||||
import { isMobile, isTablet } from "react-device-detect";
|
||||
import config from "PACKAGE_FILE";
|
||||
import { toastr } from "@docspace/shared/components/toast";
|
||||
import { combineUrl } from "@docspace/shared/utils/combineUrl";
|
||||
import { isDesktop } from "@docspace/shared/utils";
|
||||
import { isDesktop, trimSeparator } from "@docspace/shared/utils";
|
||||
import { getDefaultAccessUser } from "@docspace/shared/utils/getDefaultAccessUser";
|
||||
import { copyShareLink } from "@docspace/shared/utils/copy";
|
||||
|
||||
@ -296,24 +295,37 @@ class ContextOptionsStore {
|
||||
this.dialogsStore.setChangeOwnerPanelVisible(true);
|
||||
};
|
||||
|
||||
onMoveAction = () => {
|
||||
onMoveAction = (item) => {
|
||||
const { setIsMobileHidden } = this.infoPanelStore;
|
||||
const { id, isFolder } = this.selectedFolderStore;
|
||||
|
||||
setIsMobileHidden(true);
|
||||
|
||||
const isFolderActions = id === item?.id && isFolder === item?.isFolder;
|
||||
if (isFolderActions) {
|
||||
this.dialogsStore.setIsFolderActions(true);
|
||||
}
|
||||
|
||||
this.dialogsStore.setMoveToPanelVisible(true);
|
||||
};
|
||||
|
||||
onRestoreAction = () => {
|
||||
const { setIsMobileHidden } = this.infoPanelStore;
|
||||
setIsMobileHidden(true);
|
||||
console.log("Click");
|
||||
this.dialogsStore.setRestorePanelVisible(true);
|
||||
};
|
||||
|
||||
onCopyAction = () => {
|
||||
onCopyAction = (item) => {
|
||||
const { setIsMobileHidden } = this.infoPanelStore;
|
||||
const { id, isFolder } = this.selectedFolderStore;
|
||||
|
||||
setIsMobileHidden(true);
|
||||
|
||||
const isFolderActions = id === item?.id && isFolder === item?.isFolder;
|
||||
if (isFolderActions) {
|
||||
this.dialogsStore.setIsFolderActions(true);
|
||||
}
|
||||
|
||||
this.dialogsStore.setCopyPanelVisible(true);
|
||||
};
|
||||
|
||||
@ -449,9 +461,11 @@ class ContextOptionsStore {
|
||||
this.selectedFolderStore;
|
||||
const { setLinkParams, setEmbeddingPanelData } = this.dialogsStore;
|
||||
|
||||
const sharedItem = shared
|
||||
? getSelectedFolder()
|
||||
: navigationPath.find((r) => r.shared);
|
||||
const sharedItem = item.isRoom
|
||||
? item
|
||||
: shared
|
||||
? getSelectedFolder()
|
||||
: navigationPath.find((r) => r.shared);
|
||||
|
||||
if (!sharedItem) return;
|
||||
|
||||
@ -464,7 +478,7 @@ class ContextOptionsStore {
|
||||
isFormRoom,
|
||||
});
|
||||
|
||||
setEmbeddingPanelData({ visible: true, fileId: item.id });
|
||||
setEmbeddingPanelData({ visible: true, item });
|
||||
};
|
||||
|
||||
onCreateAndCopySharedLink = async (item, t) => {
|
||||
@ -503,12 +517,12 @@ class ContextOptionsStore {
|
||||
this.filesStore.openDocEditor(id, preview);
|
||||
};
|
||||
|
||||
isPwa = () => {
|
||||
return ["fullscreen", "standalone", "minimal-ui"].some(
|
||||
(displayMode) =>
|
||||
window.matchMedia("(display-mode: " + displayMode + ")").matches,
|
||||
);
|
||||
};
|
||||
// isPwa = () => {
|
||||
// return ["fullscreen", "standalone", "minimal-ui"].some(
|
||||
// (displayMode) =>
|
||||
// window.matchMedia("(display-mode: " + displayMode + ")").matches,
|
||||
// );
|
||||
// };
|
||||
|
||||
onClickDownload = (item, t) => {
|
||||
const { fileExst, contentLength, viewUrl } = item;
|
||||
@ -517,23 +531,6 @@ class ContextOptionsStore {
|
||||
const { openUrl } = this.settingsStore;
|
||||
const { downloadAction } = this.filesActionsStore;
|
||||
|
||||
if (isIOS && this.isPwa()) {
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.open("GET", viewUrl);
|
||||
xhr.responseType = "blob";
|
||||
|
||||
xhr.onload = () => {
|
||||
saveAs(xhr.response, item.title);
|
||||
};
|
||||
|
||||
xhr.onerror = () => {
|
||||
console.error("download failed", viewUrl);
|
||||
};
|
||||
|
||||
xhr.send();
|
||||
return;
|
||||
}
|
||||
|
||||
isFile
|
||||
? openUrl(viewUrl, UrlActionType.Download)
|
||||
: downloadAction(t("Translations:ArchivingData"), item).catch((err) =>
|
||||
@ -1072,7 +1069,142 @@ class ContextOptionsStore {
|
||||
return { pinOptions, muteOptions };
|
||||
};
|
||||
|
||||
getFilesContextOptions = (item, t, isInfoPanel) => {
|
||||
onEmptyTrashAction = () => {
|
||||
const { activeFiles, activeFolders } = this.filesStore;
|
||||
const isExistActiveItems = [...activeFiles, ...activeFolders].length > 0;
|
||||
|
||||
if (isExistActiveItems || this.filesActionsStore.emptyTrashInProgress)
|
||||
return;
|
||||
|
||||
this.dialogsStore.setEmptyTrashDialogVisible(true);
|
||||
};
|
||||
|
||||
onRestoreAllAction = () => {
|
||||
const { activeFiles, activeFolders } = this.filesStore;
|
||||
const isExistActiveItems = [...activeFiles, ...activeFolders].length > 0;
|
||||
|
||||
if (isExistActiveItems) return;
|
||||
|
||||
this.dialogsStore.setRestoreAllPanelVisible(true);
|
||||
};
|
||||
|
||||
onRestoreAllArchiveAction = () => {
|
||||
const { activeFiles, activeFolders } = this.filesStore;
|
||||
const {
|
||||
setInviteUsersWarningDialogVisible,
|
||||
setRestoreAllArchive,
|
||||
setRestoreRoomDialogVisible,
|
||||
} = this.dialogsStore;
|
||||
|
||||
const isExistActiveItems = [...activeFiles, ...activeFolders].length > 0;
|
||||
|
||||
if (isExistActiveItems) return;
|
||||
|
||||
if (this.currentTariffStatusStore.isGracePeriod) {
|
||||
setInviteUsersWarningDialogVisible(true);
|
||||
return;
|
||||
}
|
||||
|
||||
setRestoreAllArchive(true);
|
||||
setRestoreRoomDialogVisible(true);
|
||||
};
|
||||
|
||||
getHeaderOptions = (t, item) => {
|
||||
const { isRecycleBinFolder, isArchiveFolder } = this.treeFoldersStore;
|
||||
const { roomsForDelete, roomsForRestore } = this.filesStore;
|
||||
|
||||
const canRestoreAll = roomsForRestore.length > 0;
|
||||
const canDeleteAll = roomsForDelete.length > 0;
|
||||
|
||||
if (this.publicRoomStore.isPublicRoom) {
|
||||
return [
|
||||
{
|
||||
key: "public-room_share",
|
||||
label: t("Files:CopyLink"),
|
||||
icon: TabletLinkReactSvgUrl,
|
||||
onClick: () => {
|
||||
copy(window.location.href);
|
||||
toastr.success(t("Translations:LinkCopySuccess"));
|
||||
},
|
||||
disabled: this.settingsStore.isFrame,
|
||||
},
|
||||
{
|
||||
key: "public-room_edit",
|
||||
label: t("Common:Download"),
|
||||
icon: DownloadReactSvgUrl,
|
||||
onClick: () => {
|
||||
onClickDownload(item, t);
|
||||
},
|
||||
disabled: !item.security?.Download,
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
if (isRecycleBinFolder) {
|
||||
return [
|
||||
{
|
||||
id: "header_option_empty-trash",
|
||||
key: "empty-trash",
|
||||
label: t("Files:EmptyRecycleBin"),
|
||||
onClick: this.onEmptyTrashAction,
|
||||
icon: ClearTrashReactSvgUrl,
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "header_option_restore-all",
|
||||
key: "restore-all",
|
||||
label: t("RestoreAll"),
|
||||
onClick: this.onRestoreAllAction,
|
||||
icon: MoveReactSvgUrl,
|
||||
disabled: false,
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
if (isArchiveFolder) {
|
||||
return [
|
||||
{
|
||||
id: "header_option_empty-archive",
|
||||
key: "empty-archive",
|
||||
label: t("ArchiveAction"),
|
||||
onClick: this.onEmptyTrashAction,
|
||||
disabled: !canDeleteAll,
|
||||
icon: ClearTrashReactSvgUrl,
|
||||
},
|
||||
{
|
||||
id: "header_option_restore-all",
|
||||
key: "restore-all",
|
||||
label: t("RestoreAll"),
|
||||
onClick: this.onRestoreAllArchiveAction,
|
||||
disabled: !canRestoreAll,
|
||||
icon: MoveReactSvgUrl,
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
return this.getFilesContextOptions(item, t, false, true);
|
||||
};
|
||||
|
||||
getFilesContextOptions = (item, t, isInfoPanel, isHeader) => {
|
||||
const optionsToRemove = isInfoPanel
|
||||
? ["select", "room-info", "show-info"]
|
||||
: isHeader
|
||||
? ["select"]
|
||||
: [];
|
||||
|
||||
if (!item.contextOptions) {
|
||||
const contextOptions = this.filesStore.getFilesContextOptions(
|
||||
item,
|
||||
optionsToRemove,
|
||||
);
|
||||
item = { ...item, contextOptions };
|
||||
} else {
|
||||
item.contextOptions = this.filesStore.removeOptions(
|
||||
item.contextOptions,
|
||||
optionsToRemove,
|
||||
);
|
||||
}
|
||||
|
||||
const { contextOptions, isEditing } = item;
|
||||
|
||||
const isRootThirdPartyFolder =
|
||||
@ -1197,7 +1329,7 @@ class ContextOptionsStore {
|
||||
icon: MoveReactSvgUrl,
|
||||
onClick: isEditing
|
||||
? () => this.onShowEditingToast(t)
|
||||
: this.onMoveAction,
|
||||
: () => this.onMoveAction(item),
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
@ -1205,7 +1337,7 @@ class ContextOptionsStore {
|
||||
key: "copy-to",
|
||||
label: t("Common:Copy"),
|
||||
icon: CopyReactSvgUrl,
|
||||
onClick: this.onCopyAction,
|
||||
onClick: () => this.onCopyAction(item),
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
@ -1227,7 +1359,7 @@ class ContextOptionsStore {
|
||||
icon: MoveReactSvgUrl,
|
||||
onClick: isEditing
|
||||
? () => this.onShowEditingToast(t)
|
||||
: this.onMoveAction,
|
||||
: () => this.onMoveAction(item),
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
@ -1235,7 +1367,7 @@ class ContextOptionsStore {
|
||||
key: "copy-to",
|
||||
label: t("Common:Copy"),
|
||||
icon: CopyReactSvgUrl,
|
||||
onClick: this.onCopyAction,
|
||||
onClick: () => this.onCopyAction(item),
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
@ -1369,7 +1501,7 @@ class ContextOptionsStore {
|
||||
label: t("Common:ReconnectStorage"),
|
||||
icon: ReconnectSvgUrl,
|
||||
onClick: () => this.onClickReconnectStorage(item, t),
|
||||
disabled: !item.security?.Reconnect,
|
||||
disabled: !item.security?.Reconnect || !item.security?.EditRoom,
|
||||
},
|
||||
{
|
||||
id: "option_edit-room",
|
||||
@ -1425,7 +1557,7 @@ class ContextOptionsStore {
|
||||
disabled:
|
||||
(isPublicRoomType && item.canCopyPublicLink && !isArchive) ||
|
||||
this.publicRoomStore.isPublicRoom ||
|
||||
!item.security.CopyLink,
|
||||
!item.security?.CopyLink,
|
||||
},
|
||||
{
|
||||
id: "option_copy-external-link",
|
||||
@ -1691,7 +1823,7 @@ class ContextOptionsStore {
|
||||
!(isCollaborator && option.key === "create-room"),
|
||||
);
|
||||
|
||||
return newOptions;
|
||||
return trimSeparator(newOptions);
|
||||
};
|
||||
|
||||
getGroupContextOptions = (t) => {
|
||||
|
||||
@ -103,7 +103,7 @@ class DialogsStore {
|
||||
createRoomConfirmDialogVisible = false;
|
||||
changeUserTypeDialogVisible = false;
|
||||
editLinkPanelIsVisible = false;
|
||||
embeddingPanelData = { visible: false, fileId: null };
|
||||
embeddingPanelData = { visible: false, item: null };
|
||||
submitToGalleryDialogVisible = false;
|
||||
linkParams = null;
|
||||
leaveRoomDialogVisible = false;
|
||||
|
||||
@ -660,9 +660,12 @@ class FilesActionStore {
|
||||
}
|
||||
};
|
||||
|
||||
downloadAction = (label, item, folderId) => {
|
||||
downloadAction = (label, item) => {
|
||||
const { bufferSelection } = this.filesStore;
|
||||
const { openUrl } = this.settingsStore;
|
||||
const { id, isFolder } = this.selectedFolderStore;
|
||||
|
||||
const downloadAsArchive = id === item?.id && isFolder === item?.isFolder;
|
||||
|
||||
const selection = item
|
||||
? [item]
|
||||
@ -678,7 +681,7 @@ class FilesActionStore {
|
||||
let folderIds = [];
|
||||
const items = [];
|
||||
|
||||
if (selection.length === 1 && selection[0].fileExst && !folderId) {
|
||||
if (selection.length === 1 && selection[0].fileExst && !downloadAsArchive) {
|
||||
openUrl(selection[0].viewUrl, UrlActionType.Download);
|
||||
return Promise.resolve();
|
||||
}
|
||||
|
||||
@ -1606,6 +1606,7 @@ class FilesStore {
|
||||
folders: data.folders,
|
||||
...data.current,
|
||||
inRoom: !!data.current.inRoom,
|
||||
isRoom: !!data.current.roomType,
|
||||
pathParts: data.pathParts,
|
||||
navigationPath,
|
||||
...{ new: data.new },
|
||||
@ -1986,7 +1987,7 @@ class FilesStore {
|
||||
return newOptions.filter((o) => o);
|
||||
};
|
||||
|
||||
getFilesContextOptions = (item, fromInfoPanel) => {
|
||||
getFilesContextOptions = (item, optionsToRemove = []) => {
|
||||
const isFile = !!item.fileExst || item.contentLength;
|
||||
const isRoom = !!item.roomType;
|
||||
const isFavorite =
|
||||
@ -2029,6 +2030,7 @@ class FilesStore {
|
||||
const canCopy = item.security?.Copy;
|
||||
const canDuplicate = item.security?.Duplicate;
|
||||
const canDownload = item.security?.Download;
|
||||
const canEmbed = item.security?.Embed;
|
||||
|
||||
if (isFile) {
|
||||
const shouldFillForm = item.viewAccessibility.WebRestrictedEditing;
|
||||
@ -2098,6 +2100,10 @@ class FilesStore {
|
||||
"copy-general-link",
|
||||
];
|
||||
|
||||
if (optionsToRemove.length) {
|
||||
fileOptions = this.removeOptions(fileOptions, optionsToRemove);
|
||||
}
|
||||
|
||||
if (!canDownload) {
|
||||
fileOptions = this.removeOptions(fileOptions, ["download"]);
|
||||
}
|
||||
@ -2193,10 +2199,7 @@ class FilesStore {
|
||||
}
|
||||
|
||||
if (!canViewFile || isRecycleBinFolder) {
|
||||
fileOptions = this.removeOptions(fileOptions, [
|
||||
"preview",
|
||||
"embedding-settings",
|
||||
]);
|
||||
fileOptions = this.removeOptions(fileOptions, ["preview"]);
|
||||
}
|
||||
|
||||
if (!canOpenPlayer || isRecycleBinFolder) {
|
||||
@ -2328,7 +2331,7 @@ class FilesStore {
|
||||
]);
|
||||
}
|
||||
|
||||
if (this.publicRoomStore.isPublicRoom) {
|
||||
if (this.publicRoomStore.isPublicRoom || !canEmbed) {
|
||||
fileOptions = this.removeOptions(fileOptions, ["embedding-settings"]);
|
||||
}
|
||||
|
||||
@ -2375,6 +2378,7 @@ class FilesStore {
|
||||
"edit-room",
|
||||
"invite-users-to-room",
|
||||
"external-link",
|
||||
"embedding-settings",
|
||||
"room-info",
|
||||
"pin-room",
|
||||
"unpin-room",
|
||||
@ -2388,6 +2392,10 @@ class FilesStore {
|
||||
"delete",
|
||||
];
|
||||
|
||||
if (optionsToRemove.length) {
|
||||
roomOptions = this.removeOptions(roomOptions, optionsToRemove);
|
||||
}
|
||||
|
||||
if (!canEditRoom) {
|
||||
roomOptions = this.removeOptions(roomOptions, [
|
||||
"edit-room",
|
||||
@ -2443,6 +2451,10 @@ class FilesStore {
|
||||
: (roomOptions = this.removeOptions(roomOptions, ["unmute-room"]));
|
||||
}
|
||||
|
||||
if (this.publicRoomStore.isPublicRoom || !canEmbed) {
|
||||
roomOptions = this.removeOptions(roomOptions, ["embedding-settings"]);
|
||||
}
|
||||
|
||||
if (!canViewRoomInfo) {
|
||||
roomOptions = this.removeOptions(roomOptions, ["room-info"]);
|
||||
}
|
||||
@ -2466,10 +2478,6 @@ class FilesStore {
|
||||
}
|
||||
}
|
||||
|
||||
// if (fromInfoPanel) {
|
||||
// roomOptions = this.removeOptions(roomOptions, ["external-link"]);
|
||||
// }
|
||||
|
||||
roomOptions = this.removeSeparator(roomOptions);
|
||||
|
||||
return roomOptions;
|
||||
@ -2499,6 +2507,10 @@ class FilesStore {
|
||||
"delete",
|
||||
];
|
||||
|
||||
if (optionsToRemove.length) {
|
||||
folderOptions = this.removeOptions(folderOptions, optionsToRemove);
|
||||
}
|
||||
|
||||
if (!canDownload) {
|
||||
folderOptions = this.removeOptions(folderOptions, ["download"]);
|
||||
}
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@docspace/doceditor",
|
||||
"version": "2.5.1",
|
||||
"version": "2.6.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"build": "node ./scripts/buildTranslations.js && next build",
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@docspace/login",
|
||||
"version": "2.5.0",
|
||||
"version": "2.6.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"build": "node ./scripts/buildTranslations.js && next build",
|
||||
|
||||
@ -43,12 +43,6 @@ const StyledSimpleNav = styled.div`
|
||||
justify-content: center;
|
||||
background-color: ${(props) => props.theme?.login?.navBackground};
|
||||
|
||||
svg {
|
||||
path:last-child {
|
||||
fill: ${(props) => props.theme.client?.home?.logoColor};
|
||||
}
|
||||
}
|
||||
|
||||
@media ${mobile} {
|
||||
display: flex;
|
||||
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@docspace/management",
|
||||
"version": "2.5.1",
|
||||
"version": "2.6.0",
|
||||
"private": true,
|
||||
"homepage": "/management",
|
||||
"scripts": {
|
||||
|
||||
@ -36,7 +36,7 @@ const StyledBackdrop = styled.div<BackdropProps & { needBackground: boolean }>`
|
||||
${(props) =>
|
||||
props.needBackground &&
|
||||
css`
|
||||
backdrop-filter: blur(3px);
|
||||
backdrop-filter: ${`blur(${props.theme.modalDialog.backdrop.blur}px)`};
|
||||
`};
|
||||
|
||||
display: ${(props) => (props.visible ? "block" : "none")};
|
||||
|
||||
@ -43,10 +43,12 @@ const StyledIconTheme = styled(StyledIcon)<
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
svg {
|
||||
path {
|
||||
fill: ${(props) => props.$currentColorScheme?.main?.accent};
|
||||
@media (hover: hover) {
|
||||
&:hover {
|
||||
svg {
|
||||
path {
|
||||
fill: ${(props) => props.$currentColorScheme?.main?.accent};
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -48,12 +48,15 @@ const StyledOuter = styled.div<IconButtonProps>`
|
||||
stroke: ${props.color || props.theme.iconButton.color};
|
||||
}
|
||||
}
|
||||
&:hover {
|
||||
svg {
|
||||
path {
|
||||
stroke: ${props.isDisabled
|
||||
? props.theme.iconButton.color
|
||||
: props.color || props.theme.iconButton.hoverColor};
|
||||
|
||||
@media (hover: hover) {
|
||||
&:hover {
|
||||
svg {
|
||||
path {
|
||||
stroke: ${props.isDisabled
|
||||
? props.theme.iconButton.color
|
||||
: props.color || props.theme.iconButton.hoverColor};
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -72,12 +75,15 @@ const StyledOuter = styled.div<IconButtonProps>`
|
||||
fill: ${props.color || props.theme.iconButton.color};
|
||||
}
|
||||
}
|
||||
&:hover {
|
||||
svg {
|
||||
path {
|
||||
fill: ${props.isDisabled
|
||||
? props.theme.iconButton.color
|
||||
: props.color || props.theme.iconButton.hoverColor};
|
||||
|
||||
@media (hover: hover) {
|
||||
&:hover {
|
||||
svg {
|
||||
path {
|
||||
fill: ${props.isDisabled
|
||||
? props.theme.iconButton.color
|
||||
: props.color || props.theme.iconButton.hoverColor};
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -49,14 +49,13 @@ const PreviewTile = ({
|
||||
</div>
|
||||
<div className="tile-tags">
|
||||
{tags.length ? (
|
||||
<Tags columnCount={2} tags={tags} onSelectTag={() => {}} />
|
||||
<Tags columnCount={2} tags={tags} />
|
||||
) : (
|
||||
<Tag
|
||||
className="type_tag"
|
||||
tag="script"
|
||||
label={defaultTagLabel}
|
||||
isDefault
|
||||
onClick={() => {}}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
|
||||
@ -82,6 +82,7 @@ const Navigation = ({
|
||||
onNavigationButtonClick,
|
||||
tariffBar,
|
||||
showNavigationButton,
|
||||
onContextOptionsClick,
|
||||
...rest
|
||||
}: INavigationProps) => {
|
||||
const [isOpen, setIsOpen] = React.useState(false);
|
||||
@ -291,6 +292,7 @@ const Navigation = ({
|
||||
tariffBar={tariffBar}
|
||||
title={title}
|
||||
isEmptyPage={isEmptyPage}
|
||||
onContextOptionsClick={onContextOptionsClick}
|
||||
/>
|
||||
</StyledContainer>
|
||||
{isDesktop && !hideInfoPanel && (
|
||||
|
||||
@ -50,6 +50,7 @@ export interface IContextButtonProps {
|
||||
id: string;
|
||||
title?: string;
|
||||
onCloseDropBox?: () => void;
|
||||
onContextOptionsClick?: () => void;
|
||||
}
|
||||
|
||||
export interface IPlusButtonProps {
|
||||
@ -95,6 +96,7 @@ export interface IControlButtonProps {
|
||||
title?: string;
|
||||
isEmptyPage?: boolean;
|
||||
onCloseDropBox?: () => void;
|
||||
onContextOptionsClick?: () => void;
|
||||
}
|
||||
|
||||
export interface ITextProps {
|
||||
@ -201,4 +203,5 @@ export interface INavigationProps {
|
||||
onNavigationButtonClick?: () => void;
|
||||
tariffBar: React.ReactElement;
|
||||
showNavigationButton: boolean;
|
||||
onContextOptionsClick?: () => void;
|
||||
}
|
||||
|
||||
@ -41,6 +41,7 @@ const ContextButton = ({
|
||||
isMobile,
|
||||
id,
|
||||
onCloseDropBox,
|
||||
onContextOptionsClick,
|
||||
...rest
|
||||
}: IContextButtonProps) => {
|
||||
const [isOpen, setIsOpen] = useState(false);
|
||||
@ -58,6 +59,7 @@ const ContextButton = ({
|
||||
};
|
||||
|
||||
const onClick = (e: React.MouseEvent<HTMLDivElement>) => {
|
||||
onContextOptionsClick?.();
|
||||
if (withMenu) toggle(e, !isOpen);
|
||||
};
|
||||
|
||||
|
||||
@ -63,6 +63,7 @@ const ControlButtons = ({
|
||||
title,
|
||||
isEmptyPage,
|
||||
onCloseDropBox,
|
||||
onContextOptionsClick,
|
||||
}: IControlButtonProps) => {
|
||||
const toggleInfoPanelAction = () => {
|
||||
toggleInfoPanel?.();
|
||||
@ -125,6 +126,7 @@ const ControlButtons = ({
|
||||
isTrashFolder={isTrashFolder}
|
||||
isMobile={isMobile || false}
|
||||
onCloseDropBox={onCloseDropBox}
|
||||
onContextOptionsClick={onContextOptionsClick}
|
||||
/>
|
||||
|
||||
{!isDesktop && (
|
||||
@ -180,6 +182,7 @@ const ControlButtons = ({
|
||||
isTrashFolder={isTrashFolder}
|
||||
isMobile={isMobile || false}
|
||||
onCloseDropBox={onCloseDropBox}
|
||||
onContextOptionsClick={onContextOptionsClick}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
|
||||
@ -44,6 +44,7 @@ const defaultMinColumnSize = 110;
|
||||
const settingsSize = 24;
|
||||
|
||||
const minSizeFirstColumn = 210;
|
||||
const handleOffset = 8;
|
||||
|
||||
class TableHeader extends React.Component<
|
||||
TableHeaderProps,
|
||||
@ -113,7 +114,7 @@ class TableHeader extends React.Component<
|
||||
? leftColumn.dataset.minWidth
|
||||
: defaultMinColumnSize;
|
||||
|
||||
if (leftColumn.clientWidth <= +minSize) {
|
||||
if (leftColumn.getBoundingClientRect().width <= +minSize) {
|
||||
if (colIndex < 0) return false;
|
||||
this.moveToLeft(widths, newWidth, colIndex - 1);
|
||||
return;
|
||||
@ -159,11 +160,17 @@ class TableHeader extends React.Component<
|
||||
const defaultColumn = document.getElementById(`column_${colIndex}`);
|
||||
if (!defaultColumn || defaultColumn.dataset.defaultSize) return;
|
||||
|
||||
const handleOffset = 8;
|
||||
|
||||
if (column2Width + offset - handleOffset >= defaultMinColumnSize) {
|
||||
widths[+columnIndex] = `${newWidth + handleOffset}px`;
|
||||
widths[colIndex] = `${column2Width + offset - handleOffset}px`;
|
||||
} else if (column2Width !== defaultMinColumnSize) {
|
||||
const width =
|
||||
getSubstring(widths[+columnIndex]) +
|
||||
getSubstring(widths[+colIndex]) -
|
||||
defaultMinColumnSize;
|
||||
|
||||
widths[+columnIndex] = `${width}px`;
|
||||
widths[colIndex] = `${defaultMinColumnSize}px`;
|
||||
} else {
|
||||
if (colIndex === columns.length) return false;
|
||||
this.moveToRight(widths, newWidth, colIndex + 1);
|
||||
@ -237,7 +244,7 @@ class TableHeader extends React.Component<
|
||||
if (!column) return;
|
||||
|
||||
const columnSize = column.getBoundingClientRect();
|
||||
const newWidth = isRtl
|
||||
let newWidth = isRtl
|
||||
? columnSize.right - e.clientX
|
||||
: e.clientX - columnSize.left;
|
||||
|
||||
@ -248,12 +255,14 @@ class TableHeader extends React.Component<
|
||||
? column.dataset.minWidth
|
||||
: defaultMinColumnSize;
|
||||
|
||||
if (newWidth <= +minSize) {
|
||||
const columnChanged = this.moveToLeft(widths, newWidth);
|
||||
if (newWidth <= +minSize - handleOffset) {
|
||||
const currentWidth = getSubstring(widths[+columnIndex]);
|
||||
|
||||
if (!columnChanged) {
|
||||
widths[+columnIndex] = widths[+columnIndex];
|
||||
}
|
||||
// Move left
|
||||
if (currentWidth !== +minSize) {
|
||||
newWidth = +minSize - handleOffset;
|
||||
this.moveToRight(widths, newWidth);
|
||||
} else this.moveToLeft(widths, newWidth);
|
||||
} else {
|
||||
this.moveToRight(widths, newWidth);
|
||||
}
|
||||
@ -339,6 +348,9 @@ class TableHeader extends React.Component<
|
||||
const storageSize =
|
||||
!resetColumnsSize && localStorage.getItem(columnStorageName);
|
||||
|
||||
const storageInfoSize =
|
||||
!resetColumnsSize && localStorage.getItem(columnInfoPanelStorageName);
|
||||
|
||||
// TODO: If defaultSize(75px) is less than defaultMinColumnSize(110px) the calculations work correctly
|
||||
const defaultSize =
|
||||
columns.find((col) => col.defaultSize && col.enable)?.defaultSize || 0;
|
||||
@ -369,6 +381,10 @@ class TableHeader extends React.Component<
|
||||
? storageSize.split(" ")
|
||||
: containerGridTemplateColumns;
|
||||
|
||||
const tableInfoContainer = storageInfoSize
|
||||
? storageInfoSize.split(" ")
|
||||
: containerGridTemplateColumns;
|
||||
|
||||
const { hideColumns } = this.state;
|
||||
|
||||
if (
|
||||
@ -398,9 +414,17 @@ class TableHeader extends React.Component<
|
||||
.map((column) => getSubstring(column))
|
||||
.reduce((x, y) => x + y);
|
||||
|
||||
const defaultInfoWidth = tableInfoContainer
|
||||
.map((column) => getSubstring(column))
|
||||
.reduce((x, y) => x + y);
|
||||
|
||||
const oldWidth = defaultWidth - defaultSize - settingsSize;
|
||||
|
||||
if (Math.round(defaultWidth) !== Math.round(containerWidth) && !isResized) {
|
||||
const isDifferentWindowSize = infoPanelVisible
|
||||
? Math.round(defaultInfoWidth) !== Math.round(containerWidth)
|
||||
: Math.round(defaultWidth) !== Math.round(containerWidth);
|
||||
|
||||
if (isDifferentWindowSize && !isResized) {
|
||||
if (infoPanelVisible) localStorage.removeItem(columnInfoPanelStorageName);
|
||||
else localStorage.removeItem(columnStorageName);
|
||||
this.onResize(true);
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@docspace/shared",
|
||||
"version": "2.5.1",
|
||||
"version": "2.6.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"build": "echo 'skip it'",
|
||||
|
||||
@ -666,7 +666,7 @@ export const getBaseTheme = () => {
|
||||
b: 38,
|
||||
a: 0.2,
|
||||
},
|
||||
blur: 10,
|
||||
blur: 9,
|
||||
},
|
||||
|
||||
content: {
|
||||
|
||||
@ -611,9 +611,9 @@ const Dark: TTheme = {
|
||||
},
|
||||
|
||||
scrollbar: {
|
||||
bgColor: "rgba(20, 20, 20, 0.4)",
|
||||
hoverBgColor: "rgba(20, 20, 20, 0.64)",
|
||||
pressBgColor: "rgba(20, 20, 20, 0.8)",
|
||||
bgColor: "rgba(136, 136, 136, 0.4)",
|
||||
hoverBgColor: "rgba(136, 136, 136, 0.64)",
|
||||
pressBgColor: "rgba(136, 136, 136, 0.8)",
|
||||
paddingInlineEnd: "17px !important",
|
||||
paddingInlineEndMobile: "8px !important",
|
||||
},
|
||||
@ -637,7 +637,7 @@ const Dark: TTheme = {
|
||||
b: 27,
|
||||
a: 0.4,
|
||||
},
|
||||
blur: 10,
|
||||
blur: 9,
|
||||
},
|
||||
|
||||
content: {
|
||||
|
||||
@ -164,3 +164,19 @@ export const getTitleWithoutExtension = (
|
||||
? titleWithoutExst
|
||||
: item.title;
|
||||
};
|
||||
|
||||
export const getLastColumn = (tableStorageName: string) => {
|
||||
if (!tableStorageName) return;
|
||||
|
||||
const storageColumns = localStorage.getItem(tableStorageName);
|
||||
if (!storageColumns) return;
|
||||
|
||||
const columns = storageColumns.split(",");
|
||||
const filterColumns = columns.filter(
|
||||
(column) => column !== "false" && column !== "QuickButtons",
|
||||
);
|
||||
|
||||
if (filterColumns.length > 1) return filterColumns[filterColumns.length - 1];
|
||||
|
||||
return null;
|
||||
};
|
||||
|
||||
Loading…
Reference in New Issue
Block a user