Merge pull request #1086 from ONLYOFFICE/Add-id-for-header-of-main-folders
Add id for header of main folders
This commit is contained in:
commit
8c7a5d9730
@ -89,6 +89,14 @@ const ArchiveDialogComponent = (props) => {
|
||||
const acceptButton =
|
||||
action === "archive" ? t("Common:OKButton") : t("Common:Restore");
|
||||
|
||||
const isArchive = action === "archive";
|
||||
const idButtonSubmit = isArchive
|
||||
? "shared_move-to-archived-modal_submit"
|
||||
: "restore-all_submit";
|
||||
const idButtonCancel = isArchive
|
||||
? "shared_move-to-archived-modal_cancel"
|
||||
: "restore-all_cancel";
|
||||
|
||||
return (
|
||||
<StyledModal
|
||||
isLoading={!tReady}
|
||||
@ -102,6 +110,7 @@ const ArchiveDialogComponent = (props) => {
|
||||
</ModalDialog.Body>
|
||||
<ModalDialog.Footer>
|
||||
<Button
|
||||
id={idButtonSubmit}
|
||||
key="OkButton"
|
||||
label={acceptButton}
|
||||
size="normal"
|
||||
@ -111,6 +120,7 @@ const ArchiveDialogComponent = (props) => {
|
||||
scale
|
||||
/>
|
||||
<Button
|
||||
id={idButtonCancel}
|
||||
key="CancelButton"
|
||||
label={t("Common:CancelButton")}
|
||||
size="normal"
|
||||
|
@ -98,6 +98,7 @@ class ChangeUserStatusDialogComponent extends React.Component {
|
||||
</ModalDialog.Body>
|
||||
<ModalDialog.Footer>
|
||||
<Button
|
||||
id="change-user-status-modal_submit"
|
||||
label={t("ChangeUsersStatusButton")}
|
||||
size="normal"
|
||||
primary
|
||||
@ -107,6 +108,7 @@ class ChangeUserStatusDialogComponent extends React.Component {
|
||||
isDisabled={userIDs.length === 0}
|
||||
/>
|
||||
<Button
|
||||
id="change-user-status-modal_cancel"
|
||||
label={t("Common:CancelButton")}
|
||||
size="normal"
|
||||
scale
|
||||
|
@ -109,6 +109,7 @@ class ChangeUserTypeDialogComponent extends React.Component {
|
||||
</ModalDialog.Body>
|
||||
<ModalDialog.Footer>
|
||||
<Button
|
||||
id="change-user-type-modal_submit"
|
||||
label={t("ChangeUserTypeButton")}
|
||||
size="normal"
|
||||
scale
|
||||
@ -118,6 +119,7 @@ class ChangeUserTypeDialogComponent extends React.Component {
|
||||
isDisabled={!userIDs.length}
|
||||
/>
|
||||
<Button
|
||||
id="change-user-type-modal_cancel"
|
||||
label={t("Common:CancelButton")}
|
||||
size="normal"
|
||||
scale
|
||||
|
@ -149,6 +149,7 @@ const CreateRoomDialog = ({
|
||||
{!!roomParams.type && (
|
||||
<ModalDialog.Footer>
|
||||
<Button
|
||||
id="shared_create-room-modal_submit"
|
||||
tabIndex={5}
|
||||
label={t("Common:Create")}
|
||||
size="normal"
|
||||
@ -158,6 +159,7 @@ const CreateRoomDialog = ({
|
||||
isLoading={isLoading}
|
||||
/>
|
||||
<Button
|
||||
id="shared_create-room-modal_cancel"
|
||||
tabIndex={5}
|
||||
label={t("Common:CancelButton")}
|
||||
size="normal"
|
||||
|
@ -2,6 +2,7 @@ import { RoomsType } from "@docspace/common/constants";
|
||||
|
||||
export const roomTypes = [
|
||||
{
|
||||
id: "shared_filling-forms-room",
|
||||
type: RoomsType.FillingFormsRoom,
|
||||
title: "FillingFormsRoomTitle",
|
||||
description: "FillingFormsRoomDescription",
|
||||
@ -10,6 +11,7 @@ export const roomTypes = [
|
||||
secondaryInfo: "FillingFormsRoomSecondaryInfo",
|
||||
},
|
||||
{
|
||||
id: "shared_collaboration-room",
|
||||
type: RoomsType.EditingRoom,
|
||||
title: "CollaborationRoomTitle",
|
||||
description: "CollaborationRoomDescription",
|
||||
@ -18,6 +20,7 @@ export const roomTypes = [
|
||||
secondaryInfo: "CollaborationRoomSecondaryInfo",
|
||||
},
|
||||
{
|
||||
id: "shared_review-room",
|
||||
type: RoomsType.ReviewRoom,
|
||||
title: "ReviewRoomTitle",
|
||||
description: "ReviewRoomDescription",
|
||||
@ -26,6 +29,7 @@ export const roomTypes = [
|
||||
secondaryInfo: "ReviewRoomSecondaryInfo",
|
||||
},
|
||||
{
|
||||
id: "shared_read-only-room",
|
||||
type: RoomsType.ReadOnlyRoom,
|
||||
title: "ViewOnlyRoomTitle",
|
||||
description: "ViewOnlyRoomDescription",
|
||||
@ -34,6 +38,7 @@ export const roomTypes = [
|
||||
secondaryInfo: "ViewOnlyRoomSecondaryInfo",
|
||||
},
|
||||
{
|
||||
id: "shared_custom-room",
|
||||
type: RoomsType.CustomRoom,
|
||||
title: "CustomRoomTitle",
|
||||
description: "CustomRoomDescription",
|
||||
|
@ -21,7 +21,13 @@ const StyledToggleParam = styled(StyledParam)`
|
||||
}
|
||||
`;
|
||||
|
||||
const ToggleParam = ({ title, description, isChecked, onCheckedChange }) => {
|
||||
const ToggleParam = ({
|
||||
id,
|
||||
title,
|
||||
description,
|
||||
isChecked,
|
||||
onCheckedChange,
|
||||
}) => {
|
||||
return (
|
||||
<StyledToggleParam isPrivate>
|
||||
<div className="set_room_params-info">
|
||||
@ -31,6 +37,7 @@ const ToggleParam = ({ title, description, isChecked, onCheckedChange }) => {
|
||||
<div className="set_room_params-info-description">{description}</div>
|
||||
</div>
|
||||
<ToggleButton
|
||||
id={id}
|
||||
className="set_room_params-toggle"
|
||||
isChecked={isChecked}
|
||||
onChange={onCheckedChange}
|
||||
|
@ -131,7 +131,15 @@ const StyledDisplayItem = styled(StyledRoomType)`
|
||||
}
|
||||
`;
|
||||
|
||||
const RoomType = ({ t, room, onClick, type = "listItem", isOpen }) => {
|
||||
const RoomType = ({
|
||||
t,
|
||||
room,
|
||||
onClick,
|
||||
type = "listItem",
|
||||
isOpen,
|
||||
id,
|
||||
selectedId,
|
||||
}) => {
|
||||
const arrowClassName =
|
||||
type === "dropdownButton"
|
||||
? "choose_room-forward_btn dropdown-button"
|
||||
@ -170,23 +178,37 @@ const RoomType = ({ t, room, onClick, type = "listItem", isOpen }) => {
|
||||
);
|
||||
|
||||
return type === "listItem" ? (
|
||||
<StyledListItem title={t(room.title)} onClick={onClick}>
|
||||
<StyledListItem id={id} title={t(room.title)} onClick={onClick}>
|
||||
{content}
|
||||
</StyledListItem>
|
||||
) : type === "dropdownButton" ? (
|
||||
<StyledDropdownButton
|
||||
id={id}
|
||||
title={t(room.title)}
|
||||
onClick={onClick}
|
||||
isOpen={isOpen}
|
||||
data-selected-id={selectedId}
|
||||
>
|
||||
{content}
|
||||
</StyledDropdownButton>
|
||||
) : type === "dropdownItem" ? (
|
||||
<StyledDropdownItem title={t(room.title)} onClick={onClick} isOpen={isOpen}>
|
||||
<StyledDropdownItem
|
||||
id={id}
|
||||
title={t(room.title)}
|
||||
onClick={onClick}
|
||||
isOpen={isOpen}
|
||||
data-selected-id={selectedId}
|
||||
>
|
||||
{content}
|
||||
</StyledDropdownItem>
|
||||
) : (
|
||||
<StyledDisplayItem title={t(room.title)}>{content}</StyledDisplayItem>
|
||||
<StyledDisplayItem
|
||||
id={id}
|
||||
title={t(room.title)}
|
||||
data-selected-id={selectedId}
|
||||
>
|
||||
{content}
|
||||
</StyledDisplayItem>
|
||||
);
|
||||
};
|
||||
|
||||
|
@ -41,6 +41,7 @@ const DropdownDesktop = ({ t, open, roomTypes, chooseRoomType }) => {
|
||||
<div className="dropdown-content">
|
||||
{roomTypes.map((room) => (
|
||||
<RoomType
|
||||
id={room.id}
|
||||
t={t}
|
||||
key={room.type}
|
||||
room={room}
|
||||
|
@ -72,6 +72,7 @@ const DropdownMobile = ({ t, open, onClose, roomTypes, chooseRoomType }) => {
|
||||
<div className="dropdown-mobile-content">
|
||||
{roomTypes.map((room) => (
|
||||
<RoomType
|
||||
id={room.id}
|
||||
t={t}
|
||||
key={room.type}
|
||||
room={room}
|
||||
|
@ -37,11 +37,12 @@ const RoomTypeDropdown = ({
|
||||
setRoomType(roomType);
|
||||
toggleDropdown();
|
||||
};
|
||||
|
||||
return (
|
||||
<StyledRoomTypeDropdown isOpen={isOpen}>
|
||||
<RoomType
|
||||
t={t}
|
||||
id="shared_select-room"
|
||||
selectedId={currentRoom.id}
|
||||
room={currentRoom}
|
||||
type="dropdownButton"
|
||||
isOpen={isOpen}
|
||||
|
@ -21,6 +21,7 @@ const RoomTypeList = ({ t, setRoomType }) => {
|
||||
<StyledRoomTypeList>
|
||||
{roomTypes.map((room) => (
|
||||
<RoomType
|
||||
id={room.id}
|
||||
t={t}
|
||||
key={room.type}
|
||||
room={room}
|
||||
|
@ -74,7 +74,7 @@ const SetRoomParams = ({
|
||||
)}
|
||||
|
||||
<InputParam
|
||||
id={"room-name"}
|
||||
id="shared_room-name"
|
||||
title={`${t("Common:Name")}:`}
|
||||
placeholder={t("NamePlaceholder")}
|
||||
value={roomParams.title}
|
||||
|
@ -19,7 +19,9 @@ const TagDropdown = ({
|
||||
const [dropdownMaxHeight, setDropdownMaxHeight] = useState(0);
|
||||
|
||||
useEffect(() => {
|
||||
document.getElementById("tags-input").addEventListener("keyup", onKeyPress);
|
||||
document
|
||||
.getElementById("shared_tags-input")
|
||||
.addEventListener("keyup", onKeyPress);
|
||||
|
||||
return () => document.removeEventListener("keyup", onKeyPress);
|
||||
});
|
||||
@ -39,7 +41,7 @@ const TagDropdown = ({
|
||||
};
|
||||
|
||||
const onClickOutside = () => {
|
||||
document.getElementById("tags-input").blur();
|
||||
document.getElementById("shared_tags-input").blur();
|
||||
};
|
||||
|
||||
const addNewTag = () => {
|
||||
|
@ -50,7 +50,7 @@ const TagInput = ({
|
||||
return (
|
||||
<StyledTagInput className="set_room_params-input set_room_params-tag_input">
|
||||
<InputParam
|
||||
id={"tags-input"}
|
||||
id="shared_tags-input"
|
||||
title={`${t("Common:Tags")}:`}
|
||||
placeholder={t("TagsPlaceholder")}
|
||||
value={tagInput}
|
||||
|
@ -221,6 +221,7 @@ const ThirdPartyComboBox = ({
|
||||
<StyledStorageLocation isOpen={isOpen}>
|
||||
<div className="set_room_params-thirdparty">
|
||||
<div
|
||||
id="shared_third-party-storage_combobox"
|
||||
className="set_room_params-thirdparty-combobox"
|
||||
onClick={toggleIsOpen}
|
||||
>
|
||||
@ -235,6 +236,7 @@ const ThirdPartyComboBox = ({
|
||||
</div>
|
||||
|
||||
<Button
|
||||
id="shared_third-party-storage_connect"
|
||||
isDisabled={
|
||||
!storageLocation?.provider ||
|
||||
!!storageLocation?.thirdpartyAccount ||
|
||||
@ -262,7 +264,8 @@ const ThirdPartyComboBox = ({
|
||||
>
|
||||
{thirdparties.map((thirdparty) => (
|
||||
<DropDownItem
|
||||
className="dropdown-item"
|
||||
id={thirdparty.id}
|
||||
className={`dropdown-item ${thirdparty.className ?? ""}`}
|
||||
label={thirdparty.title}
|
||||
key={thirdparty.id}
|
||||
height={32}
|
||||
|
@ -90,6 +90,7 @@ const ThirdPartyStorage = ({
|
||||
return (
|
||||
<StyledThirdPartyStorage>
|
||||
<ToggleParam
|
||||
id="shared_third-party-storage-toggle"
|
||||
title={t("ThirdPartyStorageTitle")}
|
||||
description={t("ThirdPartyStorageDescription")}
|
||||
isChecked={storageLocation.isThirdparty}
|
||||
@ -188,6 +189,7 @@ export default inject(
|
||||
(item) =>
|
||||
item && {
|
||||
id: item[0],
|
||||
className: `storage_${item[0].toLowerCase()}`,
|
||||
providerKey: item[0],
|
||||
isOauth: item.length > 1 && item[0] !== "WebDav",
|
||||
oauthHref: item.length > 1 && item[0] !== "WebDav" ? item[1] : "",
|
||||
|
@ -159,6 +159,7 @@ const DeleteDialogComponent = (props) => {
|
||||
</ModalDialog.Body>
|
||||
<ModalDialog.Footer>
|
||||
<Button
|
||||
id="delete-file-modal_submit"
|
||||
key="OkButton"
|
||||
label={accessButtonLabel}
|
||||
size="normal"
|
||||
@ -171,6 +172,7 @@ const DeleteDialogComponent = (props) => {
|
||||
isDisabled={!selection.length}
|
||||
/>
|
||||
<Button
|
||||
id="delete-file-modal_cancel"
|
||||
key="CancelButton"
|
||||
label={t("Common:CancelButton")}
|
||||
size="normal"
|
||||
|
@ -77,6 +77,7 @@ const EmptyTrashDialogComponent = (props) => {
|
||||
</ModalDialog.Body>
|
||||
<ModalDialog.Footer>
|
||||
<Button
|
||||
id="empty-archive_delete-submit"
|
||||
key="OkButton"
|
||||
label={t("DeleteForeverButton")}
|
||||
size="normal"
|
||||
@ -86,6 +87,7 @@ const EmptyTrashDialogComponent = (props) => {
|
||||
scale
|
||||
/>
|
||||
<Button
|
||||
id="empty-archive_delete-cancel"
|
||||
key="CancelButton"
|
||||
label={t("Common:CancelButton")}
|
||||
size="normal"
|
||||
|
@ -129,6 +129,7 @@ class SendInviteDialogComponent extends React.Component {
|
||||
</ModalDialog.Body>
|
||||
<ModalDialog.Footer>
|
||||
<Button
|
||||
id="send-inite-again-modal_submit"
|
||||
label={t("Common:SendButton")}
|
||||
size="normal"
|
||||
scale
|
||||
@ -138,6 +139,7 @@ class SendInviteDialogComponent extends React.Component {
|
||||
isDisabled={!userIds.length}
|
||||
/>
|
||||
<Button
|
||||
id="send-inite-again-modal_cancel"
|
||||
label={t("Common:CancelButton")}
|
||||
size="normal"
|
||||
scale
|
||||
|
@ -134,6 +134,7 @@ const SelectionPanelBody = ({
|
||||
|
||||
<div>
|
||||
<Button
|
||||
id="select-file-modal-submit"
|
||||
theme={theme}
|
||||
className="select-file-modal-dialog-buttons-save"
|
||||
primary
|
||||
@ -153,6 +154,7 @@ const SelectionPanelBody = ({
|
||||
isLoading={isDisableTree}
|
||||
/>
|
||||
<Button
|
||||
id="select-file-modal-cancel"
|
||||
theme={theme}
|
||||
className="modal-dialog-button"
|
||||
size="normal"
|
||||
|
@ -159,7 +159,7 @@ const SectionHeaderContent = (props) => {
|
||||
getHeaderMenu,
|
||||
cbMenuItems,
|
||||
getCheckboxItemLabel,
|
||||
|
||||
getMenuItemId,
|
||||
setInfoPanelIsVisible,
|
||||
isInfoPanelVisible,
|
||||
isOwner,
|
||||
@ -186,8 +186,10 @@ const SectionHeaderContent = (props) => {
|
||||
<>
|
||||
{cbMenuItems.map((key) => {
|
||||
const label = getCheckboxItemLabel(t, key);
|
||||
const id = getMenuItemId(key);
|
||||
return (
|
||||
<DropDownItem
|
||||
id={id}
|
||||
key={key}
|
||||
label={label}
|
||||
data-key={key}
|
||||
@ -226,7 +228,7 @@ const SectionHeaderContent = (props) => {
|
||||
const getContextOptions = () => {
|
||||
return [
|
||||
isOwner && {
|
||||
id: "main-button_administrator",
|
||||
id: "accounts-add_administrator",
|
||||
className: "main-button_drop-down",
|
||||
icon: "/static/images/person.admin.react.svg",
|
||||
label: t("Common:DocSpaceAdmin"),
|
||||
@ -235,7 +237,7 @@ const SectionHeaderContent = (props) => {
|
||||
key: "administrator",
|
||||
},
|
||||
{
|
||||
id: "main-button_manager",
|
||||
id: "accounts-add_manager",
|
||||
className: "main-button_drop-down",
|
||||
icon: "/static/images/person.manager.react.svg",
|
||||
label: t("Common:RoomAdmin"),
|
||||
@ -244,7 +246,7 @@ const SectionHeaderContent = (props) => {
|
||||
key: "manager",
|
||||
},
|
||||
{
|
||||
id: "main-button_user",
|
||||
id: "accounts-add_user",
|
||||
className: "main-button_drop-down",
|
||||
icon: "/static/images/person.user.react.svg",
|
||||
label: t("Common:User"),
|
||||
@ -257,7 +259,7 @@ const SectionHeaderContent = (props) => {
|
||||
isSeparator: true,
|
||||
},
|
||||
{
|
||||
id: "main-button_invite-again",
|
||||
id: "accounts-add_invite-again",
|
||||
className: "main-button_drop-down",
|
||||
icon: "/static/images/invite.again.react.svg",
|
||||
label: t("LblInviteAgain"),
|
||||
@ -296,6 +298,7 @@ const SectionHeaderContent = (props) => {
|
||||
{t("Accounts")}
|
||||
</Headline>
|
||||
<ContextMenuButton
|
||||
id="header_add-button"
|
||||
className="action-button"
|
||||
directionX="left"
|
||||
title={t("Common:Actions")}
|
||||
@ -314,6 +317,7 @@ const SectionHeaderContent = (props) => {
|
||||
) && (
|
||||
<div className="info-panel-toggle-bg">
|
||||
<IconButton
|
||||
id="info-panel-toggle--open"
|
||||
className="info-panel-toggle"
|
||||
iconName="images/panel.react.svg"
|
||||
size="16"
|
||||
@ -349,6 +353,7 @@ export default withRouter(
|
||||
isHeaderIndeterminate,
|
||||
isHeaderChecked,
|
||||
cbMenuItems,
|
||||
getMenuItemId,
|
||||
getCheckboxItemLabel,
|
||||
} = headerMenuStore;
|
||||
|
||||
@ -361,6 +366,7 @@ export default withRouter(
|
||||
isHeaderChecked,
|
||||
getHeaderMenu,
|
||||
cbMenuItems,
|
||||
getMenuItemId,
|
||||
getCheckboxItemLabel,
|
||||
setInfoPanelIsVisible,
|
||||
isInfoPanelVisible,
|
||||
|
@ -73,11 +73,43 @@ class DetailsHelper {
|
||||
getPropertyList = () => {
|
||||
return this.getNeededProperties().map((propertyId) => ({
|
||||
id: propertyId,
|
||||
className: this.getPropertyClassName(propertyId),
|
||||
title: this.getPropertyTitle(propertyId),
|
||||
content: this.getPropertyContent(propertyId),
|
||||
}));
|
||||
};
|
||||
|
||||
getPropertyClassName = (propertyId) => {
|
||||
switch (propertyId) {
|
||||
case "Owner":
|
||||
return "info_details_owner";
|
||||
case "Location":
|
||||
return "info_details_location";
|
||||
case "Type":
|
||||
return "info_details_type";
|
||||
case "Storage Type":
|
||||
return "info_details_storage-type";
|
||||
case "File extension":
|
||||
return "info_details_file-extension";
|
||||
case "Content":
|
||||
return "info_details_content";
|
||||
case "Size":
|
||||
return "info_details_size";
|
||||
case "Date modified":
|
||||
return "info_details_date_modified";
|
||||
case "Last modified by":
|
||||
return "info_details_last-modified-by";
|
||||
case "Creation date":
|
||||
return "info_details_creation-date";
|
||||
case "Versions":
|
||||
return "info_details_versions";
|
||||
case "Comments":
|
||||
return "info_details_comments";
|
||||
case "Tags":
|
||||
return "info_details_tags";
|
||||
}
|
||||
};
|
||||
|
||||
getNeededProperties = () => {
|
||||
return (this.item.isRoom
|
||||
? [
|
||||
|
@ -69,13 +69,13 @@ const InfoPanelBodyContent = ({
|
||||
if (isAccounts) return viewHelper.AccountsView();
|
||||
|
||||
switch (isRooms ? roomsView : fileView) {
|
||||
case "members": {
|
||||
case "info_members": {
|
||||
return viewHelper.MembersView();
|
||||
}
|
||||
case "history": {
|
||||
case "info_history": {
|
||||
return viewHelper.HistoryView();
|
||||
}
|
||||
case "details": {
|
||||
case "info_details": {
|
||||
return viewHelper.DetailsView();
|
||||
}
|
||||
}
|
||||
|
@ -71,7 +71,11 @@ const AccountsItemTitle = ({
|
||||
)}
|
||||
</div>
|
||||
{!!contextOptions.length && (
|
||||
<ContextMenuButton className="context-button" getData={getData} />
|
||||
<ContextMenuButton
|
||||
id="info-accounts-options"
|
||||
className="context-button"
|
||||
getData={getData}
|
||||
/>
|
||||
)}
|
||||
</StyledAccountsItemTitle>
|
||||
);
|
||||
|
@ -71,6 +71,7 @@ const ItemContextOptions = ({
|
||||
/>
|
||||
{options?.length > 0 && (
|
||||
<ContextMenuButton
|
||||
id="info-options"
|
||||
className="expandButton"
|
||||
title={"Show item actions"}
|
||||
onClick={onContextMenu}
|
||||
|
@ -35,7 +35,7 @@ const ItemTitle = ({
|
||||
const filesItemSelection =
|
||||
isRooms &&
|
||||
!isSeveralItems &&
|
||||
roomsView === "members" &&
|
||||
roomsView === "info_members" &&
|
||||
!selection.isRoom &&
|
||||
!!selectionParentRoom
|
||||
? selectionParentRoom
|
||||
|
@ -58,18 +58,21 @@ const Accounts = ({
|
||||
const options = [];
|
||||
|
||||
const adminOption = {
|
||||
id: "info-account-type_docspace-admin",
|
||||
key: "admin",
|
||||
title: t("Common:DocSpaceAdmin"),
|
||||
label: t("Common:DocSpaceAdmin"),
|
||||
action: "admin",
|
||||
};
|
||||
const managerOption = {
|
||||
id: "info-account-type_room-admin",
|
||||
key: "manager",
|
||||
title: t("Common:RoomAdmin"),
|
||||
label: t("Common:RoomAdmin"),
|
||||
action: "manager",
|
||||
};
|
||||
const userOption = {
|
||||
id: "info-account-type_user",
|
||||
key: "user",
|
||||
title: t("Common:User"),
|
||||
label: t("Common:User"),
|
||||
@ -99,6 +102,7 @@ const Accounts = ({
|
||||
|
||||
const combobox = (
|
||||
<ComboBox
|
||||
id="info-account-type-select"
|
||||
className="type-combobox"
|
||||
selectedOption={
|
||||
typesOptions.find((option) => option.key === role) || {}
|
||||
|
@ -85,7 +85,11 @@ const Details = ({
|
||||
<StyledProperties>
|
||||
{itemProperties.map((property) => {
|
||||
return (
|
||||
<div key={property.title} className="property">
|
||||
<div
|
||||
id={property.id}
|
||||
key={property.title}
|
||||
className={`property ${property.className}`}
|
||||
>
|
||||
<Text className="property-title">{property.title}</Text>
|
||||
{property.content}
|
||||
</div>
|
||||
|
@ -130,6 +130,7 @@ const Members = ({
|
||||
</Text>
|
||||
{canInviteUserInRoomAbility && (
|
||||
<IconButton
|
||||
id="info_add-user"
|
||||
className={"icon"}
|
||||
title={t("Common:AddUsers")}
|
||||
iconName="/static/images/person+.react.svg"
|
||||
|
@ -47,27 +47,27 @@ const InfoPanelHeaderContent = (props) => {
|
||||
|
||||
const closeInfoPanel = () => setIsVisible(false);
|
||||
|
||||
const setMembers = () => setView("members");
|
||||
const setHistory = () => setView("history");
|
||||
const setDetails = () => setView("details");
|
||||
const setMembers = () => setView("info_members");
|
||||
const setHistory = () => setView("info_history");
|
||||
const setDetails = () => setView("info_details");
|
||||
|
||||
const isArchiveRoot = rootFolderType === FolderType.Archive;
|
||||
|
||||
const submenuData = [
|
||||
{
|
||||
id: "members",
|
||||
id: "info_members",
|
||||
name: t("InfoPanel:SubmenuMembers"),
|
||||
onClick: setMembers,
|
||||
content: null,
|
||||
},
|
||||
{
|
||||
id: "history",
|
||||
id: "info_history",
|
||||
name: t("InfoPanel:SubmenuHistory"),
|
||||
onClick: setHistory,
|
||||
content: null,
|
||||
},
|
||||
{
|
||||
id: "details",
|
||||
id: "info_details",
|
||||
name: t("InfoPanel:SubmenuDetails"),
|
||||
onClick: setDetails,
|
||||
content: null,
|
||||
@ -100,6 +100,7 @@ const InfoPanelHeaderContent = (props) => {
|
||||
{!isTablet && (
|
||||
<div className="info-panel-toggle-bg">
|
||||
<IconButton
|
||||
id="info-panel-toggle--close"
|
||||
className="info-panel-toggle"
|
||||
iconName="images/panel.react.svg"
|
||||
size="16"
|
||||
|
@ -136,35 +136,41 @@ class SectionHeaderContent extends React.Component {
|
||||
]
|
||||
: [
|
||||
{
|
||||
id: "personal_new-documnet",
|
||||
key: "new-document",
|
||||
label: t("NewDocument"),
|
||||
onClick: this.createDocument,
|
||||
icon: "images/actions.documents.react.svg",
|
||||
},
|
||||
{
|
||||
id: "personal_new-spreadsheet",
|
||||
key: "new-spreadsheet",
|
||||
label: t("NewSpreadsheet"),
|
||||
onClick: this.createSpreadsheet,
|
||||
icon: "images/spreadsheet.react.svg",
|
||||
},
|
||||
{
|
||||
id: "personal_new-presentation",
|
||||
key: "new-presentation",
|
||||
label: t("NewPresentation"),
|
||||
onClick: this.createPresentation,
|
||||
icon: "images/actions.presentation.react.svg",
|
||||
},
|
||||
{
|
||||
id: "personal_form-template",
|
||||
icon: "images/form.react.svg",
|
||||
label: t("Translations:NewForm"),
|
||||
key: "new-form-base",
|
||||
items: [
|
||||
{
|
||||
id: "personal_template_black",
|
||||
key: "new-form",
|
||||
label: t("Translations:SubNewForm"),
|
||||
icon: "images/form.blank.react.svg",
|
||||
onClick: this.createForm,
|
||||
},
|
||||
{
|
||||
id: "personal_template_new-form-file",
|
||||
key: "new-form-file",
|
||||
label: t("Translations:SubNewFormFile"),
|
||||
icon: "images/form.file.react.svg",
|
||||
@ -172,6 +178,7 @@ class SectionHeaderContent extends React.Component {
|
||||
disabled: isPrivacyFolder,
|
||||
},
|
||||
{
|
||||
id: "personal_template_oforms-gallery",
|
||||
key: "oforms-gallery",
|
||||
label: t("Common:OFORMsGallery"),
|
||||
icon: "images/form.gallery.react.svg",
|
||||
@ -181,6 +188,7 @@ class SectionHeaderContent extends React.Component {
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "personal_new-folder",
|
||||
key: "new-folder",
|
||||
label: t("NewFolder"),
|
||||
onClick: this.createFolder,
|
||||
@ -355,6 +363,7 @@ class SectionHeaderContent extends React.Component {
|
||||
if (isArchiveFolder) {
|
||||
return [
|
||||
{
|
||||
id: "header_option_empty-archive",
|
||||
key: "empty-archive",
|
||||
label: t("ArchiveAction"),
|
||||
onClick: this.onEmptyTrashAction,
|
||||
@ -362,6 +371,7 @@ class SectionHeaderContent extends React.Component {
|
||||
icon: "images/clear.trash.react.svg",
|
||||
},
|
||||
{
|
||||
id: "header_option_restore-all",
|
||||
key: "restore-all",
|
||||
label: t("RestoreAll"),
|
||||
onClick: this.onRestoreAllArchiveAction,
|
||||
@ -373,6 +383,7 @@ class SectionHeaderContent extends React.Component {
|
||||
|
||||
return [
|
||||
{
|
||||
id: "header_option_sharing-settings",
|
||||
key: "sharing-settings",
|
||||
label: t("SharingPanel:SharingSettingsTitle"),
|
||||
onClick: this.onOpenSharingPanel,
|
||||
@ -380,6 +391,7 @@ class SectionHeaderContent extends React.Component {
|
||||
icon: "/static/images/share.react.svg",
|
||||
},
|
||||
{
|
||||
id: "header_option_link-portal-users",
|
||||
key: "link-portal-users",
|
||||
label: t("LinkForPortalUsers"),
|
||||
onClick: this.createLinkForPortalUsers,
|
||||
@ -387,6 +399,7 @@ class SectionHeaderContent extends React.Component {
|
||||
icon: "/static/images/invitation.link.react.svg",
|
||||
},
|
||||
{
|
||||
id: "header_option_empty-trash",
|
||||
key: "empty-trash",
|
||||
label: t("RecycleBinAction"),
|
||||
onClick: this.onEmptyTrashAction,
|
||||
@ -394,6 +407,7 @@ class SectionHeaderContent extends React.Component {
|
||||
icon: "images/clear.trash.react.svg",
|
||||
},
|
||||
{
|
||||
id: "header_option_restore-all",
|
||||
key: "restore-all",
|
||||
label: t("RestoreAll"),
|
||||
onClick: this.onRestoreAllAction,
|
||||
@ -401,6 +415,7 @@ class SectionHeaderContent extends React.Component {
|
||||
icon: "images/subtract.react.svg",
|
||||
},
|
||||
{
|
||||
id: "header_option_show-info",
|
||||
key: "show-info",
|
||||
label: t("InfoPanel:ViewDetails"),
|
||||
onClick: this.onShowInfo,
|
||||
@ -408,6 +423,7 @@ class SectionHeaderContent extends React.Component {
|
||||
icon: "/static/images/info.outline.react.svg",
|
||||
},
|
||||
{
|
||||
id: "header_option_reconnect-storage",
|
||||
key: "reconnect-storage",
|
||||
label: t("Common:ReconnectStorage"),
|
||||
icon: "images/reconnect.svg",
|
||||
@ -415,6 +431,7 @@ class SectionHeaderContent extends React.Component {
|
||||
disabled: !selectedFolder.providerKey || !isRoom,
|
||||
},
|
||||
{
|
||||
id: "header_option_edit-room",
|
||||
key: "edit-room",
|
||||
label: t("EditRoom"),
|
||||
icon: "images/settings.react.svg",
|
||||
@ -422,6 +439,7 @@ class SectionHeaderContent extends React.Component {
|
||||
disabled: !isRoom,
|
||||
},
|
||||
{
|
||||
id: "header_option_invite-users-to-room",
|
||||
key: "invite-users-to-room",
|
||||
label: t("InviteUsers"),
|
||||
icon: "/static/images/person.react.svg",
|
||||
@ -429,14 +447,21 @@ class SectionHeaderContent extends React.Component {
|
||||
disabled: !isRoom,
|
||||
},
|
||||
{
|
||||
id: "header_option_room-info",
|
||||
key: "room-info",
|
||||
label: t("Common:Info"),
|
||||
icon: "/static/images/info.outline.react.svg",
|
||||
onClick: this.onToggleInfoPanel,
|
||||
disabled: !isRoom,
|
||||
},
|
||||
{ key: "separator-2", isSeparator: true, disabled: isRecycleBinFolder },
|
||||
{
|
||||
id: "header_option_separator-2",
|
||||
key: "separator-2",
|
||||
isSeparator: true,
|
||||
disabled: isRecycleBinFolder,
|
||||
},
|
||||
{
|
||||
id: "header_option_archive-room",
|
||||
key: "archive-room",
|
||||
label: t("Archived"),
|
||||
icon: "/static/images/room.archive.svg",
|
||||
@ -446,6 +471,7 @@ class SectionHeaderContent extends React.Component {
|
||||
action: "archive",
|
||||
},
|
||||
{
|
||||
id: "header_option_download",
|
||||
key: "download",
|
||||
label: t("Common:Download"),
|
||||
onClick: this.downloadAction,
|
||||
@ -453,6 +479,7 @@ class SectionHeaderContent extends React.Component {
|
||||
icon: "images/download.react.svg",
|
||||
},
|
||||
{
|
||||
id: "header_option_move-to",
|
||||
key: "move-to",
|
||||
label: t("MoveTo"),
|
||||
onClick: this.onMoveAction,
|
||||
@ -460,6 +487,7 @@ class SectionHeaderContent extends React.Component {
|
||||
icon: "images/move.react.svg",
|
||||
},
|
||||
{
|
||||
id: "header_option_copy",
|
||||
key: "copy",
|
||||
label: t("Translations:Copy"),
|
||||
onClick: this.onCopyAction,
|
||||
@ -467,6 +495,7 @@ class SectionHeaderContent extends React.Component {
|
||||
icon: "/static/images/copy.react.svg",
|
||||
},
|
||||
{
|
||||
id: "header_option_rename",
|
||||
key: "rename",
|
||||
label: t("Rename"),
|
||||
onClick: this.renameAction,
|
||||
@ -474,11 +503,13 @@ class SectionHeaderContent extends React.Component {
|
||||
icon: "images/rename.react.svg",
|
||||
},
|
||||
{
|
||||
id: "header_option_separator-3",
|
||||
key: "separator-3",
|
||||
isSeparator: true,
|
||||
disabled: isDisabled,
|
||||
},
|
||||
{
|
||||
id: "header_option_delete",
|
||||
key: "delete",
|
||||
label: t("Common:Delete"),
|
||||
onClick: this.onDeleteAction,
|
||||
@ -506,14 +537,20 @@ class SectionHeaderContent extends React.Component {
|
||||
};
|
||||
|
||||
getMenuItems = () => {
|
||||
const { t, cbMenuItems, getCheckboxItemLabel } = this.props;
|
||||
|
||||
const {
|
||||
t,
|
||||
cbMenuItems,
|
||||
getCheckboxItemLabel,
|
||||
getCheckboxItemId,
|
||||
} = this.props;
|
||||
const checkboxOptions = (
|
||||
<>
|
||||
{cbMenuItems.map((key) => {
|
||||
const label = getCheckboxItemLabel(t, key);
|
||||
const id = getCheckboxItemId(key);
|
||||
return (
|
||||
<DropDownItem
|
||||
id={id}
|
||||
key={key}
|
||||
label={label}
|
||||
data-key={key}
|
||||
@ -700,6 +737,7 @@ export default inject(
|
||||
isThirdPartySelection,
|
||||
cbMenuItems,
|
||||
getCheckboxItemLabel,
|
||||
getCheckboxItemId,
|
||||
isEmptyFilesList,
|
||||
getFolderInfo,
|
||||
setBufferSelection,
|
||||
@ -817,6 +855,7 @@ export default inject(
|
||||
getHeaderMenu,
|
||||
backToParentFolder,
|
||||
getCheckboxItemLabel,
|
||||
getCheckboxItemId,
|
||||
setSelectFileDialogVisible,
|
||||
|
||||
isRecycleBinFolder,
|
||||
|
@ -39,6 +39,7 @@ class AccountsContextOptionsStore {
|
||||
|
||||
case "profile":
|
||||
return {
|
||||
id: "option_profile",
|
||||
key: option,
|
||||
icon: "/static/images/profile.react.svg",
|
||||
label: t("Common:Profile"),
|
||||
@ -47,6 +48,7 @@ class AccountsContextOptionsStore {
|
||||
|
||||
case "change-name":
|
||||
return {
|
||||
id: "option_change-name",
|
||||
key: option,
|
||||
icon: "images/pencil.react.svg",
|
||||
label: t("PeopleTranslations:NameChangeButton"),
|
||||
@ -54,6 +56,7 @@ class AccountsContextOptionsStore {
|
||||
};
|
||||
case "change-email":
|
||||
return {
|
||||
id: "option_change-email",
|
||||
key: option,
|
||||
icon: "images/change.mail.react.svg",
|
||||
label: t("PeopleTranslations:EmailChangeButton"),
|
||||
@ -61,6 +64,7 @@ class AccountsContextOptionsStore {
|
||||
};
|
||||
case "change-password":
|
||||
return {
|
||||
id: "option_change-password",
|
||||
key: option,
|
||||
icon: "images/change.security.react.svg",
|
||||
label: t("PeopleTranslations:PasswordChangeButton"),
|
||||
@ -68,6 +72,7 @@ class AccountsContextOptionsStore {
|
||||
};
|
||||
case "change-owner":
|
||||
return {
|
||||
id: "option_change-owner",
|
||||
key: option,
|
||||
icon: "/static/images/refresh.react.svg",
|
||||
label: t("Translations:OwnerChange"),
|
||||
@ -76,6 +81,7 @@ class AccountsContextOptionsStore {
|
||||
|
||||
case "enable":
|
||||
return {
|
||||
id: "option_enable",
|
||||
key: option,
|
||||
icon: "images/enable.react.svg",
|
||||
label: t("PeopleTranslations:EnableUserButton"),
|
||||
@ -83,6 +89,7 @@ class AccountsContextOptionsStore {
|
||||
};
|
||||
case "disable":
|
||||
return {
|
||||
id: "option_disable",
|
||||
key: option,
|
||||
icon: "images/remove.react.svg",
|
||||
label: t("PeopleTranslations:DisableUserButton"),
|
||||
@ -91,6 +98,7 @@ class AccountsContextOptionsStore {
|
||||
|
||||
case "reassign-data":
|
||||
return {
|
||||
id: "option_reassign-data",
|
||||
key: option,
|
||||
icon: "images/ressing_data.react.svg",
|
||||
label: t("PeopleTranslations:ReassignData"),
|
||||
@ -98,6 +106,7 @@ class AccountsContextOptionsStore {
|
||||
};
|
||||
case "delete-personal-data":
|
||||
return {
|
||||
id: "option_delete-personal-data",
|
||||
key: option,
|
||||
icon: "images/del_data.react.svg",
|
||||
label: t("PeopleTranslations:RemoveData"),
|
||||
@ -105,6 +114,7 @@ class AccountsContextOptionsStore {
|
||||
};
|
||||
case "delete-user":
|
||||
return {
|
||||
id: "option_delete-user",
|
||||
key: option,
|
||||
icon: "images/trash.react.svg",
|
||||
label: t("DeleteProfileEverDialog:DeleteUser"),
|
||||
@ -113,6 +123,7 @@ class AccountsContextOptionsStore {
|
||||
|
||||
case "details":
|
||||
return {
|
||||
id: "option_details",
|
||||
key: option,
|
||||
icon: "images/info.react.svg",
|
||||
label: t("Common:Info"),
|
||||
@ -121,6 +132,7 @@ class AccountsContextOptionsStore {
|
||||
|
||||
case "invite-again":
|
||||
return {
|
||||
id: "option_invite-again",
|
||||
key: option,
|
||||
icon: "/static/images/invite.again.react.svg",
|
||||
label: t("LblInviteAgain"),
|
||||
@ -128,6 +140,7 @@ class AccountsContextOptionsStore {
|
||||
};
|
||||
case "reset-auth":
|
||||
return {
|
||||
id: "option_reset-auth",
|
||||
key: option,
|
||||
icon: "images/restore.auth.react.svg",
|
||||
label: t("PeopleTranslations:ResetAuth"),
|
||||
|
@ -469,6 +469,7 @@ class ContextOptionsStore {
|
||||
|
||||
const blockAction = isCanWebEdit
|
||||
? {
|
||||
id: "option_block-unblock-version",
|
||||
key: "block-unblock-version",
|
||||
label: t("UnblockVersion"),
|
||||
icon: "/static/images/locked.react.svg",
|
||||
@ -486,6 +487,7 @@ class ContextOptionsStore {
|
||||
? onlyShowVersionHistory
|
||||
? [
|
||||
{
|
||||
id: "option_show-version-history",
|
||||
key: "show-version-history",
|
||||
label: t("ShowVersionHistory"),
|
||||
icon: "images/history.react.svg",
|
||||
@ -495,11 +497,13 @@ class ContextOptionsStore {
|
||||
]
|
||||
: [
|
||||
{
|
||||
id: "option_version",
|
||||
key: "version",
|
||||
label: t("VersionHistory"),
|
||||
icon: "images/history-finalized.react.svg",
|
||||
items: [
|
||||
{
|
||||
id: "option_finalize-version",
|
||||
key: "finalize-version",
|
||||
label: t("FinalizeVersion"),
|
||||
icon: "images/history-finalized.react.svg",
|
||||
@ -507,6 +511,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_version-history",
|
||||
key: "show-version-history",
|
||||
label: t("ShowVersionHistory"),
|
||||
icon: "images/history.react.svg",
|
||||
@ -519,6 +524,7 @@ class ContextOptionsStore {
|
||||
]
|
||||
: [
|
||||
{
|
||||
id: "option_finalize-version",
|
||||
key: "finalize-version",
|
||||
label: t("FinalizeVersion"),
|
||||
icon: "images/history-finalized.react.svg",
|
||||
@ -526,6 +532,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_version-history",
|
||||
key: "show-version-history",
|
||||
label: t("ShowVersionHistory"),
|
||||
icon: "images/history.react.svg",
|
||||
@ -539,11 +546,13 @@ class ContextOptionsStore {
|
||||
!isMobile && !isMobileUtils() && !isTabletUtils()
|
||||
? [
|
||||
{
|
||||
id: "option_move-or-copy",
|
||||
key: "move",
|
||||
label: t("MoveOrCopy"),
|
||||
icon: "/static/images/copy.react.svg",
|
||||
items: [
|
||||
{
|
||||
id: "option_move-to",
|
||||
key: "move-to",
|
||||
label: t("MoveTo"),
|
||||
icon: "images/move.react.svg",
|
||||
@ -551,6 +560,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_copy-to",
|
||||
key: "copy-to",
|
||||
label: t("Translations:Copy"),
|
||||
icon: "/static/images/copy.react.svg",
|
||||
@ -558,6 +568,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_create-copy",
|
||||
key: "copy",
|
||||
label: t("Common:Duplicate"),
|
||||
icon: "/static/images/duplicate.react.svg",
|
||||
@ -569,6 +580,7 @@ class ContextOptionsStore {
|
||||
]
|
||||
: [
|
||||
{
|
||||
id: "option_move-to",
|
||||
key: "move-to",
|
||||
label: t("MoveTo"),
|
||||
icon: "images/move.react.svg",
|
||||
@ -576,6 +588,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_copy-to",
|
||||
key: "copy-to",
|
||||
label: t("Translations:Copy"),
|
||||
icon: "/static/images/copy.react.svg",
|
||||
@ -583,6 +596,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_create-copy",
|
||||
key: "copy",
|
||||
label: t("Common:Duplicate"),
|
||||
icon: "/static/images/duplicate.react.svg",
|
||||
@ -593,6 +607,7 @@ class ContextOptionsStore {
|
||||
|
||||
const optionsModel = [
|
||||
{
|
||||
id: "option_select",
|
||||
key: "select",
|
||||
label: "Select",
|
||||
icon: "images/check-box.react.svg",
|
||||
@ -600,6 +615,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_open",
|
||||
key: "open",
|
||||
label: t("Open"),
|
||||
icon: "images/folder.react.svg",
|
||||
@ -607,6 +623,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_fill-form",
|
||||
key: "fill-form",
|
||||
label: t("Common:FillFormButton"),
|
||||
icon: "/static/images/form.fill.rect.svg",
|
||||
@ -614,6 +631,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_edit",
|
||||
key: "edit",
|
||||
label: t("Common:EditButton"),
|
||||
icon: "/static/images/access.edit.react.svg",
|
||||
@ -621,6 +639,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_preview",
|
||||
key: "preview",
|
||||
label: t("Preview"),
|
||||
icon: "/static/images/eye.react.svg",
|
||||
@ -628,6 +647,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_view",
|
||||
key: "view",
|
||||
label: t("Common:View"),
|
||||
icon: "/static/images/eye.react.svg",
|
||||
@ -635,6 +655,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_make-form",
|
||||
key: "make-form",
|
||||
label: t("Common:MakeForm"),
|
||||
icon: "/static/images/form.plus.react.svg",
|
||||
@ -646,6 +667,7 @@ class ContextOptionsStore {
|
||||
isSeparator: true,
|
||||
},
|
||||
{
|
||||
id: "option_reconnect-storage",
|
||||
key: "reconnect-storage",
|
||||
label: t("Common:ReconnectStorage"),
|
||||
icon: "images/reconnect.svg",
|
||||
@ -653,6 +675,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_edit-room",
|
||||
key: "edit-room",
|
||||
label: t("EditRoom"),
|
||||
icon: "images/settings.react.svg",
|
||||
@ -660,6 +683,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_invite-users-to-room",
|
||||
key: "invite-users-to-room",
|
||||
label: t("InviteUsers"),
|
||||
icon: "/static/images/person.react.svg",
|
||||
@ -668,6 +692,7 @@ class ContextOptionsStore {
|
||||
action: item.id,
|
||||
},
|
||||
{
|
||||
id: "option_room-info",
|
||||
key: "room-info",
|
||||
label: t("Common:Info"),
|
||||
icon: "/static/images/info.outline.react.svg",
|
||||
@ -675,6 +700,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_pin-room",
|
||||
key: "pin-room",
|
||||
label: t("Pin"),
|
||||
icon: "/static/images/pin.react.svg",
|
||||
@ -684,6 +710,7 @@ class ContextOptionsStore {
|
||||
action: "pin",
|
||||
},
|
||||
{
|
||||
id: "option_unpin-room",
|
||||
key: "unpin-room",
|
||||
label: t("Unpin"),
|
||||
icon: "/static/images/unpin.react.svg",
|
||||
@ -693,6 +720,7 @@ class ContextOptionsStore {
|
||||
action: "unpin",
|
||||
},
|
||||
{
|
||||
id: "option_sharing-settings",
|
||||
key: "sharing-settings",
|
||||
label: t("SharingPanel:SharingSettingsTitle"),
|
||||
icon: "/static/images/share.react.svg",
|
||||
@ -700,6 +728,7 @@ class ContextOptionsStore {
|
||||
disabled: !isShareable,
|
||||
},
|
||||
{
|
||||
id: "option_owner-change",
|
||||
key: "owner-change",
|
||||
label: t("Translations:OwnerChange"),
|
||||
icon: "images/file.actions.owner.react.svg",
|
||||
@ -707,6 +736,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_link-for-portal-users",
|
||||
key: "link-for-portal-users",
|
||||
label: t("LinkForPortalUsers"),
|
||||
icon: "/static/images/invitation.link.react.svg",
|
||||
@ -714,6 +744,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_send-by-email",
|
||||
key: "send-by-email",
|
||||
label: t("SendByEmail"),
|
||||
icon: "/static/images/mail.react.svg",
|
||||
@ -721,6 +752,7 @@ class ContextOptionsStore {
|
||||
},
|
||||
...versionActions,
|
||||
{
|
||||
id: "option_show-info",
|
||||
key: "show-info",
|
||||
label: t("Common:Info"),
|
||||
icon: "/static/images/info.outline.react.svg",
|
||||
@ -733,6 +765,7 @@ class ContextOptionsStore {
|
||||
isSeparator: true,
|
||||
},
|
||||
{
|
||||
id: "option_open-location",
|
||||
key: "open-location",
|
||||
label: t("OpenLocation"),
|
||||
icon: "images/folder.location.react.svg",
|
||||
@ -740,6 +773,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_mark-read",
|
||||
key: "mark-read",
|
||||
label: t("MarkRead"),
|
||||
icon: "images/tick.rounded.svg",
|
||||
@ -747,6 +781,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_mark-as-favorite",
|
||||
key: "mark-as-favorite",
|
||||
label: t("MarkAsFavorite"),
|
||||
icon: "images/favorites.react.svg",
|
||||
@ -756,6 +791,7 @@ class ContextOptionsStore {
|
||||
action: "mark",
|
||||
},
|
||||
{
|
||||
id: "option_remove-from-favorites",
|
||||
key: "remove-from-favorites",
|
||||
label: t("RemoveFromFavorites"),
|
||||
icon: "images/favorites.react.svg",
|
||||
@ -765,6 +801,7 @@ class ContextOptionsStore {
|
||||
action: "remove",
|
||||
},
|
||||
{
|
||||
id: "option_download",
|
||||
key: "download",
|
||||
label: t("Common:Download"),
|
||||
icon: "images/download.react.svg",
|
||||
@ -772,6 +809,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_download-as",
|
||||
key: "download-as",
|
||||
label: t("Translations:DownloadAs"),
|
||||
icon: "images/download-as.react.svg",
|
||||
@ -780,6 +818,7 @@ class ContextOptionsStore {
|
||||
},
|
||||
...moveActions,
|
||||
{
|
||||
id: "option_restore",
|
||||
key: "restore",
|
||||
label: t("Common:Restore"),
|
||||
icon: "images/move.react.svg",
|
||||
@ -787,6 +826,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_rename",
|
||||
key: "rename",
|
||||
label: t("Rename"),
|
||||
icon: "images/rename.react.svg",
|
||||
@ -798,6 +838,7 @@ class ContextOptionsStore {
|
||||
isSeparator: true,
|
||||
},
|
||||
{
|
||||
id: "option_unsubscribe",
|
||||
key: "unsubscribe",
|
||||
label: t("RemoveFromList"),
|
||||
icon: "images/remove.svg",
|
||||
@ -805,6 +846,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_change-thirdparty-info",
|
||||
key: "change-thirdparty-info",
|
||||
label: t("Translations:ThirdPartyInfo"),
|
||||
icon: "/static/images/access.edit.react.svg",
|
||||
@ -812,6 +854,7 @@ class ContextOptionsStore {
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
id: "option_archive-room",
|
||||
key: "archive-room",
|
||||
label: t("Archived"),
|
||||
icon: "/static/images/room.archive.svg",
|
||||
@ -821,6 +864,7 @@ class ContextOptionsStore {
|
||||
action: "archive",
|
||||
},
|
||||
{
|
||||
id: "option_unarchive-room",
|
||||
key: "unarchive-room",
|
||||
label: t("Common:Restore"),
|
||||
icon: "images/subtract.react.svg",
|
||||
@ -830,6 +874,7 @@ class ContextOptionsStore {
|
||||
action: "unarchive",
|
||||
},
|
||||
{
|
||||
id: "option_delete",
|
||||
key: "delete",
|
||||
label: isRootThirdPartyFolder
|
||||
? t("Common:Disconnect")
|
||||
@ -885,7 +930,7 @@ class ContextOptionsStore {
|
||||
|
||||
deleteRooms,
|
||||
} = this.filesActionsStore;
|
||||
|
||||
|
||||
if (isRoomsFolder || isArchiveFolder) {
|
||||
const isPinOption = selection.filter((item) => !item.pinned).length > 0;
|
||||
|
||||
|
@ -1439,6 +1439,7 @@ class FilesActionStore {
|
||||
if (!isTablet() && !isMobile) return null;
|
||||
else
|
||||
return {
|
||||
id: "menu-show-info",
|
||||
key: "show-info",
|
||||
label: t("Common:Info"),
|
||||
iconUrl: "/static/images/info.outline.react.svg",
|
||||
@ -1448,6 +1449,7 @@ class FilesActionStore {
|
||||
if (!this.isAvailableOption("copy")) return null;
|
||||
else
|
||||
return {
|
||||
id: "menu-copy",
|
||||
label: t("Translations:Copy"),
|
||||
onClick: () => setCopyPanelVisible(true),
|
||||
iconUrl: "/static/images/copyTo.react.svg",
|
||||
@ -1457,6 +1459,7 @@ class FilesActionStore {
|
||||
if (!this.isAvailableOption("download")) return null;
|
||||
else
|
||||
return {
|
||||
id: "menu-download",
|
||||
label: t("Common:Download"),
|
||||
onClick: () =>
|
||||
this.downloadAction(
|
||||
@ -1469,6 +1472,7 @@ class FilesActionStore {
|
||||
if (!this.isAvailableOption("downloadAs")) return null;
|
||||
else
|
||||
return {
|
||||
id: "menu-download-as",
|
||||
label: t("Translations:DownloadAs"),
|
||||
onClick: () => setDownloadDialogVisible(true),
|
||||
iconUrl: "/static/images/downloadAs.react.svg",
|
||||
@ -1478,12 +1482,14 @@ class FilesActionStore {
|
||||
if (!this.isAvailableOption("moveTo")) return null;
|
||||
else
|
||||
return {
|
||||
id: "menu-move-to",
|
||||
label: t("MoveTo"),
|
||||
onClick: () => setMoveToPanelVisible(true),
|
||||
iconUrl: "/static/images/move.react.svg",
|
||||
};
|
||||
case "pin":
|
||||
return {
|
||||
id: "menu-pin",
|
||||
key: "pin",
|
||||
label: t("Pin"),
|
||||
iconUrl: "/static/images/pin.react.svg",
|
||||
@ -1492,6 +1498,7 @@ class FilesActionStore {
|
||||
};
|
||||
case "unpin":
|
||||
return {
|
||||
id: "menu-unpin",
|
||||
key: "unpin",
|
||||
label: t("Unpin"),
|
||||
iconUrl: "/static/images/unpin.react.svg",
|
||||
@ -1502,6 +1509,7 @@ class FilesActionStore {
|
||||
if (!this.isAvailableOption("archive")) return null;
|
||||
else
|
||||
return {
|
||||
id: "menu-archive",
|
||||
key: "archive",
|
||||
label: t("Archived"),
|
||||
iconUrl: "/static/images/room.archive.svg",
|
||||
@ -1512,6 +1520,7 @@ class FilesActionStore {
|
||||
if (!this.isAvailableOption("unarchive")) return null;
|
||||
else
|
||||
return {
|
||||
id: "menu-unarchive",
|
||||
key: "unarchive",
|
||||
label: t("Common:Restore"),
|
||||
iconUrl: "images/subtract.react.svg",
|
||||
@ -1522,6 +1531,7 @@ class FilesActionStore {
|
||||
if (!this.isAvailableOption("delete-room")) return null;
|
||||
else
|
||||
return {
|
||||
id: "menu-delete-room",
|
||||
label: t("Common:Delete"),
|
||||
onClick: () => this.deleteRooms(t),
|
||||
iconUrl: "/static/images/delete.react.svg",
|
||||
@ -1531,6 +1541,7 @@ class FilesActionStore {
|
||||
if (!this.isAvailableOption("delete")) return null;
|
||||
else
|
||||
return {
|
||||
id: "menu-delete",
|
||||
label: t("Common:Delete"),
|
||||
onClick: () => {
|
||||
if (this.settingsStore.confirmDelete) {
|
||||
@ -1700,6 +1711,7 @@ class FilesActionStore {
|
||||
.set("download", download)
|
||||
.set("downloadAs", downloadAs)
|
||||
.set("restore", {
|
||||
id: "menu-restore",
|
||||
label: t("Common:Restore"),
|
||||
onClick: () => setMoveToPanelVisible(true),
|
||||
iconUrl: "/static/images/move.react.svg",
|
||||
|
@ -2191,6 +2191,42 @@ class FilesStore {
|
||||
}
|
||||
};
|
||||
|
||||
getCheckboxItemId = (key) => {
|
||||
switch (key) {
|
||||
case "all":
|
||||
return "selected-all";
|
||||
case FilterType.FoldersOnly:
|
||||
return "selected-only-folders";
|
||||
case FilterType.DocumentsOnly:
|
||||
return "selected-only-documents";
|
||||
case FilterType.PresentationsOnly:
|
||||
return "selected-only-presentations";
|
||||
case FilterType.SpreadsheetsOnly:
|
||||
return "selected-only-spreadsheets";
|
||||
case FilterType.ImagesOnly:
|
||||
return "selected-only-images";
|
||||
case FilterType.MediaOnly:
|
||||
return "selected-only-media";
|
||||
case FilterType.ArchiveOnly:
|
||||
return "selected-only-archives";
|
||||
case FilterType.FilesOnly:
|
||||
return "selected-only-files";
|
||||
case `room-${RoomsType.FillingFormsRoom}`:
|
||||
return "selected-only-filling-form-rooms";
|
||||
case `room-${RoomsType.CustomRoom}`:
|
||||
return "selected-only-custom-room";
|
||||
case `room-${RoomsType.EditingRoom}`:
|
||||
return "selected-only-collaboration-rooms";
|
||||
case `room-${RoomsType.ReviewRoom}`:
|
||||
return "selected-only-review-rooms";
|
||||
case `room-${RoomsType.ReadOnlyRoom}`:
|
||||
return "selected-only-view-rooms";
|
||||
|
||||
default:
|
||||
return "";
|
||||
}
|
||||
};
|
||||
|
||||
get sortedFiles() {
|
||||
const {
|
||||
extsConvertible,
|
||||
|
@ -35,7 +35,18 @@ class HeaderMenuStore {
|
||||
|
||||
return cbMenu;
|
||||
}
|
||||
|
||||
getMenuItemId = (item) => {
|
||||
switch (item) {
|
||||
case "active":
|
||||
return "selected_active";
|
||||
case "pending":
|
||||
return "selected_pending";
|
||||
case "disabled":
|
||||
return "selected_disabled";
|
||||
case "all":
|
||||
return "selected_all";
|
||||
}
|
||||
};
|
||||
getCheckboxItemLabel = (t, item) => {
|
||||
switch (item) {
|
||||
case "active":
|
||||
|
@ -193,7 +193,7 @@ class PeopleStore {
|
||||
const options = [];
|
||||
|
||||
const adminOption = {
|
||||
id: "group-menu_administrator",
|
||||
id: "menu_change-user_administrator",
|
||||
className: "group-menu_drop-down",
|
||||
label: t("Common:DocSpaceAdmin"),
|
||||
title: t("Common:DocSpaceAdmin"),
|
||||
@ -202,7 +202,7 @@ class PeopleStore {
|
||||
key: "administrator",
|
||||
};
|
||||
const managerOption = {
|
||||
id: "group-menu_manager",
|
||||
id: "menu_change-user_manager",
|
||||
className: "group-menu_drop-down",
|
||||
label: t("Common:RoomAdmin"),
|
||||
title: t("Common:RoomAdmin"),
|
||||
@ -211,7 +211,7 @@ class PeopleStore {
|
||||
key: "manager",
|
||||
};
|
||||
const userOption = {
|
||||
id: "group-menu_user",
|
||||
id: "menu_change-user_user",
|
||||
className: "group-menu_drop-down",
|
||||
label: t("Common:User"),
|
||||
title: t("Common:User"),
|
||||
@ -228,6 +228,7 @@ class PeopleStore {
|
||||
|
||||
const headerMenu = [
|
||||
{
|
||||
id: "menu-change-type",
|
||||
key: "change-user",
|
||||
label: t("ChangeUserTypeDialog:ChangeUserTypeButton"),
|
||||
disabled: !hasUsersToMakeEmployees,
|
||||
@ -236,6 +237,7 @@ class PeopleStore {
|
||||
options: options,
|
||||
},
|
||||
{
|
||||
id: "menu-info",
|
||||
key: "info",
|
||||
label: t("Common:Info"),
|
||||
disabled:
|
||||
@ -245,6 +247,7 @@ class PeopleStore {
|
||||
iconUrl: "images/info.react.svg",
|
||||
},
|
||||
{
|
||||
id: "menu-invite",
|
||||
key: "invite",
|
||||
label: t("Common:Invite"),
|
||||
disabled: !hasUsersToInvite,
|
||||
@ -252,6 +255,7 @@ class PeopleStore {
|
||||
iconUrl: "/static/images/invite.again.react.svg",
|
||||
},
|
||||
{
|
||||
id: "menu-enable",
|
||||
key: "enable",
|
||||
label: t("Common:Enable"),
|
||||
disabled: !hasUsersToActivate,
|
||||
@ -259,6 +263,7 @@ class PeopleStore {
|
||||
iconUrl: "images/enable.react.svg",
|
||||
},
|
||||
{
|
||||
id: "menu-disable",
|
||||
key: "disable",
|
||||
label: t("PeopleTranslations:DisableUserButton"),
|
||||
disabled: !hasUsersToDisable,
|
||||
@ -266,6 +271,7 @@ class PeopleStore {
|
||||
iconUrl: "images/disable.react.svg",
|
||||
},
|
||||
{
|
||||
id: "menu-delete",
|
||||
key: "delete",
|
||||
label: t("Common:Delete"),
|
||||
disabled: !hasUsersToRemove,
|
||||
|
@ -195,6 +195,7 @@ const Navigation = ({
|
||||
</StyledContainer>
|
||||
{infoPanelIsVisible && (
|
||||
<ToggleInfoPanelButton
|
||||
id="info-panel-toggle--open"
|
||||
isRootFolder={isRootFolder}
|
||||
toggleInfoPanel={toggleInfoPanel}
|
||||
isInfoPanelVisible={isInfoPanelVisible}
|
||||
|
@ -125,6 +125,7 @@ const ControlButtons = ({
|
||||
)}
|
||||
{!personal && (
|
||||
<ContextMenuButton
|
||||
id="header_optional-button"
|
||||
zIndex={402}
|
||||
className="option-button"
|
||||
directionX="right"
|
||||
@ -147,6 +148,7 @@ const ControlButtons = ({
|
||||
<>
|
||||
{!isMobile && (
|
||||
<PlusButton
|
||||
id="header_add-button"
|
||||
className="add-button"
|
||||
getData={getContextOptionsPlus}
|
||||
withMenu={withMenu}
|
||||
|
@ -31,6 +31,7 @@ const PlusButton = (props) => {
|
||||
<IconButton
|
||||
onClick={onClick}
|
||||
iconName="images/plus.svg"
|
||||
id={props.id}
|
||||
size={15}
|
||||
isFill
|
||||
/>
|
||||
@ -50,6 +51,7 @@ PlusButton.propTypes = {
|
||||
className: PropTypes.string,
|
||||
getData: PropTypes.func.isRequired,
|
||||
onPlusClick: PropTypes.func,
|
||||
id: PropTypes.string,
|
||||
};
|
||||
|
||||
PlusButton.defaultProps = {
|
||||
|
@ -54,6 +54,7 @@ const ToggleInfoPanelButton = ({
|
||||
isRootFolder,
|
||||
isInfoPanelVisible,
|
||||
toggleInfoPanel,
|
||||
id,
|
||||
}) => {
|
||||
return (
|
||||
<StyledInfoPanelToggleWrapper
|
||||
@ -62,6 +63,7 @@ const ToggleInfoPanelButton = ({
|
||||
>
|
||||
<div className="info-panel-toggle-bg">
|
||||
<IconButton
|
||||
id={id}
|
||||
className="info-panel-toggle"
|
||||
iconName="images/panel.react.svg"
|
||||
size="16"
|
||||
|
@ -23,8 +23,8 @@ class InfoPanelStore {
|
||||
selection = null;
|
||||
selectionParentRoom = null;
|
||||
|
||||
roomsView = "details";
|
||||
fileView = "history";
|
||||
roomsView = "info_details";
|
||||
fileView = "info_history";
|
||||
|
||||
authStore = null;
|
||||
settingsStore = null;
|
||||
@ -54,7 +54,7 @@ class InfoPanelStore {
|
||||
|
||||
setView = (view) => {
|
||||
this.roomsView = view;
|
||||
this.fileView = view === "members" ? "history" : view;
|
||||
this.fileView = view === "info_members" ? "info_history" : view;
|
||||
};
|
||||
|
||||
// Selection helpers //
|
||||
|
@ -222,7 +222,7 @@ class ContextMenuButton extends React.Component {
|
||||
(item.label || item.icon || item.key) && (
|
||||
<DropDownItem
|
||||
{...item}
|
||||
id={item.key}
|
||||
id={item.id}
|
||||
key={item.key || index}
|
||||
onClick={this.onDropDownItemClick.bind(this, item)}
|
||||
/>
|
||||
|
@ -113,6 +113,7 @@ class LinkWithDropdown extends React.Component {
|
||||
const dropDownItem = data.map((item) => (
|
||||
<DropDownItem
|
||||
className="drop-down-item"
|
||||
id={item.key}
|
||||
key={item.key}
|
||||
{...item}
|
||||
onClick={this.onClickDropDownItem}
|
||||
|
@ -140,6 +140,7 @@ const GroupMenuItem = ({ item }) => {
|
||||
title,
|
||||
withDropDown,
|
||||
options,
|
||||
id,
|
||||
} = item;
|
||||
return (
|
||||
<>
|
||||
@ -148,6 +149,7 @@ const GroupMenuItem = ({ item }) => {
|
||||
) : (
|
||||
<>
|
||||
<StyledButton
|
||||
id={id}
|
||||
label={label}
|
||||
title={title || label}
|
||||
isDisabled={disabled}
|
||||
|
@ -36,6 +36,7 @@ const TableGroupMenu = (props) => {
|
||||
{...rest}
|
||||
>
|
||||
<Checkbox
|
||||
id="menu-checkbox_selected-all-file"
|
||||
className="table-container_group-menu-checkbox"
|
||||
onChange={onCheckboxChange}
|
||||
isChecked={isChecked}
|
||||
@ -43,6 +44,7 @@ const TableGroupMenu = (props) => {
|
||||
title={t("Common:MainHeaderSelectAll")}
|
||||
/>
|
||||
<ComboBox
|
||||
id="menu-combobox"
|
||||
comboIcon="/static/images/triangle.navigation.down.react.svg"
|
||||
noBorder
|
||||
advancedOptions={checkboxOptions}
|
||||
@ -63,6 +65,7 @@ const TableGroupMenu = (props) => {
|
||||
<StyledInfoPanelToggleWrapper isInfoPanelVisible={isInfoPanelVisible}>
|
||||
<div className="info-panel-toggle-bg">
|
||||
<IconButton
|
||||
id="info-panel-toggle--open"
|
||||
className="info-panel-toggle"
|
||||
iconName="images/panel.react.svg"
|
||||
size="16"
|
||||
|
Loading…
Reference in New Issue
Block a user