diff --git a/packages/client/public/locales/en/EmptyView.json b/packages/client/public/locales/en/EmptyView.json index 906410ee79..efd8496e49 100644 --- a/packages/client/public/locales/en/EmptyView.json +++ b/packages/client/public/locales/en/EmptyView.json @@ -41,5 +41,7 @@ "MigrationDataDescription": "Import data to your {{productName}} from ONLYOFFICE Workspace, Google Workspace, or Nextcloud.", "EmptyRootRoomUserTitle": "There are no rooms here yet", "EmptyRootRoomUserDescription": "The shared room will appear here.", - "EmptyRecentDescription": "Your last viewed or edited docs will be displayed in this section." + "EmptyRecentDescription": "Your last viewed or edited docs will be displayed in this section.", + "EmptyGroupAddedUserOptionDescription": "Add group members and assign the head", + "EmptyGroupDeleteOptionDescription": "If you don't need this group anymore" } diff --git a/packages/client/src/pages/Home/Section/AccountsBody/EmptyScreen.js b/packages/client/src/pages/Home/Section/AccountsBody/EmptyScreen.js index e510b4a86e..0735dcb023 100644 --- a/packages/client/src/pages/Home/Section/AccountsBody/EmptyScreen.js +++ b/packages/client/src/pages/Home/Section/AccountsBody/EmptyScreen.js @@ -28,11 +28,13 @@ import React from "react"; import { inject, observer } from "mobx-react"; import { useTranslation } from "react-i18next"; +import InviteUserIcon from "PUBLIC_DIR/images/emptyview/invite.user.svg"; +import TrashIcon from "PUBLIC_DIR/images/emptyview/trash.svg"; +import ClearEmptyFilterSvg from "PUBLIC_DIR/images/clear.empty.filter.svg"; + import EmptyScreenPersonSvgLight from "PUBLIC_DIR/images/emptyFilter/empty.filter.people.light.svg"; import EmptyScreenPersonSvgDark from "PUBLIC_DIR/images/emptyFilter/empty.filter.people.dark.svg"; -import ClearEmptyFilterSvg from "PUBLIC_DIR/images/clear.empty.filter.svg"; - import { EmptyView } from "@docspace/shared/components/empty-view"; const EmptyScreen = ({ @@ -41,12 +43,23 @@ const EmptyScreen = ({ setIsLoading, theme, isEmptyGroup = false, + isRoomAdmin, + editGroup, + deleteGroup, + currentGroup, }) => { - const { t } = useTranslation(["People", "Common"]); + const { t } = useTranslation([ + "People", + "Common", + "EmptyView", + "DeleteDialog", + ]); const isPeopleAccounts = window.location.pathname.includes("accounts/people"); const title = t("Common:NotFoundUsers"); - const description = t("Common:NotFoundUsersDescription"); + const description = isEmptyGroup + ? t("Common:EmptyGroupDescription") + : t("Common:NotFoundUsersDescription"); /** * @type {React.MouseEventHandler} @@ -58,51 +71,77 @@ const EmptyScreen = ({ isPeopleAccounts ? resetFilter() : resetInsideGroupFilter(); }; - const imageSrc = theme.isBase ? ( + const icon = theme.isBase ? ( ) : ( ); - if (isEmptyGroup) { - return ( - - ); - } + /** + * @returns {import("@docspace/shared/components/empty-view").EmptyViewOptionsType} + */ + const getOptions = () => { + if (isEmptyGroup) { + return [ + { + key: "group-add-user", + title: t("Common:AddUsers"), + description: t("EmptyView:EmptyGroupAddedUserOptionDescription"), + disabled: isRoomAdmin || currentGroup?.isLDAP, + icon: , + onClick: () => editGroup(currentGroup), + }, + { + key: "delete-group", + title: t("DeleteDialog:DeleteGroupTitle"), + description: t("EmptyView:EmptyGroupDeleteOptionDescription"), + disabled: isRoomAdmin || currentGroup?.isLDAP, + icon: , + onClick: () => deleteGroup(currentGroup, true), + }, + ]; + } + + return { + to: "", + description: t("Common:ClearFilter"), + icon: , + onClick: onResetFilter, + }; + }; return ( , - onClick: onResetFilter, - }} + options={getOptions()} + description={description} /> ); }; export default inject(({ peopleStore, clientLoadingStore, settingsStore }) => { - const { resetFilter, groupsStore } = peopleStore; + const { resetFilter, groupsStore, userStore } = peopleStore; - const { resetInsideGroupFilter } = groupsStore; + const { resetInsideGroupFilter, editGroup, deleteGroup, currentGroup } = + groupsStore; + + console.log({ editGroup }); const { setIsSectionBodyLoading } = clientLoadingStore; + const isRoomAdmin = userStore?.user?.isRoomAdmin; + const setIsLoading = (param) => { setIsSectionBodyLoading(param); }; return { resetFilter, resetInsideGroupFilter, - + isRoomAdmin, + editGroup, + deleteGroup, + currentGroup, setIsLoading, theme: settingsStore.theme, }; diff --git a/packages/client/src/store/GroupsStore.ts b/packages/client/src/store/GroupsStore.ts index ca184a7265..55d7c516f5 100644 --- a/packages/client/src/store/GroupsStore.ts +++ b/packages/client/src/store/GroupsStore.ts @@ -558,6 +558,19 @@ class GroupsStore { ]; }; + deleteGroup = (item: TGroup, forInsideGroup: boolean) => { + if (forInsideGroup) { + this.setBufferSelection(item); + } + this.onDeleteClick(item.name); + }; + + editGroup = (item: TGroup) => { + const event: Event & { item?: TGroup } = new Event(Events.GROUP_EDIT); + event.item = item; + window.dispatchEvent(event); + }; + getGroupContextOptions = ( t, item, @@ -575,11 +588,7 @@ class GroupsStore { label: t("PeopleTranslations:EditGroup"), title: t("PeopleTranslations:EditGroup"), icon: PencilReactSvgUrl, - onClick: () => { - const event = new Event(Events.GROUP_EDIT); - event.item = item; - window.dispatchEvent(event); - }, + onClick: () => this.editGroup(item), }, !forInfoPanel && { id: "info", @@ -613,12 +622,7 @@ class GroupsStore { label: t("Common:Delete"), title: t("Common:Delete"), icon: TrashReactSvgUrl, - onClick: () => { - if (forInsideGroup) { - this.setBufferSelection(item); - } - this.onDeleteClick(item.name); - }, + onClick: () => this.deleteGroup(item, forInsideGroup), }, ]; }; diff --git a/packages/shared/components/empty-view/EmptyView.types.ts b/packages/shared/components/empty-view/EmptyView.types.ts index 2b56e90c1e..8a4185c84a 100644 --- a/packages/shared/components/empty-view/EmptyView.types.ts +++ b/packages/shared/components/empty-view/EmptyView.types.ts @@ -1,4 +1,5 @@ import type { To } from "react-router-dom"; +import type { ContextMenuModel } from "../context-menu"; export type EmptyViewLinkType = { to: To; diff --git a/public/images/emptyview/trash.svg b/public/images/emptyview/trash.svg new file mode 100644 index 0000000000..aaa2c5eee8 --- /dev/null +++ b/public/images/emptyview/trash.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/public/locales/en/Common.json b/public/locales/en/Common.json index 38f836ddae..8f3625dae4 100644 --- a/public/locales/en/Common.json +++ b/public/locales/en/Common.json @@ -38,9 +38,9 @@ "Bytes": "bytes", "CancelButton": "Cancel", "ChangeButton": "Change", - "ChangeUserPermissions": "Change user permissions to the invited people or <1>upgrade your tariff plan.", "ChangeQuota": "Change quota", "ChangesSavedSuccessfully": "Changes saved successfully", + "ChangeUserPermissions": "Change user permissions to the invited people or <1>upgrade your tariff plan.", "ChooseFromTemplates": "Choose from Templates", "ClearAll": "Clear all", "ClearFilter": "Clear filter", @@ -143,8 +143,8 @@ "DontShowAgain": "Don't show again", "Download": "Download", "DownloadApps": "Download applications", - "DownloadOperationTitle": "File downloading in progress", "DownloadOperationDescription": "Once ready, you can find the files in your browser's download folder and close this tab.", + "DownloadOperationTitle": "File downloading in progress", "DropzoneTitleExsts": "(JPG or PNG)", "DropzoneTitleLink": "Select new image", "DropzoneTitleSecondary": "or drop file here", @@ -159,6 +159,7 @@ "EmptyFilterDescriptionText": "No files or folders match this filter. Try a different one or clear filter to view all files.", "EmptyFilterFilesDescription": "No files or folders match this filter. Try another or remove the filter to view all files.", "EmptyFilterRoomsDescription": "No room matches this filter. Try another or reset filter to view all rooms.", + "EmptyGroupDescription": "This group is empty", "EmptyGroupsDescription": "Please create the first group.", "EmptyGroupsHeader": "No groups here yet", "EmptyHeader": "No other accounts here yet", @@ -334,8 +335,8 @@ "OAuthRoomsWriteDescription": "View and manage all rooms", "OCT": "OCT", "OFORMsGallery": "Form Gallery", - "OKButton": "OK", "OkButton": "Ok", + "OKButton": "OK", "Or": "or", "orContinueWith": "or continue with", "OrganizationName": "ONLYOFFICE",