Merge branch 'develop' into feature/ads-banner

packages/client/public/locales/en/Files.json

@@ -192,5 +192,7 @@
   "WithSubfolders": "With subfolders",
   "YouLeftTheRoom": "You have left the room",
   "LinkSettings": "Link settings",
-  "FileDownloadingIsRestricted": "File downloading is restricted in this room."
+  "FileDownloadingIsRestricted": "File downloading is restricted in this room.",
+  "RoomEmptyAtTheMoment": "This room is empty at the moment.",
+  "FilesWillAppearHere": "Files and folders added to the room will appear here."
 }

packages/client/src/components/EmptyContainer/RootFolderContainer.js

@@ -64,6 +64,7 @@ const RootFolderContainer = (props) => {
 
     myFolder,
     roomsFolder,
+    isPublicRoom,
   } = props;
   const personalDescription = t("EmptyFolderDecription");
 
@@ -77,10 +78,16 @@ const RootFolderContainer = (props) => {
   const favoritesDescription = t("FavoritesEmptyContainerDescription");
   const recentDescription = t("RecentViaLinkEmptyContainerDescription");
 
-  const roomsDescription =
+  const roomsDescription = isPublicRoom ? (
-    isVisitor || isCollaborator
+    <>
-      ? t("RoomEmptyContainerDescriptionUser")
+      <div>{t("RoomEmptyAtTheMoment")}</div>
-      : t("RoomEmptyContainerDescription");
+      <div>{t("FilesWillAppearHere")}</div>
+    </>
+  ) : isVisitor || isCollaborator ? (
+    t("RoomEmptyContainerDescriptionUser")
+  ) : (
+    t("RoomEmptyContainerDescription")
+  );
   const archiveRoomsDescription =
     isVisitor || isCollaborator
       ? t("ArchiveEmptyScreenUser")
@@ -338,6 +345,7 @@ export default inject(
     selectedFolderStore,
     clientLoadingStore,
     userStore,
+    publicRoomStore,
   }) => {
     const { isDesktopClient, isEncryptionSupport, organizationName, theme } =
       settingsStore;
@@ -353,6 +361,8 @@ export default inject(
     const { isPrivacyFolder, myFolderId, myFolder, roomsFolder } =
       treeFoldersStore;
 
+    const { isPublicRoom } = publicRoomStore;
+
     return {
       theme,
       isPrivacyFolder,
@@ -375,6 +385,7 @@ export default inject(
 
       myFolder,
       roomsFolder,
+      isPublicRoom,
     };
   }
 )(withTranslation(["Files"])(observer(RootFolderContainer)));

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

@@ -26,6 +26,8 @@ const EmptyContainer = ({
   isRoomNotFoundOrMoved,
   isGracePeriod,
   setInviteUsersWarningDialogVisible,
+  isRoot,
+  isPublicRoom,
 }) => {
   //const location = useLocation();
 
@@ -64,7 +66,8 @@ const EmptyContainer = ({
     );
   }
 
-  const isRootEmptyPage = parentId === 0;
+  const isRootEmptyPage = parentId === 0 || (isPublicRoom && isRoot);
+
   //isLoading && location?.state ? location.state?.isRoot : parentId === 0;
 
   return isFiltered ? (
@@ -95,6 +98,7 @@ export default inject(
     selectedFolderStore,
     clientLoadingStore,
     currentTariffStatusStore,
+    publicRoomStore,
   }) => {
     const { isErrorRoomNotAvailable, isFiltered } = filesStore;
     const { isLoading } = clientLoadingStore;
@@ -102,12 +106,15 @@ export default inject(
     const { isGracePeriod } = currentTariffStatusStore;
 
     const { setInviteUsersWarningDialogVisible } = dialogsStore;
+    const { isPublicRoom } = publicRoomStore;
 
     const isRoomNotFoundOrMoved =
       isFiltered === null &&
       selectedFolderStore.parentId === null &&
       isErrorRoomNotAvailable;
 
+    const isRoot = selectedFolderStore.pathParts?.length === 1;
+
     return {
       theme: settingsStore.theme,
       isFiltered,
@@ -118,6 +125,8 @@ export default inject(
       isGracePeriod,
       setInviteUsersWarningDialogVisible,
       type: selectedFolderStore.type,
+      isRoot,
+      isPublicRoom,
     };
   }
 )(observer(EmptyContainer));

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

@@ -26,7 +26,6 @@ import {
   SubmitToFormGallery,
   UnsavedChangesDialog,
   DeleteLinkDialog,
-  RoomSharingDialog,
   MoveToPublicRoom,
   BackupToPublicRoom,
   SettingsPluginDialog,
@@ -80,7 +79,6 @@ const Panels = (props) => {
     unsavedChangesDialogVisible,
     deleteLinkDialogVisible,
     embeddingPanelIsVisible,
-    roomSharingPanelVisible,
     moveToPublicRoomVisible,
     backupToPublicRoomVisible,
     settingsPluginDialogVisible,
@@ -182,7 +180,6 @@ const Panels = (props) => {
     ),
     deleteLinkDialogVisible && <DeleteLinkDialog key="delete-link-dialog" />,
     embeddingPanelIsVisible && <EmbeddingPanel key="embedding-panel" />,
-    roomSharingPanelVisible && <RoomSharingDialog key="room-sharing-dialog" />,
     moveToPublicRoomVisible && (
       <MoveToPublicRoom key="move-to-public-room-panel" />
     ),
@@ -241,7 +238,6 @@ export default inject(
       editLinkPanelIsVisible,
       deleteLinkDialogVisible,
       embeddingPanelIsVisible,
-      roomSharingPanelVisible,
       moveToPublicRoomVisible,
       backupToPublicRoomVisible,
       leaveRoomDialogVisible,
@@ -298,7 +294,6 @@ export default inject(
       unsavedChangesDialogVisible,
       deleteLinkDialogVisible,
       embeddingPanelIsVisible,
-      roomSharingPanelVisible,
       moveToPublicRoomVisible,
       backupToPublicRoomVisible,
       settingsPluginDialogVisible,

packages/client/src/components/dialogs/RoomSharingDialog/index.js

@@ -1,79 +0,0 @@
-import React from "react";
-import { inject, observer } from "mobx-react";
-import styled from "styled-components";
-import { withTranslation } from "react-i18next";
-import { toastr } from "@docspace/shared/components/toast";
-import { ModalDialog } from "@docspace/shared/components/modal-dialog";
-import { Button } from "@docspace/shared/components/button";
-import { TextInput } from "@docspace/shared/components/text-input";
-import copy from "copy-to-clipboard";
-
-import { getCorrectFourValuesStyle } from "@docspace/shared/utils";
-
-const StyledDeleteDialog = styled(ModalDialog)`
-  .modal-dialog-content-body {
-    display: flex;
-    gap: 12px;
-
-    .modal-dialog-content-body_text-input {
-      color: #a3a9ae;
-    }
-  }
-
-  .modal-dialog-aside-header {
-    margin: ${({ theme }) =>
-      getCorrectFourValuesStyle("0 -24px 0 -16px", theme.interfaceDirection)};
-    padding: ${({ theme }) =>
-      getCorrectFourValuesStyle("0 0 0 16px", theme.interfaceDirection)};
-  }
-`;
-
-const RoomSharingDialog = ({ t, tReady, visible, setIsVisible }) => {
-  const roomHref = window.location.href;
-
-  const onClose = () => {
-    setIsVisible(false);
-  };
-
-  const onCopy = () => {
-    copy(roomHref);
-    toastr.success(t("Translations:LinkCopySuccess"));
-    onClose();
-  };
-
-  return (
-    <StyledDeleteDialog isLoading={!tReady} visible={visible} onClose={onClose}>
-      <ModalDialog.Header>{t("Files:ShareRoom")}</ModalDialog.Header>
-      <ModalDialog.Body>
-        <div className="modal-dialog-content-body">
-          <TextInput
-            className="modal-dialog-content-body_text-input"
-            value={roomHref}
-            scale
-            isReadOnly
-            isDisabled
-          />
-          <Button
-            label={t("Translations:Copy")}
-            size="small"
-            onClick={onCopy}
-            isLoading={!tReady}
-          />
-        </div>
-      </ModalDialog.Body>
-    </StyledDeleteDialog>
-  );
-};
-
-export default inject(({ dialogsStore }) => {
-  const { setRoomSharingPanelVisible, roomSharingPanelVisible } = dialogsStore;
-
-  return {
-    visible: roomSharingPanelVisible,
-    setIsVisible: setRoomSharingPanelVisible,
-  };
-})(
-  withTranslation(["Files", "Common", "Translations"])(
-    observer(RoomSharingDialog)
-  )
-);

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

@@ -32,7 +32,6 @@ import DataReassignmentDialog from "./DataReassignmentDialog";
 import SubmitToFormGallery from "./SubmitToFormGallery";
 import UnsavedChangesDialog from "./UnsavedChangesDialog";
 import DeleteLinkDialog from "./DeleteLinkDialog";
-import RoomSharingDialog from "./RoomSharingDialog";
 import MoveToPublicRoom from "./MoveToPublicRoom";
 import BackupToPublicRoom from "./BackupToPublicRoom";
 import SettingsPluginDialog from "./SettingsPluginDialog";
@@ -76,7 +75,6 @@ export {
   SubmitToFormGallery,
   UnsavedChangesDialog,
   DeleteLinkDialog,
-  RoomSharingDialog,
   MoveToPublicRoom,
   BackupToPublicRoom,
   SettingsPluginDialog,

packages/client/src/pages/Home/Section/Header/index.js

@@ -30,6 +30,7 @@ import PublicRoomIconUrl from "PUBLIC_DIR/images/public-room.react.svg?url";
 import PluginMoreReactSvgUrl from "PUBLIC_DIR/images/plugin.more.react.svg?url";
 import LeaveRoomSvgUrl from "PUBLIC_DIR/images/logout.react.svg?url";
 import CatalogRoomsReactSvgUrl from "PUBLIC_DIR/images/catalog.rooms.react.svg?url";
+import TabletLinkReactSvgUrl from "PUBLIC_DIR/images/tablet-link.reat.svg?url";
 
 import React from "react";
 import { inject, observer } from "mobx-react";
@@ -237,7 +238,6 @@ const SectionHeaderContent = (props) => {
     isPublicRoom,
     theme,
     whiteLabelLogoUrls,
-    setRoomSharingPanelVisible,
     downloadAction,
     isPublicRoomType,
     isCustomRoomType,
@@ -599,7 +599,8 @@ const SectionHeaderContent = (props) => {
   };
 
   const onShareRoom = () => {
-    setRoomSharingPanelVisible(true);
+    copy(window.location.href);
+    toastr.success(t("Translations:LinkCopySuccess"));
   };
 
   const getContextOptionsFolder = () => {
@@ -628,22 +629,18 @@ const SectionHeaderContent = (props) => {
 
     if (isPublicRoom) {
       return [
-        security?.Download && {
-          key: "public-room_edit",
-          label: t("Files:DownloadAll"),
-          icon: DownloadReactSvgUrl,
-          onClick: onDownloadAll,
-        },
-        security?.Download && {
-          key: "public-room_separator",
-          isSeparator: true,
-        },
         {
           key: "public-room_share",
-          label: t("Files:ShareRoom"),
+          label: t("Files:CopyLink"),
-          icon: ShareReactSvgUrl,
+          icon: TabletLinkReactSvgUrl,
           onClick: onShareRoom,
         },
+        security?.Download && {
+          key: "public-room_edit",
+          label: t("Common:Download"),
+          icon: DownloadReactSvgUrl,
+          onClick: onDownloadAll,
+        },
       ];
     }
 
@@ -1227,7 +1224,6 @@ export default inject(
       setRestoreAllArchive,
       setInvitePanelOptions,
       setInviteUsersWarningDialogVisible,
-      setRoomSharingPanelVisible,
       setLeaveRoomDialogVisible,
     } = dialogsStore;
 
@@ -1459,7 +1455,6 @@ export default inject(
       categoryType,
       theme,
       whiteLabelLogoUrls,
-      setRoomSharingPanelVisible,
       isFrame,
       currentDeviceType,
       setLeaveRoomDialogVisible,

packages/client/src/pages/PublicRoom/PublicRoomPage.js

@@ -6,7 +6,6 @@ import SectionHeaderContent from "../Home/Section/Header";
 import SectionFilterContent from "../Home/Section/Filter";
 import FilesPanels from "../../components/FilesPanels";
 import SectionWrapper from "SRC_DIR/components/Section";
-import { RoomSharingDialog } from "../../components/dialogs";
 import SelectionArea from "../Home/SelectionArea/FilesSelectionArea";
 import MediaViewer from "../Home/MediaViewer";
 

packages/client/src/store/DialogsStore.js

@@ -11,7 +11,6 @@ class DialogsStore {
   versionHistoryStore;
   infoPanelStore;
 
-  roomSharingPanelVisible = false;
   ownerPanelVisible = false;
   moveToPanelVisible = false;
   restorePanelVisible = false;
@@ -117,10 +116,6 @@ class DialogsStore {
     this.restoreRoomDialogVisible = visible;
   };
 
-  setRoomSharingPanelVisible = (roomSharingPanelVisible) => {
-    this.roomSharingPanelVisible = roomSharingPanelVisible;
-  };
-
   setIsFolderActions = (isFolderActions) => {
     this.isFolderActions = isFolderActions;
   };

packages/client/src/store/UploadDataStore.js

@@ -929,21 +929,21 @@ class UploadDataStore {
     if (!this.isParallel) {
       uploadedSize = uploaded
         ? fileSize
-        : index * this.settingsStore.chunkUploadSize;
+        : index * this.filesSettingsStore.chunkUploadSize;
 
       newPercent = this.getNewPercent(uploadedSize, indexOfFile);
     } else {
       if (!uploaded) {
         uploadedSize =
-          fileSize <= this.settingsStore.chunkUploadSize
+          fileSize <= this.filesSettingsStore.chunkUploadSize
             ? fileSize
-            : this.settingsStore.chunkUploadSize;
+            : this.filesSettingsStore.chunkUploadSize;
       } else {
         uploadedSize = isFinalize
           ? 0
-          : fileSize <= this.settingsStore.chunkUploadSize
+          : fileSize <= this.filesSettingsStore.chunkUploadSize
             ? fileSize
-            : fileSize - index * this.settingsStore.chunkUploadSize;
+            : fileSize - index * this.filesSettingsStore.chunkUploadSize;
       }
       newPercent = this.getFilesPercent(uploadedSize);
     }
@@ -1132,7 +1132,7 @@ class UploadDataStore {
     operationId,
     toFolderId
   ) => {
-    const { chunkUploadCount: asyncChunkUploadCount } = this.settingsStore;
+    const { chunkUploadCount: asyncChunkUploadCount } = this.filesSettingsStore;
     const length = requestsDataArray.length;
 
     const isThirdPartyFolder = typeof toFolderId === "string";
@@ -1228,7 +1228,7 @@ class UploadDataStore {
       // console.log("IS PARALLEL");
       const notUploadedFiles = this.files.filter((f) => !f.inAction);
 
-      const { chunkUploadCount } = this.settingsStore;
+      const { chunkUploadCount } = this.filesSettingsStore;
 
       const countFiles =
         notUploadedFiles.length >= chunkUploadCount

packages/shared/components/navigation/Navigation.styled.ts

@@ -19,10 +19,12 @@ const StyledContainer = styled.div<{
   withLogo: boolean;
   isDesktopClient?: boolean;
   width?: number;
+  isPublicRoom?: boolean;
 }>`
   ${(props) =>
     !props.isDropBoxComponent &&
     props.isDesktop &&
+    !props.isPublicRoom &&
     css`
       width: 100%;
       max-width: 100%;

packages/shared/components/navigation/Navigation.tsx

@@ -225,6 +225,7 @@ const Navigation = ({
             isDesktopClient={isDesktopClient}
             isInfoPanelVisible={isInfoPanelVisible}
             withLogo={!!withLogo}
+            isPublicRoom={isPublicRoom}
             className="navigation-container"
           >
             {withLogo && (

packages/shared/components/navigation/sub-components/ContextBtn.tsx

@@ -51,7 +51,7 @@ const ContextButton = ({
       />
       <ContextMenu
         model={model}
-        containerRef={ref}
+        // containerRef={ref}
         ref={menuRef}
         onHide={onHide}
         scaled={false}

packages/shared/package.json

@@ -169,4 +169,3 @@
     "react-dom": "^18.2.0"
   }
 }
-

packages/shared/store/AuthStore.ts

@@ -390,7 +390,7 @@ class AuthStore {
     return (
       this.settingsStore?.isLoaded &&
       !!this.settingsStore?.socketUrl &&
-      !this.settingsStore?.isPublicRoom
+      !isPublicRoom()
       // || //this.userStore.isAuthenticated
     );
   }

packages/shared/store/SettingsStore.ts

@@ -23,7 +23,7 @@ import {
 } from "../api/settings/types";
 import { TUser } from "../api/people/types";
 import { size as deviceSize, isTablet, getSystemTheme } from "../utils";
-import { frameCallEvent, getShowText } from "../utils/common";
+import { frameCallEvent, getShowText, isPublicRoom } from "../utils/common";
 import { setCookie, getCookie } from "../utils/cookie";
 import { combineUrl } from "../utils/combineUrl";
 import FirebaseHelper from "../utils/firebase";
@@ -185,8 +185,6 @@ class SettingsStore {
 
   hasShortenService = false;
 
-  isPublicRoom = false;
-
   withPaging = false;
 
   customSchemaList: TCustomSchema[] = [];
@@ -828,7 +826,7 @@ class SettingsStore {
 
   get socketHelper() {
     const socketUrl =
-      this.isPublicRoom && !this.publicRoomKey ? "" : this.socketUrl;
+      isPublicRoom() && !this.publicRoomKey ? "" : this.socketUrl;
 
     return new SocketIOHelper(socketUrl, this.publicRoomKey);
   }