fix: adjust search_fields and fields for graphs

gisce/webclient#1535
gisce · Dec 24, 2024 · e201659 · e201659
1 parent b4cb905
commit e201659
Show file tree

Hide file tree

Showing 4 changed files with 72 additions and 59 deletions.
diff --git a/src/actionbar/GraphActionBar.tsx b/src/actionbar/GraphActionBar.tsx
@@ -11,13 +11,7 @@ import ButtonWithBadge from "./ButtonWithBadge";
 import { ReloadOutlined, FilterOutlined } from "@ant-design/icons";
 import { View } from "@/types";
 
-function GraphActionBar({
-  refreshGraph,
-  mustShowSearchFilter,
-}: {
-  refreshGraph: () => void;
-  mustShowSearchFilter: boolean;
-}) {
+function GraphActionBar({ refreshGraph }: { refreshGraph: () => void }) {
   const { t } = useLocale();
   const {
     availableViews,
@@ -33,22 +27,20 @@ function GraphActionBar({
 
   return (
     <Space wrap={true}>
-      {mustShowSearchFilter && (
-        <ButtonWithBadge
-          icon={
-            <FilterOutlined
-              style={{ color: searchVisible ? "white" : undefined }}
-            />
-          }
-          tooltip={t("advanced_search")}
-          type={searchVisible ? "primary" : "default"}
-          onClick={() => {
-            setSearchVisible?.(!searchVisible);
-          }}
-          disabled={graphIsLoading}
-          badgeNumber={searchParams?.length}
-        />
-      )}
+      <ButtonWithBadge
+        icon={
+          <FilterOutlined
+            style={{ color: searchVisible ? "white" : undefined }}
+          />
+        }
+        tooltip={t("advanced_search")}
+        type={searchVisible ? "primary" : "default"}
+        onClick={() => {
+          setSearchVisible?.(!searchVisible);
+        }}
+        disabled={graphIsLoading}
+        badgeNumber={searchParams?.length}
+      />
       <ActionButton
         icon={<ReloadOutlined />}
         tooltip={t("refresh")}

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
@@ -454,6 +454,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
@@ -6,7 +6,7 @@ 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";
@@ -21,11 +21,20 @@ export type GraphActionViewProps = {
   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(
@@ -91,13 +100,19 @@ export const GraphActionView = (props: GraphActionViewProps) => {
     });
 
   const searchFields = useMemo(
-    () => mergeSearchFields([formView?.search_fields, treeView?.search_fields]),
-    [formView?.search_fields, treeView?.search_fields],
+    () =>
+      mergeSearchFields([
+        formView?.search_fields,
+        treeView?.search_fields,
+        graphView?.search_fields,
+      ]),
+    [
+      formView?.search_fields,
+      treeView?.search_fields,
+      graphView?.search_fields,
+    ],
   );
 
-  const mustShowSearchFilter =
-    searchFields.primary.length > 0 || searchFields.secondary.length > 0;
-
   if (!visible) {
     return null;
   }
@@ -113,36 +128,35 @@ export const GraphActionView = (props: GraphActionViewProps) => {
           refreshGraph={() => {
             (graphRef.current as any).refresh();
           }}
-          mustShowSearchFilter={mustShowSearchFilter}
         />
       </TitleHeader>
-      {mustShowSearchFilter && (
-        <SearchFilter
-          fields={{ ...treeView?.fields, ...formView?.fields }}
-          searchFields={mergeSearchFields([
-            formView?.search_fields,
-            treeView?.search_fields,
-          ])}
-          limit={limit!}
-          onClear={clear}
-          offset={offset}
-          isSearching={searchFilterLoading}
-          onSubmit={(opts: {
-            params: any;
-            limit: number;
-            offset: number;
-            searchValues: any;
-          }) => {
-            setApplyLimit(false);
-            setSearchParams?.(opts.params);
-            setSearchVisible?.(false);
-          }}
-          searchError={searchError}
-          searchVisible={searchVisible}
-          searchValues={searchValues}
-          showLimitOptions={false}
-        />
-      )}
+
+      <SearchFilter
+        fields={{
+          ...treeView?.fields,
+          ...formView?.fields,
+          ...graphView?.fields,
+        }}
+        searchFields={searchFields}
+        limit={limit!}
+        onClear={clear}
+        offset={offset}
+        isSearching={searchFilterLoading}
+        onSubmit={(opts: {
+          params: any;
+          limit: number;
+          offset: number;
+          searchValues: any;
+        }) => {
+          setApplyLimit(false);
+          setSearchParams?.(opts.params);
+          setSearchVisible?.(false);
+        }}
+        searchError={searchError}
+        searchVisible={searchVisible}
+        searchValues={searchValues}
+        showLimitOptions={false}
+      />
       {tableRefreshing ? (
         <Spin />
       ) : (