From 4fc417ee0dc84e7098b414b98bd163993f286531 Mon Sep 17 00:00:00 2001
From: heiheihei <1395202740@qq.com>
Date: Tue, 26 Aug 2025 18:57:02 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E5=88=87=E6=8D=A2=E9=A1=B9?=
 =?UTF-8?q?=E7=9B=AE=EF=BC=8C=E6=90=9C=E7=B4=A2=E6=A1=86=E6=B2=A1=E6=9C=89?=
 =?UTF-8?q?=E6=B8=85=E7=A9=BA=E7=9A=84=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../app/src/features/Search/SearchModal.tsx   | 78 +++++++++++--------
 1 file changed, 44 insertions(+), 34 deletions(-)

diff --git a/plugins/mindstudio-insight-plugins/ModelVis/app/src/features/Search/SearchModal.tsx b/plugins/mindstudio-insight-plugins/ModelVis/app/src/features/Search/SearchModal.tsx
index d467c79789..47355cc565 100644
--- a/plugins/mindstudio-insight-plugins/ModelVis/app/src/features/Search/SearchModal.tsx
+++ b/plugins/mindstudio-insight-plugins/ModelVis/app/src/features/Search/SearchModal.tsx
@@ -30,7 +30,12 @@ import {
   useEffect,
   useState
 } from "react"
-import { searchResultAtom, searchVisibleAtom, zoomAtom } from "stores"
+import {
+  modelPathAtom,
+  searchResultAtom,
+  searchVisibleAtom,
+  zoomAtom,
+} from "stores"
 import { workerHighlight, workerSearch } from "worker-apis"
 
 type NodeProps = {
@@ -51,10 +56,10 @@ const NodeCandidate = ({ node, startAnimation }: NodeProps) => {
   }
 
   return <div
-      className="flex cursor-pointer items-center rounded-md bg-white px-5 py-1.5 dark:bg-dark-secondary"
-      onClick={scrollToOp}
+    className="flex cursor-pointer items-center rounded-md bg-white px-5 py-1.5 dark:bg-dark-secondary"
+    onClick={scrollToOp}
   >
-    <OpIcon className="mr-5 h-5 w-5 text-gray-500 dark:text-white"/>
+    <OpIcon className="mr-5 h-5 w-5 text-gray-500 dark:text-white" />
     <div className="flex flex-col text-orange-300">
       <span>{id}</span>
       <span>{opType}</span>
@@ -64,6 +69,7 @@ const NodeCandidate = ({ node, startAnimation }: NodeProps) => {
 
 export const SearchModal = () => {
   const [query, setQuery] = useState("")
+  const path = useAtomValue(modelPathAtom)
   const deferredQuery = useDeferredValue(query)
 
   const nodes = useAtomValue(searchResultAtom)
@@ -78,53 +84,57 @@ export const SearchModal = () => {
   const startAnimation = useAnimatedTranslate()
 
   const handleChange = (ev: ChangeEvent<HTMLInputElement>) =>
-      setQuery(ev.target.value.toLowerCase())
+    setQuery(ev.target.value.toLowerCase())
 
   useEffect(() => {
     if (!deferredQuery) return
     workerSearch(deferredQuery)
   }, [deferredQuery])
 
+  useEffect(() => {
+    setQuery("")
+  }, [path])
+
   if (!visible) return <></>
 
   return <div
-      ref={ref}
-      className={joinCls(
-          "-translate-x-1/2 fixed top-28 left-1/2 z-50 flex h-[55%]",
-          "w-full max-w-2xl flex-col rounded-lg py-8 pr-3",
-          "bg-[#fcfcfc] pl-12 shadow-lg dark:bg-dark-secondary"
-      )}
+    ref={ref}
+    className={joinCls(
+      "-translate-x-1/2 fixed top-28 left-1/2 z-50 flex h-[55%]",
+      "w-full max-w-2xl flex-col rounded-lg py-8 pr-3",
+      "bg-[#fcfcfc] pl-12 shadow-lg dark:bg-dark-secondary"
+    )}
   >
     <div className="relative mb-8">
       <input
-          type="text"
-          value={query}
-          onChange={handleChange}
-          autoFocus
-          placeholder={t("searchNodeEdge")}
-          className={joinCls(
-              "h-12 w-full pr-3 pl-9 text-sm lg:h-14 lg:pl-12 lg:text-base",
-              "rounded-lg bg-white outline-none ring-1 ring-inset",
-              "ring-violet-300 transition-color duration-150 dark:ring-violet-50",
-              "focus:bg-white focus:text-gray-600 dark:bg-dark-medium",
-              "dark:focus:bg-dark-primary dark:focus:text-white"
-          )}
-          spellCheck={false}
+        type="text"
+        value={query}
+        onChange={handleChange}
+        autoFocus
+        placeholder={t("searchNodeEdge")}
+        className={joinCls(
+          "h-12 w-full pr-3 pl-9 text-sm lg:h-14 lg:pl-12 lg:text-base",
+          "rounded-lg bg-white outline-none ring-1 ring-inset",
+          "ring-violet-300 transition-color duration-150 dark:ring-violet-50",
+          "focus:bg-white focus:text-gray-600 dark:bg-dark-medium",
+          "dark:focus:bg-dark-primary dark:focus:text-white"
+        )}
+        spellCheck={false}
       />
       <SearchIcon
-          className={joinCls(
-              "-translate-y-1/2 absolute top-1/2 left-3 h-4.5 w-4.5",
-              "stroke-current opacity-50 lg:left-4.5 lg:h-5 lg:w-5"
-          )}/>
+        className={joinCls(
+          "-translate-y-1/2 absolute top-1/2 left-3 h-4.5 w-4.5",
+          "stroke-current opacity-50 lg:left-4.5 lg:h-5 lg:w-5"
+        )} />
     </div>
     <div className="scrollbar flex-1 overflow-y-auto">
       {deferredQuery && (
-          <div className="flex flex-col gap-y-1.5">
-            {nodes?.map(node => (
-                <NodeCandidate key={node.id} node={node}
-                               startAnimation={startAnimation}/>
-            ))}
-          </div>
+        <div className="flex flex-col gap-y-1.5">
+          {nodes?.map(node => (
+            <NodeCandidate key={node.id} node={node}
+              startAnimation={startAnimation} />
+          ))}
+        </div>
       )}
     </div>
   </div>
-- 
Gitee