Merge pull request #2456 from Ajay-aot/Bugfix/FWF-4112-edit-page-changes

changes in edit page and process diagram in submission page
AOT-Technologies · Dec 23, 2024 · 7134082 · 7134082
2 parents d2baaab + eaeb859
commit 7134082
Show file tree

Hide file tree

Showing 8 changed files with 25 additions and 36 deletions.
diff --git a/forms-flow-web/src/components/Application/ViewApplication.js b/forms-flow-web/src/components/Application/ViewApplication.js
@@ -11,7 +11,6 @@ import {
   setApplicationDetailLoader,
   setApplicationDetailStatusCode,
 } from "../../actions/applicationActions";
-import ProcessDiagram from "../BPMN/ProcessDiagramHook";
 import History from "./ApplicationHistory";
 import View from "../Form/Item/Submission/Item/View";
 import { getForm, getSubmission } from "@aot-technologies/formio-react";
@@ -33,9 +32,6 @@ const ViewApplication = React.memo(() => {
   const isApplicationDetailLoading = useSelector(
     (state) => state.applications.isApplicationDetailLoading
   );
-  const applicationProcess = useSelector(
-    (state) => state.applications.applicationProcess
-  );
   const tenantKey = useSelector((state) => state.tenants?.tenantId);
   const dispatch = useDispatch();
   const redirectUrl = MULTITENANCY_ENABLED ? `/tenant/${tenantKey}/` : "/";
@@ -121,17 +117,6 @@ const ViewApplication = React.memo(() => {
         >
           <History page="application-detail" applicationId={applicationId} />
         </Tab>
-        <Tab
-          data-testid="submissions-process-diagram-tab"
-          eventKey="process-diagram"
-          title={<Translation>{(t) => t("Process Diagram")}</Translation>}
-        >
-          <ProcessDiagram
-            processKey={applicationProcess.processKey}
-            processInstanceId={applicationDetail.processInstanceId}
-            tenant={applicationDetail.processTenant}
-          />
-        </Tab>
       </Tabs>
     </div>
   );

diff --git a/forms-flow-web/src/components/Draft/Edit.js b/forms-flow-web/src/components/Draft/Edit.js
@@ -306,7 +306,7 @@ const View = React.memo((props) => {
   }}
 />
           {processData?.status === "active" ? (
-            <div className="form-view-wrapper">
+            <div className="form-view-wrapper wizard-tab">
               <Form
                 form={form}
                 submission={submission.submission}

diff --git a/forms-flow-web/src/components/Draft/ViewDraft.js b/forms-flow-web/src/components/Draft/ViewDraft.js
@@ -15,7 +15,6 @@ import { fetchAllBpmProcesses } from "../../apiManager/services/processServices"
 import { getDraftById } from "../../apiManager/services/draftService";
 import { setDraftDetailStatusCode } from "../../actions/draftActions";
 import { setDraftDetail } from "../../actions/draftActions";
-import ProcessDiagram from "../BPMN/ProcessDiagramHook";
 
 const ViewDraft = React.memo(() => {
   const { t } = useTranslation();
@@ -96,16 +95,6 @@ const ViewDraft = React.memo(() => {
         >
           <View page="draft-detail" showPrintButton={false} />
         </Tab>
-        <Tab
-          data-testid="draft-process-diagram-tab"
-          eventKey="process-diagram"
-          title={<Translation>{(t) => t("Process Diagram")}</Translation>}
-        >
-          <ProcessDiagram
-            processKey={draftDetail.processKey}
-            tenant={draftDetail?.processTenant}
-          />
-        </Tab>
       </Tabs>
     </div>
   );

diff --git a/forms-flow-web/src/components/Form/EditForm/FormEdit.js b/forms-flow-web/src/components/Form/EditForm/FormEdit.js
@@ -357,12 +357,29 @@ const EditComponent = () => {
     FORM: "FORM",
     WORKFLOW: "WORKFLOW",
   };
+  useEffect(() => {
+    const queryParams = new URLSearchParams(location.search);
+    const view = queryParams.get("view");
+    if (view === "flow") {
+      setCurrentLayout(FLOW_LAYOUT);
+      sideTabRef.current = true;
+    } else {
+      setCurrentLayout(FORM_LAYOUT);
+    }
+  }, [location.search]);
 
-  // handling form layout and flow layout
   const handleCurrentLayout = (e) => {
     //wehn the current is assigned with element then only the visible class will render
     sideTabRef.current = e;
-    setCurrentLayout(isFormLayout ? FLOW_LAYOUT : FORM_LAYOUT);
+    const newLayout = isFormLayout ? FLOW_LAYOUT : FORM_LAYOUT;
+    setCurrentLayout(newLayout);
+
+    const queryParams = newLayout === FLOW_LAYOUT ? "view=flow" : "";
+    const newUrl = `${redirectUrl}formflow/${formId}/edit${
+      queryParams ? `?${queryParams}` : ""
+    }`;
+
+    dispatch(push(newUrl));
   };
 
   const handleCloseSelectedAction = () => {
@@ -661,7 +678,7 @@ const EditComponent = () => {
       .then((res) => {
         const form = res.data;
         dispatch(setFormSuccessData("form", form));
-        dispatch(push(`${redirectUrl}formflow/${form._id}/edit/`));
+        dispatch(push(`${redirectUrl}formflow/${form._id}/edit`));
       })
       .catch((err) => {
         let error;
@@ -709,8 +726,6 @@ const EditComponent = () => {
       await actionFunction(processListData.id);
       if (isPublished) {
         await fetchProcessDetails(processListData);
-      } else {
-        backToForm();
       }
       setPromptNewVersion(isPublished);
       setIsPublished(!isPublished);

diff --git a/forms-flow-web/src/components/Form/Item/Submission/Item/View.js b/forms-flow-web/src/components/Form/Item/Submission/Item/View.js
@@ -73,7 +73,7 @@ const View = React.memo((props) => {
         text={t("Loading...")}
         className="col-12"
       >
-        <div className="sub-container">
+        <div className="sub-container wizard-tab">
           <Form
             form={form}
             submission={updatedSubmission}

diff --git a/forms-flow-web/src/components/Form/Item/View.js b/forms-flow-web/src/components/Form/Item/View.js
@@ -397,7 +397,7 @@ const View = React.memo((props) => {
         text={<Translation>{(t) => t("Loading...")}</Translation>}
         className="col-12"
       >
-  <div className="ms-4 me-4 wizard-tab">
+  <div className="ms-4 me-4 wizard-tab service-task-details p-3">
     {(isPublic || (formStatus === "active") ) ?  (
       <Form
         form={form}

diff --git a/forms-flow-web/src/components/Form/constants/ClientTable.js b/forms-flow-web/src/components/Form/constants/ClientTable.js
@@ -126,7 +126,7 @@ function ClientTable() {
         spinner
         text={t("Loading...")}
       >
-      <div className="min-height-400">
+      <div>
         <div className="table-responsive" style={{ maxHeight: "75vh", overflowY: "auto" }}>
           <table className="table custom-table table-responsive-sm">
             <thead>

diff --git a/forms-flow-web/src/components/ServiceFlow/list/ServiceTaskListView.js b/forms-flow-web/src/components/ServiceFlow/list/ServiceTaskListView.js
@@ -128,7 +128,7 @@ const ServiceTaskListView = React.memo((props) => {
     if ((tasksCount || taskList.length) && selectedFilter) {
       return (
         <>
-          <div className="list-container ">
+          <div className="list-container service-task-details">
             {taskList?.map((task, index) => {
               const adjustedValues = adjustTaskAttributes(
                 task?._embedded?.variable