feat: 定位需要取消渲染和美化 (#2316)

yaklang · Jan 22, 2025 · 9e79279 · 9e79279
1 parent 9bb89f2
commit 9e79279
Showing 1 changed file with 36 additions and 18 deletions.
diff --git a/app/renderer/src/main/src/components/HTTPFlowDetail.tsx b/app/renderer/src/main/src/components/HTTPFlowDetail.tsx
@@ -1206,25 +1206,40 @@ export const HTTPFlowDetailRequestAndResponse: React.FC<HTTPFlowDetailRequestAnd
     const [codeKey, setCodeKey] = useState<string>("utf-8")
     const [codeLoading, setCodeLoading] = useState<boolean>(false)
     const [codeValue, setCodeValue] = useState<string>("")
-    useEffect(() => {
-        if (flow) {
-            setCodeKey("utf-8")
-            getRemoteValue(RemoteGV.HistoryRequestEditorBeautify).then((res) => {
-                if (!!res) {
-                    setReqTypeOptionVal(res)
-                } else {
+    useDebounceEffect(
+        () => {
+            if (flow) {
+                setCodeKey("utf-8")
+                const reqArr = highLightItem?.IsMatchRequest ? [highLightItem] : []
+                const resArr = highLightItem ? (!highLightItem.IsMatchRequest ? [highLightItem] : []) : []
+                if (reqArr.length) {
                     setReqTypeOptionVal(undefined)
-                }
-            })
-            getRemoteValue(RemoteGV.HistoryResponseEditorBeautify).then((res) => {
-                if (!!res) {
-                    setResTypeOptionVal(res)
                 } else {
+                    getRemoteValue(RemoteGV.HistoryRequestEditorBeautify).then((res) => {
+                        if (!!res) {
+                            setReqTypeOptionVal(res)
+                        } else {
+                            setReqTypeOptionVal(undefined)
+                        }
+                    })
+                }
+
+                if (resArr.length) {
                     setResTypeOptionVal(undefined)
+                } else {
+                    getRemoteValue(RemoteGV.HistoryResponseEditorBeautify).then((res) => {
+                        if (!!res) {
+                            setResTypeOptionVal(res)
+                        } else {
+                            setResTypeOptionVal(undefined)
+                        }
+                    })
                 }
-            })
-        }
-    }, [flow])
+            }
+        },
+        [flow, highLightItem],
+        {wait: 300}
+    )
 
     // 响应额外按钮
     const secondNodeResExtraBtn = () => {
@@ -1487,9 +1502,12 @@ export const HTTPFlowDetailRequestAndResponse: React.FC<HTTPFlowDetailRequestAnd
                         extra={secondNodeResExtraBtn()}
                         AfterBeautifyRenderBtn={
                             <>
-                                <YakitButton size='small' onClick={() => {
-                                    emiter.emit("onEditTag", JSON.stringify({id: flow.Id, historyId}))
-                                }}>
+                                <YakitButton
+                                    size='small'
+                                    onClick={() => {
+                                        emiter.emit("onEditTag", JSON.stringify({id: flow.Id, historyId}))
+                                    }}
+                                >
                                     编辑tag
                                 </YakitButton>
                                 <CodingPopover