add tests

qdraw · Feb 22, 2024 · bff1e39 · bff1e39
1 parent db1872b
commit bff1e39
Show file tree

Hide file tree

Showing 6 changed files with 129 additions and 6 deletions.
diff --git a/...on-no-select-warning/menu-option-desktop-editor-open-selection-no-select-warning.spec.tsx b/...on-no-select-warning/menu-option-desktop-editor-open-selection-no-select-warning.spec.tsx
@@ -0,0 +1,44 @@
+import { fireEvent, render, screen } from "@testing-library/react";
+import MenuOptionDesktopEditorOpenSelectionNoSelectWarning from "./menu-option-desktop-editor-open-selection-no-select-warning";
+
+describe("MenuOptionDesktopEditorOpenSelectionNoSelectWarning", () => {
+  it("should render without crashing", () => {
+    render(<MenuOptionDesktopEditorOpenSelectionNoSelectWarning select={[]} isReadOnly={false} />);
+  });
+
+  it("should show error notification when trying to open editor without selecting anything", () => {
+    render(<MenuOptionDesktopEditorOpenSelectionNoSelectWarning select={[]} isReadOnly={false} />);
+    fireEvent.keyDown(window, { key: "e", ctrlKey: true });
+    expect(screen.getByText("select first")).toBeTruthy();
+  });
+
+  it("should not show error notification when select is not empty", () => {
+    render(
+      <MenuOptionDesktopEditorOpenSelectionNoSelectWarning select={["item"]} isReadOnly={false} />
+    );
+    fireEvent.keyDown(window, { key: "e", ctrlKey: true });
+    expect(screen.queryByText("select first")).toBeNull();
+  });
+
+  it("should not show error notification when read-only mode is enabled", () => {
+    render(<MenuOptionDesktopEditorOpenSelectionNoSelectWarning select={[]} isReadOnly={true} />);
+    fireEvent.keyDown(window, { key: "e", ctrlKey: true });
+    expect(screen.queryByText("select first")).toBeNull();
+  });
+
+  it("should not show error notification when editor feature is disabled", () => {
+    jest.spyOn(window, "fetch").mockImplementation(() => ({
+      json: async () => ({ openEditorEnabled: false })
+    }));
+    render(<MenuOptionDesktopEditorOpenSelectionNoSelectWarning select={[]} isReadOnly={false} />);
+    fireEvent.keyDown(window, { key: "e", ctrlKey: true });
+    expect(screen.queryByText("select first")).toBeNull();
+  });
+
+  it("should clear error notification on callback", () => {
+    render(<MenuOptionDesktopEditorOpenSelectionNoSelectWarning select={[]} isReadOnly={false} />);
+    fireEvent.keyDown(window, { key: "e", ctrlKey: true });
+    fireEvent.click(screen.getByText("Close")); // Assuming 'Close' is the text inside the notification's close button
+    expect(screen.queryByText("select first")).not.toBeInTheDocument();
+  });
+});
diff --git a/...no-select-warning/menu-option-desktop-editor-open-selection-no-select-warning.stories.tsx b/...no-select-warning/menu-option-desktop-editor-open-selection-no-select-warning.stories.tsx
@@ -0,0 +1,9 @@
+import MenuOptionDesktopEditorOpenSelectionNoSelectWarning from "./menu-option-desktop-editor-open-selection-no-select-warning";
+
+export default {
+  title: "components/molecules/menu-option-desktop-editor-open-selection-no-select-warning"
+};
+
+export const Default = () => {
+  return <MenuOptionDesktopEditorOpenSelectionNoSelectWarning select={[]} isReadOnly={false} />;
+};
diff --git a/...lection-no-select-warning/menu-option-desktop-editor-open-selection-no-select-warning.tsx b/...lection-no-select-warning/menu-option-desktop-editor-open-selection-no-select-warning.tsx
@@ -1,28 +1,41 @@
-import { memo } from "react";
+import { memo, useState } from "react";
 import useFetch from "../../../hooks/use-fetch";
 import useHotKeys from "../../../hooks/use-keyboard/use-hotkeys";
 import { IEnvFeatures } from "../../../interfaces/IEnvFeatures";
 import { UrlQuery } from "../../../shared/url-query";
+import Notification, { NotificationType } from "../../atoms/notification/notification";
 
 interface IMenuOptionDesktopEditorOpenSelectionNoSelectWarningProps {
   select: string[];
-  isReadonly: boolean;
+  isReadOnly: boolean;
 }
 
 const MenuOptionDesktopEditorOpenSelectionNoSelectWarning: React.FunctionComponent<IMenuOptionDesktopEditorOpenSelectionNoSelectWarningProps> =
-  memo(({ select, isReadonly }) => {
+  memo(({ select, isReadOnly }) => {
     // Check API to know if feature is needed!
     const featuresResult = useFetch(new UrlQuery().UrlApiFeaturesAppSettings(), "get");
     const dataFeatures = featuresResult?.data as IEnvFeatures | undefined;
 
+    // for showing a notification
+    const [isError, setIsError] = useState("");
+
     /**
      * Open editor with keys -  command + e
      */
     useHotKeys({ key: "e", ctrlKeyOrMetaKey: true }, () => {
-      if (dataFeatures?.openEditorEnabled !== true || isReadonly || select.length >= 1) return;
+      if (dataFeatures?.openEditorEnabled !== true || isReadOnly || select.length >= 1) return;
+      setIsError("select first");
     });
 
-    return <></>;
+    return (
+      <>
+        {isError !== "" ? (
+          <Notification callback={() => setIsError("")} type={NotificationType.default}>
+            {isError}
+          </Notification>
+        ) : null}
+      </>
+    );
   });
 
 export default MenuOptionDesktopEditorOpenSelectionNoSelectWarning;
diff --git a/...u-option-desktop-editor-open-selection/menu-option-desktop-editor-open-selection.spec.tsx b/...u-option-desktop-editor-open-selection/menu-option-desktop-editor-open-selection.spec.tsx
@@ -1,5 +1,6 @@
 import { fireEvent, render, screen, waitFor } from "@testing-library/react";
 import * as useFetch from "../../../hooks/use-fetch";
+import * as useHotKeys from "../../../hooks/use-keyboard/use-hotkeys";
 import * as useLocation from "../../../hooks/use-location/use-location";
 import { IArchiveProps } from "../../../interfaces/IArchiveProps";
 import { IConnectionDefault } from "../../../interfaces/IConnectionDefault";
@@ -58,18 +59,61 @@ describe("ModalDesktopEditorOpenConfirmation", () => {
       );
     });
 
+    it("-- calls StartMenuOptionDesktopEditorOpenSelection on hotkey trigger", async () => {
+      const mockGetIConnectionDefaultFeatureToggle = {
+        statusCode: 200,
+        data: {
+          openEditorEnabled: false
+        } as IEnvFeatures
+      } as IConnectionDefault;
+
+      const useHotkeysSpy = jest.spyOn(useHotKeys, "default").mockImplementationOnce(() => {
+        return { key: "e", ctrlKey: true };
+      });
+
+      const useFetchSpy = jest
+        .spyOn(useFetch, "default")
+        .mockImplementationOnce(() => mockGetIConnectionDefaultFeatureToggle);
+
+      const component = render(
+        <MenuOptionDesktopEditorOpenSelection
+          isReadOnly={false}
+          select={["file1.jpg", "file2.jpg"]}
+          state={state}
+          setEnableMoreMenu={() => {}}
+        />
+      );
+
+      expect(useFetchSpy).toHaveBeenCalled();
+      expect(useHotkeysSpy).toHaveBeenCalled();
+
+      component.unmount();
+    });
+
     it("calls StartMenuOptionDesktopEditorOpenSelection on hotkey trigger", async () => {
       const mockIConnectionDefaultResolve: Promise<IConnectionDefault> = Promise.resolve({
         data: true,
         statusCode: 200
       } as IConnectionDefault);
 
+      const mockGetIConnectionDefaultFeatureToggle = {
+        statusCode: 200,
+        data: {
+          openEditorEnabled: true
+        } as IEnvFeatures
+      } as IConnectionDefault;
+
       const fetchPostSpy = jest
         .spyOn(FetchPost, "default")
         .mockReset()
         .mockImplementationOnce(() => mockIConnectionDefaultResolve)
         .mockImplementationOnce(() => mockIConnectionDefaultResolve);
 
+      const useFetchSpy = jest
+        .spyOn(useFetch, "default")
+        .mockImplementationOnce(() => mockGetIConnectionDefaultFeatureToggle)
+        .mockImplementationOnce(() => mockGetIConnectionDefaultFeatureToggle);
+
       const component = render(
         <MenuOptionDesktopEditorOpenSelection
           isReadOnly={false}
@@ -81,6 +125,7 @@ describe("ModalDesktopEditorOpenConfirmation", () => {
       fireEvent.keyDown(document.body, { key: "e", ctrlKey: true });
 
       await waitFor(() => {
+        expect(useFetchSpy).toHaveBeenCalled();
         expect(fetchPostSpy).toHaveBeenCalled();
         expect(fetchPostSpy).toHaveBeenCalledTimes(2);
         expect(fetchPostSpy).toHaveBeenNthCalledWith(

diff --git a/...s/menu-option-desktop-editor-open-selection/menu-option-desktop-editor-open-selection.tsx b/...s/menu-option-desktop-editor-open-selection/menu-option-desktop-editor-open-selection.tsx
@@ -100,14 +100,17 @@ const MenuOptionDesktopEditorOpenSelection: React.FunctionComponent<IMenuOptionD
      * Open editor with keys -  command + e
      */
     useHotKeys({ key: "e", ctrlKeyOrMetaKey: true }, () => {
+      const isReadOnlyOrDisabled = !dataFeatures?.openEditorEnabled || isReadOnly;
+      console.log(`is ReadOnly/ or disabled: ${isReadOnlyOrDisabled}`);
+
       StartMenuOptionDesktopEditorOpenSelection(
         select,
         isCollections,
         state,
         setIsError,
         MessageDesktopEditorUnableToOpen,
         setModalConfirmationOpenFiles,
-        dataFeatures?.openEditorEnabled !== true ? true : isReadOnly
+        isReadOnlyOrDisabled
       ).then(() => {
         // do nothing
       });

diff --git a/starsky/starsky/clientapp/src/components/organisms/menu-archive/menu-archive.tsx b/starsky/starsky/clientapp/src/components/organisms/menu-archive/menu-archive.tsx
@@ -14,6 +14,7 @@ import HamburgerMenuToggle from "../../atoms/hamburger-menu-toggle/hamburger-men
 import MenuOptionModal from "../../atoms/menu-option-modal/menu-option-modal";
 import MoreMenu from "../../atoms/more-menu/more-menu";
 import MenuSearchBar from "../../molecules/menu-inline-search/menu-inline-search";
+import MenuOptionDesktopEditorOpenSelectionNoSelectWarning from "../../molecules/menu-option-desktop-editor-open-selection-no-select-warning/menu-option-desktop-editor-open-selection-no-select-warning";
 import MenuOptionDesktopEditorOpenSelection from "../../molecules/menu-option-desktop-editor-open-selection/menu-option-desktop-editor-open-selection";
 import MenuOptionMoveFolderToTrash from "../../molecules/menu-option-move-folder-to-trash/menu-option-move-folder-to-trash";
 import MenuOptionMoveToTrash from "../../molecules/menu-option-move-to-trash/menu-option-move-to-trash";
@@ -263,6 +264,11 @@ const MenuArchive: React.FunctionComponent<IMenuArchiveProps> = memo(() => {
               {/* onClick={() => allSelection()} */}
               <MenuOptionSelectionAll select={select} state={state} allSelection={allSelection} />
 
+              <MenuOptionDesktopEditorOpenSelectionNoSelectWarning
+                isReadOnly={readOnly}
+                select={select}
+              />
+
               {select.length >= 1 ? (
                 <>
                   <MenuOptionModal
@@ -295,13 +301,15 @@ const MenuArchive: React.FunctionComponent<IMenuArchiveProps> = memo(() => {
                   />
                 </>
               ) : null}
+
               <MenuOptionModal
                 isReadOnly={false}
                 isSet={isDisplayOptionsOpen}
                 set={() => setIsDisplayOptionsOpen(!isDisplayOptionsOpen)}
                 localization={localization.MessageDisplayOptions}
                 testName="display-options"
               />
+
               <MenuOptionModal
                 setEnableMoreMenu={setEnableMoreMenu}
                 isReadOnly={false}
@@ -310,6 +318,7 @@ const MenuArchive: React.FunctionComponent<IMenuArchiveProps> = memo(() => {
                 set={setIsSynchronizeManuallyOpen}
                 localization={localization.MessageSynchronizeManually}
               />
+
               {state ? (
                 <UploadMenuItem
                   readOnly={readOnly}