Client:Components: Added ShareCollectSelector

packages/client/src/components/FilesPanels/index.js

@@ -78,6 +78,7 @@ import { CreatedPDFFormDialog } from "../dialogs/CreatedPDFFormDialog";
 import { PDFFormEditingDialog } from "../dialogs/PDFFormEditingDialog";
 import { SharePDFFormDialog } from "../dialogs/SharePDFFormDialog";
 import { FillPDFDialog } from "../dialogs/FillPDFDialog";
+import { ShareCollectSelector } from "../ShareCollectSelector";
 
 const Panels = (props) => {
   const {
@@ -133,6 +134,7 @@ const Panels = (props) => {
     pdfFormEditVisible,
     selectFileFormRoomOpenRoot,
     fillPDFDialogData,
+    shareCollectSelector,
   } = props;
 
   const [createPDFFormFile, setCreatePDFFormFile] = useState({
@@ -359,6 +361,12 @@ const Panels = (props) => {
     fillPDFDialogData.visible && (
       <FillPDFDialog key="fill-pdf-form-dialog" {...fillPDFDialogData} />
     ),
+    shareCollectSelector.visible && (
+      <ShareCollectSelector
+        key="share-collect-dialog"
+        {...shareCollectSelector}
+      />
+    ),
   ];
 };
 
@@ -420,6 +428,7 @@ export default inject(
       pdfFormEditVisible,
       selectFileFormRoomOpenRoot,
       fillPDFDialogData,
+      shareCollectSelector,
     } = dialogsStore;
 
     const { preparationPortalDialogVisible } = backup;
@@ -489,6 +498,7 @@ export default inject(
       pdfFormEditVisible,
       selectFileFormRoomOpenRoot,
       fillPDFDialogData,
+      shareCollectSelector,
     };
   },
 )(observer(Panels));

packages/client/src/components/ShareCollectSelector/ShareCollectSelector.tsx

@@ -0,0 +1,156 @@
+// (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 React from "react";
+import { useTranslation } from "react-i18next";
+import { inject, observer } from "mobx-react";
+
+import { RoomsType } from "@docspace/shared/enums";
+import FilesSelectorWrapper from "@docspace/shared/selectors/Files";
+
+import type {
+  TFileSecurity,
+  TFolderSecurity,
+} from "@docspace/shared/api/files/types";
+import type { TRoomSecurity } from "@docspace/shared/api/rooms/types";
+import type { TSelectedFileInfo } from "@docspace/shared/selectors/Files/FilesSelector.types";
+
+import type {
+  InjectShareCollectSelectorProps,
+  ShareCollectSelectorProps,
+} from "./ShareCollectSelector.types";
+
+const ShareCollectSelector = inject<TStore>(
+  ({ settingsStore, filesSettingsStore, dialogsStore }) => {
+    const { socketHelper, currentDeviceType } = settingsStore;
+    const { setShareCollectSelector } = dialogsStore;
+
+    const { getIcon } = filesSettingsStore;
+    return {
+      socketHelper,
+      currentDeviceType,
+      getIcon,
+      setShareCollectSelector,
+    };
+  },
+)(
+  observer(
+    ({
+      file,
+      visible,
+      socketHelper,
+      currentDeviceType,
+      getIcon,
+      setShareCollectSelector,
+    }: ShareCollectSelectorProps & InjectShareCollectSelectorProps) => {
+      const { t } = useTranslation(["Common", "Editor"]);
+
+      const requestRunning = React.useRef(false);
+
+      const headerLabel = "";
+
+      const onSubmit = () => {};
+
+      const getIsDisabled = (
+        isFirstLoad: boolean,
+        isSelectedParentFolder: boolean,
+        selectedItemId: string | number | undefined,
+        selectedItemType: "rooms" | "files" | undefined,
+        isRoot: boolean,
+        selectedItemSecurity:
+          | TFolderSecurity
+          | TRoomSecurity
+          | TFileSecurity
+          | undefined,
+        selectedFileInfo: TSelectedFileInfo,
+      ): boolean => {
+        if (selectedItemType === "rooms" || isRoot) return true;
+
+        if (isFirstLoad) return true;
+        if (requestRunning.current) return true;
+        if (selectedFileInfo) return true;
+
+        if (!selectedItemSecurity) return false;
+
+        return "CopyTo" in selectedItemSecurity
+          ? !selectedItemSecurity?.CopyTo
+          : !selectedItemSecurity.Copy;
+      };
+
+      const onClose = () => {
+        setShareCollectSelector(false, null);
+      };
+
+      const getFilesArchiveError = React.useCallback(
+        (name: string) => t("Common:ArchivedRoomAction", { name }),
+        [t],
+      );
+
+      const getIconUrl = (size: number, fileExst: string) => {
+        return getIcon(size, fileExst) ?? "";
+      };
+
+      return (
+        <FilesSelectorWrapper
+          withCreate
+          withHeader
+          withSearch
+          isRoomsOnly
+          withBreadCrumbs
+          withoutBackButton
+          withCancelButton
+          currentFolderId=""
+          rootFolderType={file.rootFolderType}
+          createDefineRoomType={RoomsType.FormRoom}
+          isPanelVisible={visible}
+          socketHelper={socketHelper}
+          socketSubscribers={socketHelper.socketSubscribers}
+          currentDeviceType={currentDeviceType}
+          headerLabel={t("Common:ShareAndCollect")}
+          createDefineRoomLabel={t("Common:NewFillingFormRoom")}
+          submitButtonLabel={t("Common:CopyHere")}
+          cancelButtonLabel={t("Common:CancelButton")}
+          cancelButtonId="share-collect-selector-cancel"
+          onCancel={onClose}
+          onSubmit={onSubmit}
+          getIsDisabled={getIsDisabled}
+          getFilesArchiveError={getFilesArchiveError}
+          disabledItems={[]}
+          descriptionText=""
+          footerInputHeader=""
+          footerCheckboxLabel=""
+          currentFooterInputValue=""
+          embedded={false}
+          isThirdParty={false}
+          withFooterCheckbox={false}
+          withFooterInput={false}
+          getIcon={getIconUrl}
+        />
+      );
+    },
+  ),
+) as unknown as React.FC<ShareCollectSelectorProps>;
+
+export default ShareCollectSelector;

packages/client/src/components/ShareCollectSelector/ShareCollectSelector.types.ts

@@ -0,0 +1,36 @@
+// (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 type { TFile } from "@docspace/shared/api/files/types";
+
+export interface ShareCollectSelectorProps {
+  visible: boolean;
+  file: TFile;
+}
+
+export interface InjectShareCollectSelectorProps
+  extends Pick<TStore["settingsStore"], "socketHelper" | "currentDeviceType">,
+    Pick<TStore["filesSettingsStore"], "getIcon">,
+    Pick<TStore["dialogsStore"], "setShareCollectSelector"> {}

packages/client/src/components/ShareCollectSelector/index.ts

@@ -0,0 +1,26 @@
+// (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
+export { default as ShareCollectSelector } from "./ShareCollectSelector";

packages/client/src/components/dialogs/FillPDFDialog/FillPDFDialog.tsx

@@ -35,14 +35,17 @@ import {
 import { Card } from "./sub-components/Card";
 
 import { Container } from "./FillPDFDialog.styled";
-import type { FillPDFDialogProps } from "./FillPDFDialog.types";
+import type {
+  FillPDFDialogProps,
+  InjectFillPDFDialogProps,
+} from "./FillPDFDialog.types";
 
 const FillPDFDialog = inject<TStore>(
   ({ dialogsStore, contextOptionsStore }) => {
-    const { setFillPDFDialogData } = dialogsStore;
+    const { setFillPDFDialogData, setShareCollectSelector } = dialogsStore;
     const { gotoDocEditor } = contextOptionsStore;
 
-    return { setFillPDFDialogData, gotoDocEditor };
+    return { setFillPDFDialogData, gotoDocEditor, setShareCollectSelector };
   },
 )(
   observer(
@@ -50,8 +53,9 @@ const FillPDFDialog = inject<TStore>(
       visible,
       setFillPDFDialogData,
       gotoDocEditor,
+      setShareCollectSelector,
       data,
-    }: FillPDFDialogProps) => {
+    }: FillPDFDialogProps & InjectFillPDFDialogProps) => {
       const { t } = useTranslation(["FillPDFDialog"]);
 
       const onClose = () => {
@@ -63,7 +67,10 @@ const FillPDFDialog = inject<TStore>(
         onClose();
       };
 
-      const openSelector = () => {};
+      const openSelector = () => {
+        setShareCollectSelector(true, data);
+        onClose();
+      };
 
       return (
         <ModalDialog
@@ -95,6 +102,6 @@ const FillPDFDialog = inject<TStore>(
       );
     },
   ),
-);
+) as unknown as React.FC<FillPDFDialogProps>;
 
 export default FillPDFDialog;

packages/client/src/components/dialogs/FillPDFDialog/FillPDFDialog.types.ts

@@ -26,9 +26,14 @@
 
 import type { TFile } from "@docspace/shared/api/files/types";
 
-export interface FillPDFDialogProps
-  extends Partial<Pick<TStore["dialogsStore"], "setFillPDFDialogData">>,
-    Partial<Pick<TStore["contextOptionsStore"], "gotoDocEditor">> {
+export interface FillPDFDialogProps {
   visible: boolean;
   data: TFile;
 }
+
+export interface InjectFillPDFDialogProps
+  extends Pick<
+      TStore["dialogsStore"],
+      "setFillPDFDialogData" | "setShareCollectSelector"
+    >,
+    Pick<TStore["contextOptionsStore"], "gotoDocEditor"> {}

packages/client/src/store/DialogsStore.js

@@ -122,6 +122,10 @@ class DialogsStore {
     visible: false,
     data: null,
   };
+  shareCollectSelector = {
+    visible: false,
+    file: null,
+  };
 
   constructor(
     authStore,
@@ -525,6 +529,12 @@ class DialogsStore {
       data,
     };
   };
+  setShareCollectSelector = (visible, file) => {
+    this.shareCollectSelector = {
+      visible,
+      file,
+    };
+  };
 }
 
 export default DialogsStore;

public/locales/en/Common.json

@@ -294,8 +294,8 @@
   "NotFoundUsersDescription": "No users match your search. Please adjust your search parameters or clear the search field to view the full list of users.",
   "NotSupportedFormat": "Sorry, this file format isn't supported",
   "OFORMsGallery": "Form Gallery",
-  "OkButton": "Ok",
   "OKButton": "OK",
+  "OkButton": "Ok",
   "Or": "or",
   "orContinueWith": "or continue with",
   "OtherLabel": "Other",
@@ -402,6 +402,7 @@
   "SettingsPersonal": "Personal",
   "SetToDefault": "Set to default",
   "Share": "Share",
+  "ShareAndCollect": "Share & collect",
   "SharedLinks": "Shared links",
   "ShareDocument": "Share this document",
   "ShareDocumentDescription": "Provide access to the document and set the permission levels.",