fix: sync changes from v2 to v2-develop (#799) [skip ci]

Co-authored-by: mguellsegarra <5711443+mguellsegarra@users.noreply.github.com>
gisce · Dec 30, 2024 · 6d1865a · 6d1865a
1 parent e90b414
commit 6d1865a
Show file tree

Hide file tree

Showing 8 changed files with 98 additions and 33 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@gisce/react-ooui",
-  "version": "2.52.0",
+  "version": "2.52.1",
   "engines": {
     "node": "20.5.0"
   },

diff --git a/src/types/index.ts b/src/types/index.ts
@@ -67,6 +67,8 @@ export type GraphView = {
   view_id: number;
   name: string;
   title?: string;
+  fields: any;
+  search_fields?: SearchFields;
 };
 
 export type View = TreeView | FormView | DashboardView | GraphView;

diff --git a/src/views/ActionView.tsx b/src/views/ActionView.tsx
@@ -5,6 +5,7 @@ import {
   forwardRef,
   useImperativeHandle,
   useContext,
+  useCallback,
 } from "react";
 
 import { Spin } from "antd";
@@ -35,6 +36,7 @@ import { FormActionView } from "./actionViews/FormActionView";
 import { TreeActionView } from "./actionViews/TreeActionView";
 import { DashboardActionView } from "./actionViews/DashboardActionView";
 import { resolveViewInfoPromises } from "@/helpers/viewHelper";
+import { useDeepCompareEffect } from "use-deep-compare";
 
 type Props = {
   domain: any;
@@ -126,17 +128,20 @@ function ActionView(props: Props, ref: any) {
     setCurrentIdTabContext?.(id);
   }
 
-  function setCurrentView(view?: View) {
-    setCurrentViewInternal(view);
-    const extra = { action_id, action_type };
-    setCurrentViewTabContext?.({ ...view, extra } as any);
-  }
+  const setCurrentView = useCallback(
+    (view?: View) => {
+      setCurrentViewInternal(view);
+      const extra = { action_id, action_type };
+      setCurrentViewTabContext?.({ ...view, extra } as any);
+    },
+    [action_id, action_type, setCurrentViewTabContext],
+  );
 
   useImperativeHandle(ref, () => ({
     canWeClose,
   }));
 
-  const fetchData = async () => {
+  const fetchData = useCallback(async () => {
     setIsLoading(true);
 
     const viewDataRetrieved: View[] = [];
@@ -262,11 +267,23 @@ function ActionView(props: Props, ref: any) {
     setCurrentView(currentViewToAssign);
     setAvailableViews(viewDataRetrieved);
     setIsLoading(false);
-  };
+  }, [
+    initialView,
+    setCurrentView,
+    views,
+    model,
+    context,
+    action_id,
+    action_type,
+    title,
+    treeExpandable,
+    onRemoveTab,
+    tabKey,
+  ]);
 
   setCanWeClose({ tabKey, canWeClose });
 
-  useEffect(() => {
+  useDeepCompareEffect(() => {
     const treeView = availableViews.find((v) => v.type === "tree") as TreeView;
     const initialViewWithData: View = availableViews.find((v) => {
       if (!initialView.id) {
@@ -286,7 +303,7 @@ function ActionView(props: Props, ref: any) {
     fetchData();
   }, [model, views, res_id]);
 
-  useEffect(() => {
+  useDeepCompareEffect(() => {
     if (activeKey === tabKey) {
       setCurrentIdTabContext?.(currentId);
       const extra = { action_id, action_type };
@@ -454,6 +471,11 @@ function ActionView(props: Props, ref: any) {
               formView={
                 availableViews.find((v) => v.type === "form") as FormView
               }
+              graphView={
+                availableViews.find(
+                  (v) => v.view_id === view.view_id,
+                ) as GraphView
+              }
             />
           );
         }

diff --git a/src/views/actionViews/GraphActionView.tsx b/src/views/actionViews/GraphActionView.tsx
@@ -1,31 +1,40 @@
 import GraphActionBar from "@/actionbar/GraphActionBar";
 import TitleHeader from "@/ui/TitleHeader";
 import { Graph } from "@/widgets/views/Graph/Graph";
-import React, { useContext, useEffect, useRef, useState } from "react";
+import React, { useContext, useEffect, useRef, useState, useMemo } from "react";
 import {
   ActionViewContext,
   ActionViewContextType,
 } from "@/context/ActionViewContext";
-import { FormView, TreeView } from "@/types";
+import { FormView, GraphView, TreeView } from "@/types";
 import { mergeSearchFields } from "@/helpers/formHelper";
 import { useSearch } from "@/hooks/useSearch";
 import SearchFilter from "@/widgets/views/searchFilter/SearchFilter";
 import { Spin } from "antd";
 import { mergeParams } from "@/helpers/searchHelper";
 
 export type GraphActionViewProps = {
-  viewData: any;
+  viewData: GraphView;
   visible: boolean;
   model: string;
   context: any;
   domain: any;
   formView: FormView;
   treeView: TreeView;
+  graphView: GraphView;
 };
 
 export const GraphActionView = (props: GraphActionViewProps) => {
-  const { viewData, visible, model, context, domain, formView, treeView } =
-    props;
+  const {
+    viewData,
+    visible,
+    model,
+    context,
+    domain,
+    formView,
+    treeView,
+    graphView,
+  } = props;
   const graphRef = useRef();
 
   const actionViewContext = useContext(
@@ -90,6 +99,20 @@ export const GraphActionView = (props: GraphActionViewProps) => {
       setLimit,
     });
 
+  const searchFields = useMemo(
+    () =>
+      mergeSearchFields([
+        formView?.search_fields,
+        treeView?.search_fields,
+        graphView?.search_fields,
+      ]),
+    [
+      formView?.search_fields,
+      treeView?.search_fields,
+      graphView?.search_fields,
+    ],
+  );
+
   if (!visible) {
     return null;
   }
@@ -107,12 +130,14 @@ export const GraphActionView = (props: GraphActionViewProps) => {
           }}
         />
       </TitleHeader>
+
       <SearchFilter
-        fields={{ ...treeView.fields, ...formView.fields }}
-        searchFields={mergeSearchFields([
-          formView.search_fields,
-          treeView.search_fields,
-        ])}
+        fields={{
+          ...treeView?.fields,
+          ...formView?.fields,
+          ...graphView?.fields,
+        }}
+        searchFields={searchFields}
         limit={limit!}
         onClear={clear}
         offset={offset}
@@ -138,12 +163,15 @@ export const GraphActionView = (props: GraphActionViewProps) => {
         <Graph
           ref={graphRef}
           view_id={viewData.view_id}
+          viewData={viewData}
           model={model}
           context={context}
           domain={mergeParams(searchParams || [], domain)}
           limit={applyLimit ? limit : undefined}
           manualIds={
-            applyLimit ? resultsActionView?.map((r) => r.id) : undefined
+            applyLimit && resultsActionView && resultsActionView.length > 0
+              ? resultsActionView.map((r) => r.id)
+              : undefined
           }
         />
       )}

diff --git a/src/widgets/base/one2many/One2manyInput.tsx b/src/widgets/base/one2many/One2manyInput.tsx
@@ -650,6 +650,7 @@ const One2manyInput: React.FC<One2manyInputProps> = (
       const domain = [[`${ooui.inv_field}`, "=", activeId]];
       return (
         <Graph
+          viewData={views.get("graph")}
           view_id={views.get("graph").view_id}
           model={ooui.relation}
           domain={domain}

diff --git a/src/widgets/base/one2many/One2manyInputInfinite.tsx b/src/widgets/base/one2many/One2manyInputInfinite.tsx
@@ -327,6 +327,7 @@ export const One2manyInput: React.FC<One2manyInputInfiniteProps> = (
       />
       {currentView === "graph" && (
         <Graph
+          viewData={views.get("graph")}
           view_id={views.get("graph").view_id}
           model={relation}
           domain={[[`${ooui.inv_field}`, "=", activeId]]}

diff --git a/src/widgets/views/Graph/Graph.tsx b/src/widgets/views/Graph/Graph.tsx
@@ -32,11 +32,20 @@ export type GraphProps = {
   limit?: number;
   manualIds?: number[];
   fixedHeight?: number;
+  viewData?: GraphView;
 };
 
 const GraphComp = (props: GraphProps, ref: any) => {
-  const { view_id, model, context, domain, limit, manualIds, fixedHeight } =
-    props;
+  const {
+    view_id,
+    model,
+    context,
+    domain,
+    limit,
+    manualIds,
+    fixedHeight,
+    viewData,
+  } = props;
   const [loading, setLoading] = useState(false);
   const [graphOoui, setGraphOoui] = useState<GraphOoui>();
   const actionViewContext = useContext(
@@ -55,21 +64,23 @@ const GraphComp = (props: GraphProps, ref: any) => {
   useEffect(() => {
     fetchData();
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [view_id]);
+  }, [viewData, view_id]);
 
   async function fetchData() {
     setLoading(true);
     setGraphIsLoading?.(true);
 
     try {
-      const viewData = (await getView({
-        model,
-        id: view_id,
-        type: "graph",
-        context,
-      })) as GraphView;
+      const viewDataRetrieved =
+        viewData ||
+        ((await getView({
+          model,
+          id: view_id,
+          type: "graph",
+          context,
+        })) as GraphView);
 
-      const graph = parseGraph(viewData.arch);
+      const graph = parseGraph(viewDataRetrieved.arch);
       setGraphOoui(graph);
       setLoading(false);
       setGraphIsLoading?.(false);