Web:EmptyContainer Added room root empty screen, refactoring and optimization
This commit is contained in:
Akmal Isomadinov
parent
2dc9a52ba4
commit
db10eccbfd
@ -7,6 +7,8 @@
|
||||
"CreateNewFileTitle": "Create a new file",
|
||||
"CreatePresentation": "Create a new presentation",
|
||||
"CreatePresentationDescription": "Impress your audience with stunning slides.",
|
||||
"CreateRoomDescriotionOption": "Start the portal by creating a room",
|
||||
"CreateRoomTitleOption": "Create a new room",
|
||||
"CreateSpreadsheet": "Create a new spreadsheet",
|
||||
"CreateSpreadsheetDescription": "Carry out precise calculations with minimal effort.",
|
||||
"CustomRoomEmptyTitle": "Welcome to the Custom room",
|
||||
@ -17,6 +19,7 @@
|
||||
"FormFolderDefaultUserDescription": "The forms uploaded by the administrators will be appeared here.",
|
||||
"FormFolderDefaultUserTitle": "No forms in this folder yet",
|
||||
"FormRoomEmptyTitle": "Welcome to the Form filling room",
|
||||
"InviteNewUsers": "Invite new users",
|
||||
"InviteUsersCollaborationOptionDescription": "Add members for joint editing in the room.",
|
||||
"InviteUsersOptionDescription": "Add portal members for joint editing in the room",
|
||||
"InviteUsersOptionTitle": "Inviting Attendees",
|
||||
|
||||
@ -85,16 +85,6 @@ const EmptyContainer = ({
|
||||
window.dispatchEvent(event);
|
||||
};
|
||||
|
||||
const onCreateRoom = (e) => {
|
||||
if (isGracePeriod) {
|
||||
setInviteUsersWarningDialogVisible(true);
|
||||
return;
|
||||
}
|
||||
|
||||
const event = new Event(Events.ROOM_CREATE);
|
||||
window.dispatchEvent(event);
|
||||
};
|
||||
|
||||
if (isRoomNotFoundOrMoved) {
|
||||
return (
|
||||
<RoomNoAccessContainer
|
||||
@ -110,22 +100,13 @@ const EmptyContainer = ({
|
||||
|
||||
if (isFiltered) return <EmptyFilterContainer linkStyles={linkStyles} />;
|
||||
|
||||
if (isRootEmptyPage)
|
||||
return (
|
||||
<RootFolderContainer
|
||||
onCreate={onCreate}
|
||||
linkStyles={linkStyles}
|
||||
onCreateRoom={onCreateRoom}
|
||||
sectionWidth={sectionWidth}
|
||||
/>
|
||||
);
|
||||
|
||||
return (
|
||||
<EmptyViewContainer
|
||||
type={roomType}
|
||||
folderType={type}
|
||||
isFolder={!isRoom}
|
||||
isFolder={!isRoom && !isRootEmptyPage}
|
||||
folderId={folderId}
|
||||
isRootEmptyPage={isRootEmptyPage}
|
||||
parentRoomType={parentRoomType}
|
||||
isArchiveFolderRoot={isArchiveFolderRoot}
|
||||
/>
|
||||
|
||||
@ -9,42 +9,11 @@ import {
|
||||
ShareAccessRights,
|
||||
} from "@docspace/shared/enums";
|
||||
|
||||
import EmptyFormRoomDarkIcon from "PUBLIC_DIR/images/emptyview/empty.form.room.dark.svg";
|
||||
import EmptyFormRoomLightIcon from "PUBLIC_DIR/images/emptyview/empty.form.room.light.svg";
|
||||
|
||||
import EmptyFormRoomCollaboratorDarkIcon from "PUBLIC_DIR/images/emptyview/empty.form.room.collaborator.dark.svg";
|
||||
import EmptyFormRoomCollaboratorLightIcon from "PUBLIC_DIR/images/emptyview/empty.form.room.collaborator.light.svg";
|
||||
|
||||
import EmptyFormRoomFillingDarkIcon from "PUBLIC_DIR/images/emptyview/empty.form.room.filling.dark.svg";
|
||||
import EmptyFormRoomFillingLightIcon from "PUBLIC_DIR/images/emptyview/empty.form.room.filling.light.svg";
|
||||
|
||||
import EmptyCustomRoomDarkIcon from "PUBLIC_DIR/images/emptyview/empty.custom.room.dark.svg";
|
||||
import EmptyCustomRoomLightIcon from "PUBLIC_DIR/images/emptyview/empty.custom.room.light.svg";
|
||||
|
||||
import EmptyCustomRoomCollaboratorDarkIcon from "PUBLIC_DIR/images/emptyview/empty.custom.room.collaborator.dark.svg";
|
||||
import EmptyCustomRoomCollaboratorLightIcon from "PUBLIC_DIR/images/emptyview/empty.custom.room.collaborator.light.svg";
|
||||
|
||||
import EmptyPublicRoomDarkIcon from "PUBLIC_DIR/images/emptyview/empty.public.room.dark.svg";
|
||||
import EmptyPublicRoomLightIcon from "PUBLIC_DIR/images/emptyview/empty.public.room.light.svg";
|
||||
|
||||
import EmptyPublicRoomCollaboratorDarkIcon from "PUBLIC_DIR/images/emptyview/empty.public.room.collaborator.dark.svg";
|
||||
import EmptyPublicRoomCollaboratorLightIcon from "PUBLIC_DIR/images/emptyview/empty.public.room.collaborator.light.svg";
|
||||
|
||||
import EmptyCollaborationRoomDarkIcon from "PUBLIC_DIR/images/emptyview/empty.collaboration.room.dark.svg";
|
||||
import EmptyCollaborationRoomLightIcon from "PUBLIC_DIR/images/emptyview/empty.collaboration.room.light.svg";
|
||||
import EmptyCollaborationRoomCollaboratorDarkIcon from "PUBLIC_DIR/images/emptyview/empty.collaboration.room.collaborator.dark.svg";
|
||||
import EmptyCollaborationRoomCollaboratorLightIcon from "PUBLIC_DIR/images/emptyview/empty.collaboration.room.collaborator.light.svg";
|
||||
|
||||
// import EmptyCustomRoomOtherDarkIcon from "PUBLIC_DIR/images/emptyview/empty.custom.room.other.dark.svg";
|
||||
// import EmptyCustomRoomOtherLightIcon from "PUBLIC_DIR/images/emptyview/empty.custom.room.other.light.svg";
|
||||
|
||||
import CreateNewFormIcon from "PUBLIC_DIR/images/emptyview/create.new.form.svg";
|
||||
import CreateNewSpreadsheetIcon from "PUBLIC_DIR/images/emptyview/create.new.spreadsheet.svg";
|
||||
import CreateNewPresentation from "PUBLIC_DIR/images/emptyview/create.new.presentation.svg";
|
||||
// import CreateFromFormIcon from "PUBLIC_DIR/images/emptyview/create.from.document.form.svg";
|
||||
import InviteUserFormIcon from "PUBLIC_DIR/images/emptyview/invite.user.svg";
|
||||
import UploadPDFFormIcon from "PUBLIC_DIR/images/emptyview/upload.pdf.form.svg";
|
||||
import UploadDevicePDFFormIcon from "PUBLIC_DIR/images/emptyview/upload.device.pdf.form.svg";
|
||||
import CreateRoom from "PUBLIC_DIR/images/emptyview/create.room.svg";
|
||||
|
||||
import SharedIcon from "PUBLIC_DIR/images/emptyview/share.svg";
|
||||
|
||||
import DocumentsReactSvgUrl from "PUBLIC_DIR/images/actions.documents.react.svg?url";
|
||||
@ -53,38 +22,27 @@ import PresentationReactSvgUrl from "PUBLIC_DIR/images/actions.presentation.reac
|
||||
import FormReactSvgUrl from "PUBLIC_DIR/images/access.form.react.svg?url";
|
||||
import FolderReactSvgUrl from "PUBLIC_DIR/images/catalog.folder.react.svg?url";
|
||||
|
||||
import FormDefaultFolderLight from "PUBLIC_DIR/images/emptyview/empty.form.default.folder.light.svg";
|
||||
import FormDefaultFolderDark from "PUBLIC_DIR/images/emptyview/empty.form.default.folder.dark.svg";
|
||||
import DefaultFolderDark from "PUBLIC_DIR/images/emptyview/empty.default.folder.dark.svg";
|
||||
import DefaultFolderLight from "PUBLIC_DIR/images/emptyview/empty.default.folder.light.svg";
|
||||
import DefaultFolderUserDark from "PUBLIC_DIR/images/emptyview/empty.default.folder.user.dark.svg";
|
||||
import DefaultFolderUserLight from "PUBLIC_DIR/images/emptyview/empty.default.folder.user.light.svg";
|
||||
|
||||
import type { Nullable, TTranslation } from "@docspace/shared/types";
|
||||
import type { TRoomSecurity } from "@docspace/shared/api/rooms/types";
|
||||
import type { TFolderSecurity } from "@docspace/shared/api/files/types";
|
||||
import type { EmptyViewItemType } from "@docspace/shared/components/empty-view";
|
||||
|
||||
import type {
|
||||
ExtensiontionType,
|
||||
OptionActions,
|
||||
UploadType,
|
||||
} from "./EmptyViewContainer.types";
|
||||
import type { AccessType, OptionActions } from "./EmptyViewContainer.types";
|
||||
import { DefaultFolderType } from "./EmptyViewContainer.constants";
|
||||
|
||||
type AccessType = Nullable<ShareAccessRights> | undefined;
|
||||
|
||||
const isUser = (access: AccessType) => {
|
||||
return (
|
||||
access !== ShareAccessRights.None &&
|
||||
access !== ShareAccessRights.RoomManager &&
|
||||
access !== ShareAccessRights.Collaborator
|
||||
);
|
||||
};
|
||||
|
||||
const isAdmin = (access: AccessType) => {
|
||||
return !isUser(access);
|
||||
};
|
||||
import {
|
||||
getFolderDescription,
|
||||
getFolderIcon,
|
||||
getFolderTitle,
|
||||
getRoomDescription,
|
||||
getRoomIcon,
|
||||
getRoomTitle,
|
||||
getRootDesctiption,
|
||||
getRootIcom,
|
||||
getRootTitle,
|
||||
helperOptions,
|
||||
isAdmin,
|
||||
isUser,
|
||||
} from "./EmptyViewContainer.utils";
|
||||
|
||||
export const getDescription = (
|
||||
type: RoomsType,
|
||||
@ -94,49 +52,24 @@ export const getDescription = (
|
||||
folderType: Nullable<FolderType>,
|
||||
parentRoomType: Nullable<FolderType>,
|
||||
isArchiveFolderRoot: boolean,
|
||||
isRootEmptyPage: boolean,
|
||||
rootFolderType: Nullable<FolderType>,
|
||||
): string => {
|
||||
const isNotAdmin = isUser(access);
|
||||
|
||||
if (isFolder) {
|
||||
return match([parentRoomType, folderType, access])
|
||||
.with([P._, FolderType.Done, P._], () =>
|
||||
t("Files:EmptyFormFolderDoneDescriptionText"),
|
||||
)
|
||||
.with([P._, FolderType.InProgress, P._], () =>
|
||||
t("Files:EmptyFormFolderProgressDescriptionText"),
|
||||
)
|
||||
.with([P._, FolderType.SubFolderDone, P._], () =>
|
||||
t("Files:EmptyFormSubFolderDoneDescriptionText"),
|
||||
)
|
||||
.with([P._, FolderType.SubFolderInProgress, P._], () =>
|
||||
t("Files:EmptyFormSubFolderProgressDescriptionText"),
|
||||
)
|
||||
.with(
|
||||
[
|
||||
FolderType.FormRoom,
|
||||
null,
|
||||
P.when(() => isNotAdmin || isArchiveFolderRoot),
|
||||
],
|
||||
() => t("EmptyView:FormFolderDefaultUserDescription"),
|
||||
)
|
||||
.with([FolderType.FormRoom, DefaultFolderType, P._], () =>
|
||||
t("EmptyView:FormFolderDefaultDescription", {
|
||||
productName: t("Common:ProductName"),
|
||||
}),
|
||||
)
|
||||
.with([P._, DefaultFolderType, P.when(isAdmin)], () =>
|
||||
t("EmptyView:DefaultFolderDescription"),
|
||||
)
|
||||
.with([P._, DefaultFolderType, P.when(isUser)], () =>
|
||||
t("EmptyView:UserEmptyDescription"),
|
||||
)
|
||||
.otherwise(() => "");
|
||||
}
|
||||
if (isRootEmptyPage) return getRootDesctiption(t, rootFolderType);
|
||||
|
||||
if (isNotAdmin || isArchiveFolderRoot)
|
||||
return t("EmptyView:UserEmptyDescription");
|
||||
if (isFolder)
|
||||
return getFolderDescription(
|
||||
t,
|
||||
access,
|
||||
isNotAdmin,
|
||||
isArchiveFolderRoot,
|
||||
folderType,
|
||||
parentRoomType,
|
||||
);
|
||||
|
||||
return t("EmptyView:EmptyDescription");
|
||||
return getRoomDescription(t, isNotAdmin, isArchiveFolderRoot);
|
||||
};
|
||||
|
||||
export const getTitle = (
|
||||
@ -147,167 +80,24 @@ export const getTitle = (
|
||||
folderType: Nullable<FolderType>,
|
||||
parentRoomType: Nullable<FolderType>,
|
||||
isArchiveFolderRoot: boolean,
|
||||
isRootEmptyPage: boolean,
|
||||
rootFolderType: Nullable<FolderType>,
|
||||
): string => {
|
||||
const isCollaborator = access === ShareAccessRights.Collaborator;
|
||||
|
||||
const isNotAdmin = isUser(access);
|
||||
|
||||
if (isFolder) {
|
||||
return match([parentRoomType, folderType, access])
|
||||
.with([P._, FolderType.Done, P._], () =>
|
||||
t("Files:EmptyFormFolderDoneHeaderText"),
|
||||
)
|
||||
if (isRootEmptyPage) return getRootTitle(t, rootFolderType);
|
||||
|
||||
.with([P._, FolderType.InProgress, P._], () =>
|
||||
t("Files:EmptyFormFolderProgressHeaderText"),
|
||||
)
|
||||
.with(
|
||||
[
|
||||
P._,
|
||||
P.union(FolderType.SubFolderDone, FolderType.SubFolderInProgress),
|
||||
P._,
|
||||
],
|
||||
() => t("Files:EmptyFormSubFolderHeaderText"),
|
||||
)
|
||||
.with(
|
||||
[
|
||||
FolderType.FormRoom,
|
||||
DefaultFolderType,
|
||||
P.when(() => isNotAdmin || isArchiveFolderRoot),
|
||||
],
|
||||
() => t("EmptyView:FormFolderDefaultUserTitle"),
|
||||
)
|
||||
.with([FolderType.FormRoom, DefaultFolderType, P._], () =>
|
||||
t("EmptyView:FormFolderDefaultTitle"),
|
||||
)
|
||||
.with([P._, DefaultFolderType, P._], () => t("Files:EmptyScreenFolder"))
|
||||
.otherwise(() => "");
|
||||
}
|
||||
|
||||
if (isCollaborator) return t("EmptyView:CollaboratorEmptyTitle");
|
||||
|
||||
if (isNotAdmin || isArchiveFolderRoot) return t("Files:EmptyScreenFolder");
|
||||
|
||||
switch (type) {
|
||||
case RoomsType.FormRoom:
|
||||
return t("EmptyView:FormRoomEmptyTitle");
|
||||
case RoomsType.EditingRoom:
|
||||
return t("EmptyView:CollaborationRoomEmptyTitle");
|
||||
case RoomsType.PublicRoom:
|
||||
return t("EmptyView:PublicRoomEmptyTitle");
|
||||
case RoomsType.CustomRoom:
|
||||
return t("EmptyView:CustomRoomEmptyTitle");
|
||||
default:
|
||||
return "";
|
||||
}
|
||||
};
|
||||
|
||||
export const getFolderIcon = (
|
||||
roomType: Nullable<FolderType>,
|
||||
isBaseTheme: boolean,
|
||||
access: AccessType,
|
||||
folderType: Nullable<FolderType>,
|
||||
) => {
|
||||
return match([roomType, folderType, access])
|
||||
.with([FolderType.FormRoom, P._, P._], () =>
|
||||
isBaseTheme ? <FormDefaultFolderLight /> : <FormDefaultFolderDark />,
|
||||
)
|
||||
.with([P._, DefaultFolderType, P.when(isUser)], () =>
|
||||
isBaseTheme ? <DefaultFolderUserLight /> : <DefaultFolderUserDark />,
|
||||
)
|
||||
.with([P._, DefaultFolderType, P.when(isAdmin)], () =>
|
||||
isBaseTheme ? <DefaultFolderLight /> : <DefaultFolderDark />,
|
||||
)
|
||||
.otherwise(() => <div />);
|
||||
};
|
||||
|
||||
export const getRoomIcon = (
|
||||
type: RoomsType,
|
||||
isBaseTheme: boolean,
|
||||
access: AccessType,
|
||||
) => {
|
||||
return (
|
||||
match([type, access])
|
||||
.with([RoomsType.FormRoom, ShareAccessRights.FormFilling], () =>
|
||||
isBaseTheme ? (
|
||||
<EmptyFormRoomFillingLightIcon />
|
||||
) : (
|
||||
<EmptyFormRoomFillingDarkIcon />
|
||||
),
|
||||
)
|
||||
.with([RoomsType.FormRoom, ShareAccessRights.Collaborator], () =>
|
||||
isBaseTheme ? (
|
||||
<EmptyFormRoomCollaboratorLightIcon />
|
||||
) : (
|
||||
<EmptyFormRoomCollaboratorDarkIcon />
|
||||
),
|
||||
)
|
||||
.with([RoomsType.FormRoom, P._], () =>
|
||||
isBaseTheme ? <EmptyFormRoomLightIcon /> : <EmptyFormRoomDarkIcon />,
|
||||
)
|
||||
.with(
|
||||
[
|
||||
RoomsType.EditingRoom,
|
||||
P.union(ShareAccessRights.None, ShareAccessRights.RoomManager),
|
||||
],
|
||||
() =>
|
||||
isBaseTheme ? (
|
||||
<EmptyCollaborationRoomLightIcon />
|
||||
) : (
|
||||
<EmptyCollaborationRoomDarkIcon />
|
||||
),
|
||||
)
|
||||
.with([RoomsType.EditingRoom, ShareAccessRights.Collaborator], () =>
|
||||
isBaseTheme ? (
|
||||
<EmptyCollaborationRoomCollaboratorLightIcon />
|
||||
) : (
|
||||
<EmptyCollaborationRoomCollaboratorDarkIcon />
|
||||
),
|
||||
)
|
||||
.with(
|
||||
[
|
||||
RoomsType.PublicRoom,
|
||||
P.union(ShareAccessRights.None, ShareAccessRights.RoomManager), // owner, docspace admin, room admin
|
||||
],
|
||||
() =>
|
||||
isBaseTheme ? (
|
||||
<EmptyPublicRoomLightIcon />
|
||||
) : (
|
||||
<EmptyPublicRoomDarkIcon />
|
||||
),
|
||||
)
|
||||
.with([RoomsType.PublicRoom, ShareAccessRights.Collaborator], () =>
|
||||
isBaseTheme ? (
|
||||
<EmptyPublicRoomCollaboratorLightIcon />
|
||||
) : (
|
||||
<EmptyPublicRoomCollaboratorDarkIcon />
|
||||
),
|
||||
)
|
||||
.with(
|
||||
[
|
||||
RoomsType.CustomRoom,
|
||||
P.union(ShareAccessRights.None, ShareAccessRights.RoomManager), // owner, docspace admin, room admin
|
||||
],
|
||||
() =>
|
||||
isBaseTheme ? (
|
||||
<EmptyCustomRoomLightIcon />
|
||||
) : (
|
||||
<EmptyCustomRoomDarkIcon />
|
||||
),
|
||||
)
|
||||
.with([RoomsType.CustomRoom, ShareAccessRights.Collaborator], () =>
|
||||
isBaseTheme ? (
|
||||
<EmptyCustomRoomCollaboratorLightIcon />
|
||||
) : (
|
||||
<EmptyCustomRoomCollaboratorDarkIcon />
|
||||
),
|
||||
)
|
||||
.with([P._, P.when(isUser)], () =>
|
||||
isBaseTheme ? <DefaultFolderUserLight /> : <DefaultFolderUserDark />,
|
||||
)
|
||||
// eslint-disable-next-line react/jsx-no-useless-fragment
|
||||
.otherwise(() => <></>)
|
||||
if (isFolder)
|
||||
return getFolderTitle(
|
||||
t,
|
||||
isNotAdmin,
|
||||
isArchiveFolderRoot,
|
||||
access,
|
||||
folderType,
|
||||
parentRoomType,
|
||||
);
|
||||
|
||||
return getRoomTitle(t, type, access, isNotAdmin, isArchiveFolderRoot);
|
||||
};
|
||||
|
||||
export const getIcon = (
|
||||
@ -317,75 +107,16 @@ export const getIcon = (
|
||||
isFolder: boolean,
|
||||
folderType: Nullable<FolderType>,
|
||||
parentRoomType: Nullable<FolderType>,
|
||||
isRootEmptyPage: boolean,
|
||||
rootFolderType: Nullable<FolderType>,
|
||||
): JSX.Element => {
|
||||
if (isRootEmptyPage) return getRootIcom(rootFolderType, access, isBaseTheme);
|
||||
|
||||
return isFolder
|
||||
? getFolderIcon(parentRoomType, isBaseTheme, access, folderType)
|
||||
: getRoomIcon(type, isBaseTheme, access);
|
||||
};
|
||||
|
||||
const helperOptions = (
|
||||
actions: OptionActions,
|
||||
security: Nullable<TFolderSecurity | TRoomSecurity>,
|
||||
) => {
|
||||
const createInviteOption = (title: string, description: string) => {
|
||||
return {
|
||||
title,
|
||||
description,
|
||||
icon: <InviteUserFormIcon />,
|
||||
key: "invite-users",
|
||||
onClick: actions.inviteUser,
|
||||
disabled: !security?.EditAccess,
|
||||
};
|
||||
};
|
||||
|
||||
const createCreateFileOption = (
|
||||
title: string,
|
||||
description: string,
|
||||
extension: ExtensiontionType,
|
||||
withoutDialog: boolean = false,
|
||||
) => ({
|
||||
title,
|
||||
description,
|
||||
icon: <CreateNewFormIcon />,
|
||||
key: "create-form",
|
||||
onClick: () => actions.onCreate(extension, withoutDialog),
|
||||
disabled: !security?.Create,
|
||||
});
|
||||
|
||||
const createUploadFromDeviceOption = (
|
||||
title: string,
|
||||
description: string,
|
||||
uploadType: UploadType,
|
||||
) => ({
|
||||
title,
|
||||
description,
|
||||
icon: <UploadDevicePDFFormIcon />,
|
||||
key: "create-form",
|
||||
onClick: () => actions.onUploadAction(uploadType),
|
||||
disabled: !security?.Create,
|
||||
});
|
||||
|
||||
const createUploadFromDocSpace = (
|
||||
title: string,
|
||||
description: string,
|
||||
filterType: FilesSelectorFilterTypes | FilterType,
|
||||
) => ({
|
||||
title,
|
||||
description,
|
||||
icon: <UploadPDFFormIcon />,
|
||||
key: "upload-pdf-form",
|
||||
onClick: () => actions.uploadFromDocspace(filterType),
|
||||
disabled: !security?.Create,
|
||||
});
|
||||
|
||||
return {
|
||||
createInviteOption,
|
||||
createCreateFileOption,
|
||||
createUploadFromDocSpace,
|
||||
createUploadFromDeviceOption,
|
||||
};
|
||||
};
|
||||
|
||||
export const getOptions = (
|
||||
type: RoomsType,
|
||||
security: Nullable<TFolderSecurity | TRoomSecurity>,
|
||||
@ -395,6 +126,8 @@ export const getOptions = (
|
||||
folderType: Nullable<FolderType>,
|
||||
parentRoomType: Nullable<FolderType>,
|
||||
isArchiveFolderRoot: boolean,
|
||||
isRootEmptyPage: boolean,
|
||||
rootFolderType: Nullable<FolderType>,
|
||||
actions: OptionActions,
|
||||
): EmptyViewItemType[] => {
|
||||
const isFormFiller = access === ShareAccessRights.FormFilling;
|
||||
@ -490,6 +223,15 @@ export const getOptions = (
|
||||
disabled: false,
|
||||
};
|
||||
|
||||
const createRoom = {
|
||||
title: t("EmptyView:CreateRoomTitleOption"),
|
||||
description: t("EmptyView:CreateRoomDescriotionOption"),
|
||||
icon: <CreateRoom />,
|
||||
key: "create-room",
|
||||
onClick: actions.onCreateRoom,
|
||||
disabled: false,
|
||||
};
|
||||
|
||||
const createFile: EmptyViewItemType = {
|
||||
title: t("EmptyView:CreateNewFileTitle"),
|
||||
description: t("EmptyView:CreateNewFileDescription"),
|
||||
@ -533,6 +275,16 @@ export const getOptions = (
|
||||
|
||||
if (isArchiveFolderRoot) return [];
|
||||
|
||||
if (isRootEmptyPage) {
|
||||
switch (rootFolderType) {
|
||||
case FolderType.Rooms:
|
||||
return [createRoom];
|
||||
|
||||
default:
|
||||
return [];
|
||||
}
|
||||
}
|
||||
|
||||
if (isFolder) {
|
||||
return match([parentRoomType, folderType, access])
|
||||
.with(
|
||||
|
||||
@ -21,6 +21,8 @@ import type {
|
||||
CreateEvent,
|
||||
EmptyViewContainerProps,
|
||||
ExtensiontionType,
|
||||
InjectedEmptyViewContainerProps,
|
||||
OutEmptyViewContainerProps,
|
||||
UploadType,
|
||||
} from "./EmptyViewContainer.types";
|
||||
|
||||
@ -34,13 +36,17 @@ const EmptyViewContainer = observer(
|
||||
folderType,
|
||||
selectedFolder,
|
||||
parentRoomType,
|
||||
isRootEmptyPage,
|
||||
isVisibleInfoPanel,
|
||||
isArchiveFolderRoot,
|
||||
rootFolderType,
|
||||
isGracePeriod,
|
||||
setViewInfoPanel,
|
||||
onClickInviteUsers,
|
||||
setVisibleInfoPanel,
|
||||
onCreateAndCopySharedLink,
|
||||
setSelectFileFormRoomDialogVisible,
|
||||
setInviteUsersWarningDialogVisible,
|
||||
}: EmptyViewContainerProps) => {
|
||||
const { t } = useTranslation([
|
||||
"EmptyView",
|
||||
@ -51,6 +57,16 @@ const EmptyViewContainer = observer(
|
||||
|
||||
const theme = useTheme();
|
||||
|
||||
const onCreateRoom = useCallback(() => {
|
||||
if (isGracePeriod) {
|
||||
setInviteUsersWarningDialogVisible(true);
|
||||
return;
|
||||
}
|
||||
|
||||
const event = new Event(Events.ROOM_CREATE);
|
||||
window.dispatchEvent(event);
|
||||
}, [isGracePeriod, setInviteUsersWarningDialogVisible]);
|
||||
|
||||
const openInfoPanel = useCallback(() => {
|
||||
if (!isVisibleInfoPanel) setVisibleInfoPanel?.(true);
|
||||
|
||||
@ -113,6 +129,8 @@ const EmptyViewContainer = observer(
|
||||
folderType,
|
||||
parentRoomType,
|
||||
isArchiveFolderRoot,
|
||||
isRootEmptyPage,
|
||||
rootFolderType,
|
||||
);
|
||||
const title = getTitle(
|
||||
type,
|
||||
@ -122,6 +140,8 @@ const EmptyViewContainer = observer(
|
||||
folderType,
|
||||
parentRoomType,
|
||||
isArchiveFolderRoot,
|
||||
isRootEmptyPage,
|
||||
rootFolderType,
|
||||
);
|
||||
const icon = getIcon(
|
||||
type,
|
||||
@ -130,6 +150,8 @@ const EmptyViewContainer = observer(
|
||||
isFolder,
|
||||
folderType,
|
||||
parentRoomType,
|
||||
isRootEmptyPage,
|
||||
rootFolderType,
|
||||
);
|
||||
|
||||
return { description, title, icon };
|
||||
@ -141,7 +163,9 @@ const EmptyViewContainer = observer(
|
||||
isFolder,
|
||||
folderType,
|
||||
parentRoomType,
|
||||
isRootEmptyPage,
|
||||
isArchiveFolderRoot,
|
||||
rootFolderType,
|
||||
]);
|
||||
|
||||
const options = useMemo(
|
||||
@ -155,6 +179,8 @@ const EmptyViewContainer = observer(
|
||||
folderType,
|
||||
parentRoomType,
|
||||
isArchiveFolderRoot,
|
||||
isRootEmptyPage,
|
||||
rootFolderType,
|
||||
{
|
||||
inviteUser,
|
||||
onCreate,
|
||||
@ -162,6 +188,7 @@ const EmptyViewContainer = observer(
|
||||
onUploadAction,
|
||||
createAndCopySharedLink,
|
||||
openInfoPanel,
|
||||
onCreateRoom,
|
||||
},
|
||||
),
|
||||
[
|
||||
@ -172,6 +199,8 @@ const EmptyViewContainer = observer(
|
||||
folderType,
|
||||
parentRoomType,
|
||||
isArchiveFolderRoot,
|
||||
isRootEmptyPage,
|
||||
rootFolderType,
|
||||
t,
|
||||
inviteUser,
|
||||
uploadFromDocspace,
|
||||
@ -179,6 +208,7 @@ const EmptyViewContainer = observer(
|
||||
createAndCopySharedLink,
|
||||
onCreate,
|
||||
openInfoPanel,
|
||||
onCreateRoom,
|
||||
],
|
||||
);
|
||||
|
||||
@ -195,25 +225,35 @@ const EmptyViewContainer = observer(
|
||||
},
|
||||
);
|
||||
|
||||
const InjectedEmptyViewContainer = inject<TStore>(
|
||||
const InjectedEmptyViewContainer = inject<
|
||||
TStore,
|
||||
OutEmptyViewContainerProps,
|
||||
InjectedEmptyViewContainerProps
|
||||
>(
|
||||
({
|
||||
contextOptionsStore,
|
||||
selectedFolderStore,
|
||||
dialogsStore,
|
||||
infoPanelStore,
|
||||
}) => {
|
||||
currentTariffStatusStore,
|
||||
}): InjectedEmptyViewContainerProps => {
|
||||
const { onClickInviteUsers, onCreateAndCopySharedLink } =
|
||||
contextOptionsStore;
|
||||
|
||||
const { isGracePeriod } = currentTariffStatusStore;
|
||||
|
||||
const {
|
||||
setIsVisible: setVisibleInfoPanel,
|
||||
isVisible: isVisibleInfoPanel,
|
||||
setView: setViewInfoPanel,
|
||||
} = infoPanelStore;
|
||||
|
||||
const { setSelectFileFormRoomDialogVisible } = dialogsStore;
|
||||
const {
|
||||
setSelectFileFormRoomDialogVisible,
|
||||
setInviteUsersWarningDialogVisible,
|
||||
} = dialogsStore;
|
||||
|
||||
const { security, access } = selectedFolderStore;
|
||||
const { security, access, rootFolderType } = selectedFolderStore;
|
||||
|
||||
const selectedFolder = selectedFolderStore.getSelectedFolder();
|
||||
|
||||
@ -222,13 +262,16 @@ const InjectedEmptyViewContainer = inject<TStore>(
|
||||
security,
|
||||
selectedFolder,
|
||||
isVisibleInfoPanel,
|
||||
rootFolderType,
|
||||
isGracePeriod,
|
||||
onClickInviteUsers,
|
||||
onCreateAndCopySharedLink,
|
||||
setSelectFileFormRoomDialogVisible,
|
||||
setInviteUsersWarningDialogVisible,
|
||||
setVisibleInfoPanel,
|
||||
setViewInfoPanel,
|
||||
};
|
||||
},
|
||||
)(EmptyViewContainer);
|
||||
)(EmptyViewContainer as React.FC<OutEmptyViewContainerProps>);
|
||||
|
||||
export default InjectedEmptyViewContainer;
|
||||
|
||||
@ -11,7 +11,14 @@ import type { Nullable } from "@docspace/shared/types";
|
||||
|
||||
export type UploadType = "pdf" | "file" | "folder";
|
||||
|
||||
export type ExtensiontionType = "docx" | "xlsx" | "pptx" | "pdf" | undefined;
|
||||
export type FolderExtensiontionType = undefined;
|
||||
|
||||
export type ExtensiontionType =
|
||||
| "docx"
|
||||
| "xlsx"
|
||||
| "pptx"
|
||||
| "pdf"
|
||||
| FolderExtensiontionType;
|
||||
|
||||
export type CreateEvent = Event & {
|
||||
payload?: {
|
||||
@ -21,26 +28,39 @@ export type CreateEvent = Event & {
|
||||
};
|
||||
};
|
||||
|
||||
export interface EmptyViewContainerProps {
|
||||
export type AccessType = Nullable<ShareAccessRights> | undefined;
|
||||
|
||||
export interface OutEmptyViewContainerProps {
|
||||
type: RoomsType;
|
||||
folderId: number;
|
||||
access?: Nullable<ShareAccessRights>;
|
||||
security?: Nullable<TFolderSecurity | TRoomSecurity>;
|
||||
|
||||
parentRoomType: Nullable<FolderType>;
|
||||
folderType: Nullable<FolderType>;
|
||||
isFolder: boolean;
|
||||
isArchiveFolderRoot: boolean;
|
||||
onClickInviteUsers?: (folderId: string | number, roomType: RoomsType) => void;
|
||||
setSelectFileFormRoomDialogVisible?: TStore["dialogsStore"]["setSelectFileFormRoomDialogVisible"];
|
||||
onCreateAndCopySharedLink?: TStore["contextOptionsStore"]["onCreateAndCopySharedLink"];
|
||||
isRootEmptyPage: boolean;
|
||||
}
|
||||
|
||||
export interface InjectedEmptyViewContainerProps {
|
||||
access: Nullable<ShareAccessRights>;
|
||||
security: Nullable<TFolderSecurity | TRoomSecurity>;
|
||||
selectedFolder?: ReturnType<
|
||||
TStore["selectedFolderStore"]["getSelectedFolder"]
|
||||
>;
|
||||
setVisibleInfoPanel?: (arg: boolean) => void;
|
||||
isGracePeriod: boolean;
|
||||
isVisibleInfoPanel: boolean;
|
||||
setViewInfoPanel?: TStore["infoPanelStore"]["setView"];
|
||||
rootFolderType: Nullable<FolderType>;
|
||||
onClickInviteUsers: (folderId: string | number, roomType: RoomsType) => void;
|
||||
onCreateAndCopySharedLink: TStore["contextOptionsStore"]["onCreateAndCopySharedLink"];
|
||||
setSelectFileFormRoomDialogVisible: TStore["dialogsStore"]["setSelectFileFormRoomDialogVisible"];
|
||||
setVisibleInfoPanel: (arg: boolean) => void;
|
||||
setViewInfoPanel: TStore["infoPanelStore"]["setView"];
|
||||
setInviteUsersWarningDialogVisible: TStore["dialogsStore"]["setInviteUsersWarningDialogVisible"];
|
||||
}
|
||||
|
||||
export type EmptyViewContainerProps = OutEmptyViewContainerProps &
|
||||
InjectedEmptyViewContainerProps;
|
||||
|
||||
export type OptionActions = {
|
||||
inviteUser: VoidFunction;
|
||||
onCreate: (extension: ExtensiontionType, withoutDialog?: boolean) => void;
|
||||
@ -51,4 +71,5 @@ export type OptionActions = {
|
||||
onUploadAction: (type: UploadType) => void;
|
||||
createAndCopySharedLink: VoidFunction;
|
||||
openInfoPanel: VoidFunction;
|
||||
onCreateRoom: VoidFunction;
|
||||
};
|
||||
|
||||
@ -0,0 +1,437 @@
|
||||
// (c) Copyright Ascensio System SIA 2009-2024
|
||||
//
|
||||
// This program is a free software product.
|
||||
// You can redistribute it and/or modify it under the terms
|
||||
// of the GNU Affero General Public License (AGPL) version 3 as published by the Free Software
|
||||
// Foundation. In accordance with Section 7(a) of the GNU AGPL its Section 15 shall be amended
|
||||
// to the effect that Ascensio System SIA expressly excludes the warranty of non-infringement of
|
||||
// any third-party rights.
|
||||
//
|
||||
// This program is distributed WITHOUT ANY WARRANTY, without even the implied warranty
|
||||
// of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. For details, see
|
||||
// the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html
|
||||
//
|
||||
// You can contact Ascensio System SIA at Lubanas st. 125a-25, Riga, Latvia, EU, LV-1021.
|
||||
//
|
||||
// The interactive user interfaces in modified source and object code versions of the Program must
|
||||
// display Appropriate Legal Notices, as required under Section 5 of the GNU AGPL version 3.
|
||||
//
|
||||
// Pursuant to Section 7(b) of the License you must retain the original Product logo when
|
||||
// distributing the program. Pursuant to Section 7(e) we decline to grant you any rights under
|
||||
// trademark law for use of our trademarks.
|
||||
//
|
||||
// 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 { match, P } from "ts-pattern";
|
||||
|
||||
import InviteUserFormIcon from "PUBLIC_DIR/images/emptyview/invite.user.svg";
|
||||
import UploadPDFFormIcon from "PUBLIC_DIR/images/emptyview/upload.pdf.form.svg";
|
||||
import UploadDevicePDFFormIcon from "PUBLIC_DIR/images/emptyview/upload.device.pdf.form.svg";
|
||||
import CreateNewFormIcon from "PUBLIC_DIR/images/emptyview/create.new.form.svg";
|
||||
|
||||
import EmptyRoomsRootDarkIcon from "PUBLIC_DIR/images/emptyview/empty.rooms.root.dark.svg";
|
||||
import EmptyRoomsRootLightIcon from "PUBLIC_DIR/images/emptyview/empty.rooms.root.light.svg";
|
||||
|
||||
import EmptyFormRoomDarkIcon from "PUBLIC_DIR/images/emptyview/empty.form.room.dark.svg";
|
||||
import EmptyFormRoomLightIcon from "PUBLIC_DIR/images/emptyview/empty.form.room.light.svg";
|
||||
|
||||
import EmptyFormRoomCollaboratorDarkIcon from "PUBLIC_DIR/images/emptyview/empty.form.room.collaborator.dark.svg";
|
||||
import EmptyFormRoomCollaboratorLightIcon from "PUBLIC_DIR/images/emptyview/empty.form.room.collaborator.light.svg";
|
||||
|
||||
import EmptyFormRoomFillingDarkIcon from "PUBLIC_DIR/images/emptyview/empty.form.room.filling.dark.svg";
|
||||
import EmptyFormRoomFillingLightIcon from "PUBLIC_DIR/images/emptyview/empty.form.room.filling.light.svg";
|
||||
|
||||
import EmptyCustomRoomDarkIcon from "PUBLIC_DIR/images/emptyview/empty.custom.room.dark.svg";
|
||||
import EmptyCustomRoomLightIcon from "PUBLIC_DIR/images/emptyview/empty.custom.room.light.svg";
|
||||
|
||||
import EmptyCustomRoomCollaboratorDarkIcon from "PUBLIC_DIR/images/emptyview/empty.custom.room.collaborator.dark.svg";
|
||||
import EmptyCustomRoomCollaboratorLightIcon from "PUBLIC_DIR/images/emptyview/empty.custom.room.collaborator.light.svg";
|
||||
|
||||
import EmptyPublicRoomDarkIcon from "PUBLIC_DIR/images/emptyview/empty.public.room.dark.svg";
|
||||
import EmptyPublicRoomLightIcon from "PUBLIC_DIR/images/emptyview/empty.public.room.light.svg";
|
||||
|
||||
import EmptyPublicRoomCollaboratorDarkIcon from "PUBLIC_DIR/images/emptyview/empty.public.room.collaborator.dark.svg";
|
||||
import EmptyPublicRoomCollaboratorLightIcon from "PUBLIC_DIR/images/emptyview/empty.public.room.collaborator.light.svg";
|
||||
|
||||
import EmptyCollaborationRoomDarkIcon from "PUBLIC_DIR/images/emptyview/empty.collaboration.room.dark.svg";
|
||||
import EmptyCollaborationRoomLightIcon from "PUBLIC_DIR/images/emptyview/empty.collaboration.room.light.svg";
|
||||
import EmptyCollaborationRoomCollaboratorDarkIcon from "PUBLIC_DIR/images/emptyview/empty.collaboration.room.collaborator.dark.svg";
|
||||
import EmptyCollaborationRoomCollaboratorLightIcon from "PUBLIC_DIR/images/emptyview/empty.collaboration.room.collaborator.light.svg";
|
||||
|
||||
import FormDefaultFolderLight from "PUBLIC_DIR/images/emptyview/empty.form.default.folder.light.svg";
|
||||
import FormDefaultFolderDark from "PUBLIC_DIR/images/emptyview/empty.form.default.folder.dark.svg";
|
||||
import DefaultFolderDark from "PUBLIC_DIR/images/emptyview/empty.default.folder.dark.svg";
|
||||
import DefaultFolderLight from "PUBLIC_DIR/images/emptyview/empty.default.folder.light.svg";
|
||||
import DefaultFolderUserDark from "PUBLIC_DIR/images/emptyview/empty.default.folder.user.dark.svg";
|
||||
import DefaultFolderUserLight from "PUBLIC_DIR/images/emptyview/empty.default.folder.user.light.svg";
|
||||
|
||||
import {
|
||||
FilesSelectorFilterTypes,
|
||||
FilterType,
|
||||
FolderType,
|
||||
RoomsType,
|
||||
ShareAccessRights,
|
||||
} from "@docspace/shared/enums";
|
||||
|
||||
import type { Nullable, TTranslation } from "@docspace/shared/types";
|
||||
import type { TFolderSecurity } from "@docspace/shared/api/files/types";
|
||||
import type { TRoomSecurity } from "@docspace/shared/api/rooms/types";
|
||||
|
||||
import { DefaultFolderType } from "./EmptyViewContainer.constants";
|
||||
import type {
|
||||
AccessType,
|
||||
ExtensiontionType,
|
||||
OptionActions,
|
||||
UploadType,
|
||||
} from "./EmptyViewContainer.types";
|
||||
|
||||
export const isUser = (access: AccessType) => {
|
||||
return (
|
||||
access !== ShareAccessRights.None &&
|
||||
access !== ShareAccessRights.RoomManager &&
|
||||
access !== ShareAccessRights.Collaborator
|
||||
);
|
||||
};
|
||||
|
||||
export const isAdmin = (access: AccessType) => {
|
||||
return !isUser(access);
|
||||
};
|
||||
|
||||
export const getFolderDescription = (
|
||||
t: TTranslation,
|
||||
access: AccessType,
|
||||
isNotAdmin: boolean,
|
||||
isArchiveFolderRoot: boolean,
|
||||
folderType: Nullable<FolderType>,
|
||||
parentRoomType: Nullable<FolderType>,
|
||||
) => {
|
||||
return match([parentRoomType, folderType, access])
|
||||
.with([P._, FolderType.Done, P._], () =>
|
||||
t("Files:EmptyFormFolderDoneDescriptionText"),
|
||||
)
|
||||
.with([P._, FolderType.InProgress, P._], () =>
|
||||
t("Files:EmptyFormFolderProgressDescriptionText"),
|
||||
)
|
||||
.with([P._, FolderType.SubFolderDone, P._], () =>
|
||||
t("Files:EmptyFormSubFolderDoneDescriptionText"),
|
||||
)
|
||||
.with([P._, FolderType.SubFolderInProgress, P._], () =>
|
||||
t("Files:EmptyFormSubFolderProgressDescriptionText"),
|
||||
)
|
||||
.with(
|
||||
[
|
||||
FolderType.FormRoom,
|
||||
null,
|
||||
P.when(() => isNotAdmin || isArchiveFolderRoot),
|
||||
],
|
||||
() => t("EmptyView:FormFolderDefaultUserDescription"),
|
||||
)
|
||||
.with([FolderType.FormRoom, DefaultFolderType, P._], () =>
|
||||
t("EmptyView:FormFolderDefaultDescription", {
|
||||
productName: t("Common:ProductName"),
|
||||
}),
|
||||
)
|
||||
.with([P._, DefaultFolderType, P.when(isAdmin)], () =>
|
||||
t("EmptyView:DefaultFolderDescription"),
|
||||
)
|
||||
.with([P._, DefaultFolderType, P.when(isUser)], () =>
|
||||
t("EmptyView:UserEmptyDescription"),
|
||||
)
|
||||
.otherwise(() => "");
|
||||
};
|
||||
|
||||
export const getRoomDescription = (
|
||||
t: TTranslation,
|
||||
isNotAdmin: boolean,
|
||||
isArchiveFolderRoot: boolean,
|
||||
) => {
|
||||
if (isNotAdmin || isArchiveFolderRoot)
|
||||
return t("EmptyView:UserEmptyDescription");
|
||||
|
||||
return t("EmptyView:EmptyDescription");
|
||||
};
|
||||
|
||||
export const getRootDesctiption = (
|
||||
t: TTranslation,
|
||||
rootFolderType: Nullable<FolderType>,
|
||||
) => {
|
||||
return match([rootFolderType])
|
||||
.with([FolderType.Rooms], () => t("Files:RoomEmptyContainerDescription"))
|
||||
.with([FolderType.USER], () => t("Test"))
|
||||
.with([FolderType.Recent], () => t("Test"))
|
||||
.with([FolderType.Archive], () => t("Test"))
|
||||
.with([FolderType.TRASH], () => t("Test"))
|
||||
.otherwise(() => "");
|
||||
};
|
||||
|
||||
export const getFolderTitle = (
|
||||
t: TTranslation,
|
||||
isArchiveFolderRoot: boolean,
|
||||
isNotAdmin: boolean,
|
||||
access: AccessType,
|
||||
folderType: Nullable<FolderType>,
|
||||
parentRoomType: Nullable<FolderType>,
|
||||
) => {
|
||||
return match([parentRoomType, folderType, access])
|
||||
.with([P._, FolderType.Done, P._], () =>
|
||||
t("Files:EmptyFormFolderDoneHeaderText"),
|
||||
)
|
||||
|
||||
.with([P._, FolderType.InProgress, P._], () =>
|
||||
t("Files:EmptyFormFolderProgressHeaderText"),
|
||||
)
|
||||
.with(
|
||||
[
|
||||
P._,
|
||||
P.union(FolderType.SubFolderDone, FolderType.SubFolderInProgress),
|
||||
P._,
|
||||
],
|
||||
() => t("Files:EmptyFormSubFolderHeaderText"),
|
||||
)
|
||||
.with(
|
||||
[
|
||||
FolderType.FormRoom,
|
||||
DefaultFolderType,
|
||||
P.when(() => isNotAdmin || isArchiveFolderRoot),
|
||||
],
|
||||
() => t("EmptyView:FormFolderDefaultUserTitle"),
|
||||
)
|
||||
.with([FolderType.FormRoom, DefaultFolderType, P._], () =>
|
||||
t("EmptyView:FormFolderDefaultTitle"),
|
||||
)
|
||||
.with([P._, DefaultFolderType, P._], () => t("Files:EmptyScreenFolder"))
|
||||
.otherwise(() => "");
|
||||
};
|
||||
|
||||
export const getRoomTitle = (
|
||||
t: TTranslation,
|
||||
type: RoomsType,
|
||||
access: AccessType,
|
||||
isNotAdmin: boolean,
|
||||
isArchiveFolderRoot: boolean,
|
||||
) => {
|
||||
const isCollaborator = access === ShareAccessRights.Collaborator;
|
||||
|
||||
if (isCollaborator) return t("EmptyView:CollaboratorEmptyTitle");
|
||||
|
||||
if (isNotAdmin || isArchiveFolderRoot) return t("Files:EmptyScreenFolder");
|
||||
|
||||
switch (type) {
|
||||
case RoomsType.FormRoom:
|
||||
return t("EmptyView:FormRoomEmptyTitle");
|
||||
case RoomsType.EditingRoom:
|
||||
return t("EmptyView:CollaborationRoomEmptyTitle");
|
||||
case RoomsType.PublicRoom:
|
||||
return t("EmptyView:PublicRoomEmptyTitle");
|
||||
case RoomsType.CustomRoom:
|
||||
return t("EmptyView:CustomRoomEmptyTitle");
|
||||
default:
|
||||
return "";
|
||||
}
|
||||
};
|
||||
|
||||
export const getRootTitle = (
|
||||
t: TTranslation,
|
||||
rootFolderType: Nullable<FolderType>,
|
||||
) => {
|
||||
return match([rootFolderType])
|
||||
.with([FolderType.Rooms], () =>
|
||||
t("Files:EmptyRootRoomHeader", {
|
||||
productName: t("Common:ProductName"),
|
||||
}),
|
||||
)
|
||||
.with([FolderType.USER], () => t("Test"))
|
||||
.with([FolderType.Recent], () => t("Test"))
|
||||
.with([FolderType.Archive], () => t("Test"))
|
||||
.with([FolderType.TRASH], () => t("Test"))
|
||||
.otherwise(() => "");
|
||||
};
|
||||
|
||||
export const getFolderIcon = (
|
||||
roomType: Nullable<FolderType>,
|
||||
isBaseTheme: boolean,
|
||||
access: AccessType,
|
||||
folderType: Nullable<FolderType>,
|
||||
) => {
|
||||
return match([roomType, folderType, access])
|
||||
.with([FolderType.FormRoom, P._, P._], () =>
|
||||
isBaseTheme ? <FormDefaultFolderLight /> : <FormDefaultFolderDark />,
|
||||
)
|
||||
.with([P._, DefaultFolderType, P.when(isUser)], () =>
|
||||
isBaseTheme ? <DefaultFolderUserLight /> : <DefaultFolderUserDark />,
|
||||
)
|
||||
.with([P._, DefaultFolderType, P.when(isAdmin)], () =>
|
||||
isBaseTheme ? <DefaultFolderLight /> : <DefaultFolderDark />,
|
||||
)
|
||||
.otherwise(() => <div />);
|
||||
};
|
||||
|
||||
export const getRoomIcon = (
|
||||
type: RoomsType,
|
||||
isBaseTheme: boolean,
|
||||
access: AccessType,
|
||||
) => {
|
||||
return (
|
||||
match([type, access])
|
||||
.with([RoomsType.FormRoom, ShareAccessRights.FormFilling], () =>
|
||||
isBaseTheme ? (
|
||||
<EmptyFormRoomFillingLightIcon />
|
||||
) : (
|
||||
<EmptyFormRoomFillingDarkIcon />
|
||||
),
|
||||
)
|
||||
.with([RoomsType.FormRoom, ShareAccessRights.Collaborator], () =>
|
||||
isBaseTheme ? (
|
||||
<EmptyFormRoomCollaboratorLightIcon />
|
||||
) : (
|
||||
<EmptyFormRoomCollaboratorDarkIcon />
|
||||
),
|
||||
)
|
||||
.with([RoomsType.FormRoom, P._], () =>
|
||||
isBaseTheme ? <EmptyFormRoomLightIcon /> : <EmptyFormRoomDarkIcon />,
|
||||
)
|
||||
.with(
|
||||
[
|
||||
RoomsType.EditingRoom,
|
||||
P.union(ShareAccessRights.None, ShareAccessRights.RoomManager),
|
||||
],
|
||||
() =>
|
||||
isBaseTheme ? (
|
||||
<EmptyCollaborationRoomLightIcon />
|
||||
) : (
|
||||
<EmptyCollaborationRoomDarkIcon />
|
||||
),
|
||||
)
|
||||
.with([RoomsType.EditingRoom, ShareAccessRights.Collaborator], () =>
|
||||
isBaseTheme ? (
|
||||
<EmptyCollaborationRoomCollaboratorLightIcon />
|
||||
) : (
|
||||
<EmptyCollaborationRoomCollaboratorDarkIcon />
|
||||
),
|
||||
)
|
||||
.with(
|
||||
[
|
||||
RoomsType.PublicRoom,
|
||||
P.union(ShareAccessRights.None, ShareAccessRights.RoomManager), // owner, docspace admin, room admin
|
||||
],
|
||||
() =>
|
||||
isBaseTheme ? (
|
||||
<EmptyPublicRoomLightIcon />
|
||||
) : (
|
||||
<EmptyPublicRoomDarkIcon />
|
||||
),
|
||||
)
|
||||
.with([RoomsType.PublicRoom, ShareAccessRights.Collaborator], () =>
|
||||
isBaseTheme ? (
|
||||
<EmptyPublicRoomCollaboratorLightIcon />
|
||||
) : (
|
||||
<EmptyPublicRoomCollaboratorDarkIcon />
|
||||
),
|
||||
)
|
||||
.with(
|
||||
[
|
||||
RoomsType.CustomRoom,
|
||||
P.union(ShareAccessRights.None, ShareAccessRights.RoomManager), // owner, docspace admin, room admin
|
||||
],
|
||||
() =>
|
||||
isBaseTheme ? (
|
||||
<EmptyCustomRoomLightIcon />
|
||||
) : (
|
||||
<EmptyCustomRoomDarkIcon />
|
||||
),
|
||||
)
|
||||
.with([RoomsType.CustomRoom, ShareAccessRights.Collaborator], () =>
|
||||
isBaseTheme ? (
|
||||
<EmptyCustomRoomCollaboratorLightIcon />
|
||||
) : (
|
||||
<EmptyCustomRoomCollaboratorDarkIcon />
|
||||
),
|
||||
)
|
||||
.with([P._, P.when(isUser)], () =>
|
||||
isBaseTheme ? <DefaultFolderUserLight /> : <DefaultFolderUserDark />,
|
||||
)
|
||||
// eslint-disable-next-line react/jsx-no-useless-fragment
|
||||
.otherwise(() => <></>)
|
||||
);
|
||||
};
|
||||
|
||||
export const getRootIcom = (
|
||||
rootFolderType: Nullable<FolderType>,
|
||||
access: AccessType,
|
||||
isBaseTheme: boolean,
|
||||
) => {
|
||||
return match([rootFolderType, access])
|
||||
.with([FolderType.Rooms, P._], () =>
|
||||
isBaseTheme ? <EmptyRoomsRootLightIcon /> : <EmptyRoomsRootDarkIcon />,
|
||||
)
|
||||
.with([FolderType.USER, P._], () => <div />)
|
||||
.with([FolderType.Recent, P._], () => <div />)
|
||||
.with([FolderType.Archive, P._], () => <div />)
|
||||
.with([FolderType.TRASH, P._], () => <div />)
|
||||
.otherwise(() => <div />);
|
||||
};
|
||||
|
||||
export const helperOptions = (
|
||||
actions: OptionActions,
|
||||
security: Nullable<TFolderSecurity | TRoomSecurity>,
|
||||
) => {
|
||||
const createInviteOption = (title: string, description: string) => {
|
||||
return {
|
||||
title,
|
||||
description,
|
||||
icon: <InviteUserFormIcon />,
|
||||
key: "invite-users",
|
||||
onClick: actions.inviteUser,
|
||||
disabled: !security?.EditAccess,
|
||||
};
|
||||
};
|
||||
|
||||
const createCreateFileOption = (
|
||||
title: string,
|
||||
description: string,
|
||||
extension: ExtensiontionType,
|
||||
withoutDialog: boolean = false,
|
||||
) => ({
|
||||
title,
|
||||
description,
|
||||
icon: <CreateNewFormIcon />,
|
||||
key: "create-form",
|
||||
onClick: () => actions.onCreate(extension, withoutDialog),
|
||||
disabled: !security?.Create,
|
||||
});
|
||||
|
||||
const createUploadFromDeviceOption = (
|
||||
title: string,
|
||||
description: string,
|
||||
uploadType: UploadType,
|
||||
) => ({
|
||||
title,
|
||||
description,
|
||||
icon: <UploadDevicePDFFormIcon />,
|
||||
key: "create-form",
|
||||
onClick: () => actions.onUploadAction(uploadType),
|
||||
disabled: !security?.Create,
|
||||
});
|
||||
|
||||
const createUploadFromDocSpace = (
|
||||
title: string,
|
||||
description: string,
|
||||
filterType: FilesSelectorFilterTypes | FilterType,
|
||||
) => ({
|
||||
title,
|
||||
description,
|
||||
icon: <UploadPDFFormIcon />,
|
||||
key: "upload-pdf-form",
|
||||
onClick: () => actions.uploadFromDocspace(filterType),
|
||||
disabled: !security?.Create,
|
||||
});
|
||||
|
||||
return {
|
||||
createInviteOption,
|
||||
createCreateFileOption,
|
||||
createUploadFromDocSpace,
|
||||
createUploadFromDeviceOption,
|
||||
};
|
||||
};
|
||||
@ -27478,11 +27478,11 @@ __metadata:
|
||||
|
||||
"typescript@patch:typescript@npm%3A^5#optional!builtin<compat/typescript>":
|
||||
version: 5.4.2
|
||||
resolution: "typescript@patch:typescript@npm%3A5.4.2#optional!builtin<compat/typescript>::version=5.4.2&hash=d69c25"
|
||||
resolution: "typescript@patch:typescript@npm%3A5.4.2#optional!builtin<compat/typescript>::version=5.4.2&hash=5adc0c"
|
||||
bin:
|
||||
tsc: bin/tsc
|
||||
tsserver: bin/tsserver
|
||||
checksum: 10/ef4fc2994cc0219dc9ada94c92106ba8d44cbfd7a0328ed6f8d730311caf66e114cdfa07fbc6f369bfc0fc182d9493851b3bf1644c06fc5818690b19ee960d72
|
||||
checksum: 10/f5f9a4133c2670761f0166eae5b3bafbc4a3fc24f0f42a93c9c893d9e9d6e66ea066969c5e7483fa66b4ae0e99125592553f3b92fd3599484de8be13b0615176
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user