diff --git a/app/client/src/PluginActionEditor/components/PluginActionForm/PluginActionForm.tsx b/app/client/src/PluginActionEditor/components/PluginActionForm/PluginActionForm.tsx index 17db33e698..4b3a2dd3a0 100644 --- a/app/client/src/PluginActionEditor/components/PluginActionForm/PluginActionForm.tsx +++ b/app/client/src/PluginActionEditor/components/PluginActionForm/PluginActionForm.tsx @@ -1,6 +1,9 @@ import React from "react"; +import { useChangeActionCall } from "./hooks/useChangeActionCall"; const PluginActionForm = () => { + useChangeActionCall(); + return
; }; diff --git a/app/client/src/PluginActionEditor/components/PluginActionForm/hooks/useChangeActionCall.test.tsx b/app/client/src/PluginActionEditor/components/PluginActionForm/hooks/useChangeActionCall.test.tsx new file mode 100644 index 0000000000..c7af1a52bb --- /dev/null +++ b/app/client/src/PluginActionEditor/components/PluginActionForm/hooks/useChangeActionCall.test.tsx @@ -0,0 +1,108 @@ +import { renderHook } from "@testing-library/react-hooks/dom"; +import { useDispatch } from "react-redux"; +import { PluginType } from "entities/Action"; +import { usePluginActionContext } from "PluginActionEditor"; +import { changeApi } from "actions/apiPaneActions"; +import { changeQuery } from "actions/queryPaneActions"; +import { useChangeActionCall } from "./useChangeActionCall"; + +jest.mock("react-redux", () => ({ + useDispatch: jest.fn(), +})); + +jest.mock("actions/apiPaneActions", () => ({ + changeApi: jest.fn(), +})); + +jest.mock("actions/queryPaneActions", () => ({ + changeQuery: jest.fn(), +})); + +jest.mock("PluginActionEditor", () => ({ + usePluginActionContext: jest.fn(), +})); + +describe("useChangeActionCall hook", () => { + const dispatchMock = jest.fn(); + + beforeEach(() => { + (useDispatch as jest.Mock).mockReturnValue(dispatchMock); + }); + + afterEach(() => { + jest.clearAllMocks(); + }); + + it("should dispatch changeApi when plugin type is API", () => { + const actionMock = { id: "actionId" }; + const pluginMock = { id: "pluginId", type: PluginType.API }; + + // Mock the return values of usePluginActionContext + (usePluginActionContext as jest.Mock).mockReturnValue({ + action: actionMock, + plugin: pluginMock, + }); + + // Render the hook + renderHook(() => useChangeActionCall()); + + // Expect changeApi to be called with the correct parameters + expect(changeApi).toHaveBeenCalledWith(actionMock.id, false); + expect(dispatchMock).toHaveBeenCalledWith(changeApi(actionMock.id, false)); + }); + + it("should dispatch changeQuery when plugin type is not API", () => { + const actionMock = { + id: "actionId", + pageId: "pageId", + applicationId: "applicationId", + packageId: "packageId", + moduleId: "moduleId", + workflowId: "workflowId", + }; + const pluginMock = { id: "pluginId", type: "OTHER_PLUGIN_TYPE" }; + + // Mock the return values of usePluginActionContext + (usePluginActionContext as jest.Mock).mockReturnValue({ + action: actionMock, + plugin: pluginMock, + }); + + // Render the hook + renderHook(() => useChangeActionCall()); + + // Expect changeQuery to be called with the correct parameters + expect(changeQuery).toHaveBeenCalledWith({ + baseQueryId: actionMock.id, + basePageId: actionMock.pageId, + applicationId: actionMock.applicationId, + packageId: actionMock.packageId, + moduleId: actionMock.moduleId, + workflowId: actionMock.workflowId, + }); + expect(dispatchMock).toHaveBeenCalledWith( + changeQuery({ + baseQueryId: actionMock.id, + basePageId: actionMock.pageId, + applicationId: actionMock.applicationId, + packageId: actionMock.packageId, + moduleId: actionMock.moduleId, + workflowId: actionMock.workflowId, + }), + ); + }); + + it("should not dispatch any action if plugin id or action is not available", () => { + // Mock the return values of usePluginActionContext without plugin or action + (usePluginActionContext as jest.Mock).mockReturnValue({ + action: null, + plugin: { id: null, type: PluginType.API }, + }); + + // Render the hook + renderHook(() => useChangeActionCall()); + + // Expect no action to be dispatched + expect(dispatchMock).not.toHaveBeenCalled(); + }); +}); diff --git a/app/client/src/PluginActionEditor/components/PluginActionForm/hooks/useChangeActionCall.ts b/app/client/src/PluginActionEditor/components/PluginActionForm/hooks/useChangeActionCall.ts new file mode 100644 index 0000000000..562bbad867 --- /dev/null +++ b/app/client/src/PluginActionEditor/components/PluginActionForm/hooks/useChangeActionCall.ts @@ -0,0 +1,33 @@ +import { useEffect } from "react"; +import { useDispatch } from "react-redux"; +import { changeApi } from "actions/apiPaneActions"; +import { changeQuery } from "actions/queryPaneActions"; +import { PluginType } from "entities/Action"; +import { usePluginActionContext } from "PluginActionEditor"; + +export const useChangeActionCall = () => { + const { action, plugin } = usePluginActionContext(); + const dispatch = useDispatch(); + + useEffect(() => { + if (!plugin?.id || !action) return; + + switch (plugin?.type) { + case PluginType.API: + dispatch(changeApi(action?.id, false)); + break; + default: + dispatch( + changeQuery({ + baseQueryId: action?.id, + basePageId: action.pageId, + applicationId: action.applicationId, + packageId: action.packageId, + moduleId: action.moduleId, + workflowId: action.workflowId, + }), + ); + break; + } + }, [action, plugin, dispatch]); +}; diff --git a/app/client/src/entities/Action/index.ts b/app/client/src/entities/Action/index.ts index 402420e171..2278643cd8 100644 --- a/app/client/src/entities/Action/index.ts +++ b/app/client/src/entities/Action/index.ts @@ -188,6 +188,7 @@ export interface BaseAction { userPermissions?: string[]; errorReports?: Array; isPublic?: boolean; + packageId?: string; moduleId?: string; moduleInstanceId?: string; workflowId?: string;