Client:EmptyView Added a empty folder screen

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

@@ -1,9 +1,16 @@
 {
   "CollaboratorEmptyDesciprtion": "Get started with quick actions:",
   "CollaboratorEmptyTitle": "The room is empty.",
+  "CreateDocument": "Create a new document",
+  "CreateDocumentDescription": "Take advantage of vast word processing functionality.",
   "CreateNewFileDescription": "Start working in the room by creating files or folders",
   "CreateNewFileTitle": "Create a new file",
+  "CreatePresentation": "Create a new presentation",
+  "CreatePresentationDescription": "Impress your audience with stunning slides.",
+  "CreateSpreadsheet": "Create a new spreadsheet",
+  "CreateSpreadsheetDescription": "Carry out precise calculations with minimal effort.",
   "CustomRoomEmptyTitle": "Welcome to the Custom room",
+  "DefaultFolderDescription": "Drop files here or create new ones.",
   "EmptyDescription": "Get started with quick actions:",
   "FormFolderDefaultDescription": "Drop PDF forms here or upload from {{productName}} or device.",
   "FormFolderDefaultTitle": "No forms here yet",

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

@@ -79,18 +79,16 @@ const EmptyFolderContainer = ({
     [t, canCreateFiles, type],
   );
 
-  if (roomType || parentRoomType === FolderType.FormRoom) {
-    return (
-      <EmptyViewContainer
-        type={roomType}
-        folderType={type}
-        isFolder={!isRoom}
-        folderId={folderId}
-        parentRoomType={parentRoomType}
-        isArchiveFolderRoot={isArchiveFolderRoot}
-      />
-    );
-  }
+  return (
+    <EmptyViewContainer
+      type={roomType}
+      folderType={type}
+      isFolder={!isRoom}
+      folderId={folderId}
+      parentRoomType={parentRoomType}
+      isArchiveFolderRoot={isArchiveFolderRoot}
+    />
+  );
 
   return (
     <EmptyContainer

packages/client/src/components/EmptyContainer/sub-components/EmptyViewContainer/EmptyViewContainer.constants.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 const DefaultFolderType = null;

packages/client/src/components/EmptyContainer/sub-components/EmptyViewContainer/EmptyViewContainer.helpers.tsx

@@ -34,6 +34,8 @@ import EmptyFormRoomFillingDarkIcon from "PUBLIC_DIR/images/emptyview/empty.form
 import EmptyFormRoomFillingLightIcon from "PUBLIC_DIR/images/emptyview/empty.form.room.filling.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";
@@ -48,6 +50,10 @@ 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";
@@ -59,9 +65,22 @@ import type {
   OptionActions,
   UploadType,
 } 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);
+};
+
 export const getDescription = (
   type: RoomsType,
   t: TTranslation,
@@ -73,10 +92,7 @@ export const getDescription = (
 ): string => {
   const isCollaborator = access === ShareAccessRights.Collaborator;
 
-  const isNotAdmin =
-    access !== ShareAccessRights.None &&
-    access !== ShareAccessRights.RoomManager &&
-    !isCollaborator;
+  const isNotAdmin = isUser(access);
 
   if (isFolder) {
     return match([parentRoomType, folderType, access])
@@ -103,11 +119,17 @@ export const getDescription = (
         ],
         () => t("EmptyView:FormFolderDefaultUserDescription"),
       )
-      .with([FolderType.FormRoom, null, P._], () =>
+      .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(() => "");
   }
 
@@ -130,10 +152,7 @@ export const getTitle = (
 ): string => {
   const isCollaborator = access === ShareAccessRights.Collaborator;
 
-  const isNotAdmin =
-    access !== ShareAccessRights.None &&
-    access !== ShareAccessRights.RoomManager &&
-    !isCollaborator;
+  const isNotAdmin = isUser(access);
 
   if (isFolder) {
     return match([parentRoomType, folderType, access])
@@ -152,14 +171,15 @@ export const getTitle = (
       .with(
         [
           FolderType.FormRoom,
-          null,
+          DefaultFolderType,
           P.when(() => isNotAdmin || isArchiveFolderRoot),
         ],
         () => t("EmptyView:FormFolderDefaultUserTitle"),
       )
-      .with([FolderType.FormRoom, null, P._], () =>
+      .with([FolderType.FormRoom, DefaultFolderType, P._], () =>
         t("EmptyView:FormFolderDefaultTitle"),
       )
+      .with([P._, DefaultFolderType, P._], () => t("Files:EmptyScreenFolder"))
       .otherwise(() => "");
   }
 
@@ -191,6 +211,12 @@ export const getFolderIcon = (
     .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 />);
 };
 
@@ -360,10 +386,7 @@ export const getOptions = (
   const isFormFiller = access === ShareAccessRights.FormFilling;
   const isCollaborator = access === ShareAccessRights.Collaborator;
 
-  const isNotAdmin =
-    access !== ShareAccessRights.None &&
-    access !== ShareAccessRights.RoomManager &&
-    !isCollaborator;
+  const isNotAdmin = isUser(access);
 
   const {
     createInviteOption,
@@ -423,6 +446,31 @@ export const getOptions = (
     disabled: false,
   };
 
+  const createDoc = {
+    title: t("EmptyView:CreateDocument"),
+    description: t("EmptyView:CreateDocumentDescription"),
+    icon: <CreateNewFormIcon />,
+    key: "create-doc-option",
+    onClick: () => actions.onCreate("docx"),
+    disabled: false,
+  };
+  const createSpreadsheet = {
+    title: t("EmptyView:CreateSpreadsheet"),
+    description: t("EmptyView:CreateSpreadsheetDescription"),
+    icon: <CreateNewSpreadsheetIcon />,
+    key: "create-spreadsheet-option",
+    onClick: () => actions.onCreate("xlsx"),
+    disabled: false,
+  };
+  const createPresentation = {
+    title: t("EmptyView:CreatePresentation"),
+    description: t("EmptyView:CreatePresentationDescription"),
+    icon: <CreateNewPresentation />,
+    key: "create-presentation-option",
+    onClick: () => actions.onCreate("pptx"),
+    disabled: false,
+  };
+
   const createFile: EmptyViewItemType = {
     title: t("EmptyView:CreateNewFileTitle"),
     description: t("EmptyView:CreateNewFileDescription"),
@@ -481,11 +529,15 @@ export const getOptions = (
         ],
         () => [],
       )
-      .with([FolderType.FormRoom, null, P.when(() => isNotAdmin)], () => [])
-      .with([FolderType.FormRoom, null, P._], () => [
+      .with([FolderType.FormRoom, DefaultFolderType, P.when(isAdmin)], () => [
         uploadPDFFromDocSpace,
         uploadFromDevicePDF,
       ])
+      .with([P._, DefaultFolderType, P.when(isAdmin)], () => [
+        createDoc,
+        createSpreadsheet,
+        createPresentation,
+      ])
       .otherwise(() => []);
   }
 

packages/shared/enums/index.ts

@@ -247,7 +247,7 @@ export const enum FolderType {
   ReadOnlyRoom = 18,
   CustomRoom = 19,
   Archive = 20,
-
+  PublicRoom = 22,
   Done = 25,
   InProgress = 26,
   SubFolderDone = 27,