fix: BUG修复

yaklang · Jul 5, 2024 · 1569e30 · 1569e30
1 parent dcef20d
commit 1569e30
Show file tree

Hide file tree

Showing 14 changed files with 104 additions and 56 deletions.
diff --git a/app/renderer/src/main/src/pages/YakRunner/BottomEditorDetails/BottomEditorDetails.tsx b/app/renderer/src/main/src/pages/YakRunner/BottomEditorDetails/BottomEditorDetails.tsx
@@ -7,7 +7,7 @@ import {API} from "@/services/swagger/resposeType"
 import styles from "./BottomEditorDetails.module.scss"
 import {failed, success, warn, info} from "@/utils/notification"
 import classNames from "classnames"
-import {BottomEditorDetailsProps, JumpToEditorProps, OutputInfoListProps, ShowItemType} from "./BottomEditorDetailsType"
+import {BottomEditorDetailsProps, JumpToEditorProps, OutputInfoProps, ShowItemType} from "./BottomEditorDetailsType"
 import {HelpInfoList} from "../CollapseList/CollapseList"
 import {OutlineTrashIcon, OutlineXIcon} from "@/assets/icon/outline"
 import {YakitButton} from "@/components/yakitUI/YakitButton/YakitButton"
@@ -29,9 +29,7 @@ const {ipcRenderer} = window.require("electron")
 // 编辑器区域 展示详情（输出/语法检查/终端/帮助信息）
 
 export const BottomEditorDetails: React.FC<BottomEditorDetailsProps> = (props) => {
-    const {setEditorDetails, showItem, setShowItem} = props
-    const ref = useRef(null)
-    const [inViewport] = useInViewport(ref)
+    const {isShowEditorDetails,setEditorDetails, showItem, setShowItem} = props
 
     const systemRef = useRef<System | undefined>(SystemInfo.system)
     useEffect(() => {
@@ -48,11 +46,11 @@ export const BottomEditorDetails: React.FC<BottomEditorDetailsProps> = (props) =
     const filterItem = (arr) => arr.filter((item, index) => arr.indexOf(item) === index)
 
     useEffect(() => {
-        if (showItem && inViewport) {
+        if (showItem && isShowEditorDetails) {
             if(showType.includes(showItem)) return
             setShowType((arr) => filterItem([...arr, showItem]))
         }
-    }, [showItem, inViewport])
+    }, [showItem, isShowEditorDetails])
 
     const syntaxCheckData = useMemo(() => {
         if (activeFile?.syntaxCheck) {
@@ -75,6 +73,10 @@ export const BottomEditorDetails: React.FC<BottomEditorDetailsProps> = (props) =
     const onOpenBottomDetailFun = useMemoizedFn((v: string) => {
         try {
             const {type}: {type: ShowItemType} = JSON.parse(v)
+            // 执行时需要清空输出
+            if(type === "output"){
+                xtermClear(xtermRef)
+            }
             setEditorDetails(true)
             setShowItem(type)
         } catch (error) {}
@@ -118,7 +120,7 @@ export const BottomEditorDetails: React.FC<BottomEditorDetailsProps> = (props) =
     }, [fileTree])
 
     return (
-        <div className={styles["bottom-editor-details"]} ref={ref}>
+        <div className={styles["bottom-editor-details"]}>
             <div className={styles["header"]}>
                 <div className={styles["select-box"]}>
                     <div
@@ -189,7 +191,7 @@ export const BottomEditorDetails: React.FC<BottomEditorDetailsProps> = (props) =
                             [styles["render-show"]]: showItem === "output"
                         })}
                     >
-                        <OutputInfoList outputCahceRef={outputCahceRef} xtermRef={xtermRef} />
+                        <OutputInfo outputCahceRef={outputCahceRef} xtermRef={xtermRef} />
                     </div>
                 )}
 
@@ -215,7 +217,7 @@ export const BottomEditorDetails: React.FC<BottomEditorDetailsProps> = (props) =
                         {/* {systemRef.current === "Windows_NT" ? (
                             <div className={styles["no-syntax-check"]}>终端监修中</div>
                         ) : ( */}
-                        <TerminalBox isShow={showItem === "terminal"} folderPath={folderPath}/>
+                        <TerminalBox folderPath={folderPath} isShowEditorDetails={isShowEditorDetails}/>
                         {/* )} */}
                     </div>
                 )}
@@ -238,7 +240,7 @@ export const BottomEditorDetails: React.FC<BottomEditorDetailsProps> = (props) =
     )
 }
 
-export const OutputInfoList: React.FC<OutputInfoListProps> = (props) => {
+export const OutputInfo: React.FC<OutputInfoProps> = (props) => {
     const {outputCahceRef, xtermRef} = props
 
     useEffect(() => {

diff --git a/app/renderer/src/main/src/pages/YakRunner/BottomEditorDetails/BottomEditorDetailsType.d.ts b/app/renderer/src/main/src/pages/YakRunner/BottomEditorDetails/BottomEditorDetailsType.d.ts
@@ -2,6 +2,7 @@ import { Selection } from "../RunnerTabs/RunnerTabsType";
 export interface BottomEditorDetailsProps {
     showItem?: ShowItemType
     setShowItem:(v:ShowItemType)=>void
+    isShowEditorDetails: boolean
     setEditorDetails:(v:boolean)=>void
 }
 
@@ -12,7 +13,7 @@ export interface JumpToEditorProps {
     id: string
 }
 
-export interface OutputInfoListProps {
+export interface OutputInfoProps {
     outputCahceRef:React.MutableRefObject<string>
     xtermRef: React.MutableRefObject<any>
 }
diff --git a/app/renderer/src/main/src/pages/YakRunner/BottomEditorDetails/TerminalBox/TerminalBox.tsx b/app/renderer/src/main/src/pages/YakRunner/BottomEditorDetails/TerminalBox/TerminalBox.tsx
@@ -17,15 +17,12 @@ import { StringToUint8Array, Uint8ArrayToString } from "@/utils/str"
 const {ipcRenderer} = window.require("electron")
 
 export interface TerminalBoxProps {
+    isShowEditorDetails: boolean
     folderPath: string
-    isShow: boolean
 }
 export const TerminalBox: React.FC<TerminalBoxProps> = (props) => {
-    const {folderPath,isShow} = props
-    const {fileTree} = useStore()
+    const {isShowEditorDetails,folderPath} = props
     const xtermRef = useRef<any>(null)
-    const [inputValue, setInputValue] = useState<string>("")
-    const [defaultXterm, setDefaultXterm] = useState<string>("")
     // 是否允许输入及不允许输入的原因
     const [allowInput, setAllowInput] = useState<boolean>(true)
 
@@ -56,7 +53,7 @@ export const TerminalBox: React.FC<TerminalBoxProps> = (props) => {
             })
             .then(() => {
                 startTerminalPath.current = folderPath
-                success(`终端${folderPath}监听成功`)
+                isShowEditorDetails&&success(`终端${folderPath}监听成功`)
             })
             .catch((e: any) => {
                 failed(`ERROR: ${JSON.stringify(e)}`)
@@ -75,7 +72,6 @@ export const TerminalBox: React.FC<TerminalBoxProps> = (props) => {
                 let str = Uint8ArrayToString(data.raw)
 
                 writeXTerm(xtermRef, str)
-                setDefaultXterm(str)
             }
         })
 
@@ -90,7 +86,7 @@ export const TerminalBox: React.FC<TerminalBoxProps> = (props) => {
             if(startTerminalPath.current === data){
                 setAllowInput(false)
             }
-            warn(`终端${data}被关闭`)
+            isShowEditorDetails&&warn(`终端${data}被关闭`)
         })
         return () => {
             // 移除

diff --git a/app/renderer/src/main/src/pages/YakRunner/CollapseList/CollapseList.tsx b/app/renderer/src/main/src/pages/YakRunner/CollapseList/CollapseList.tsx
@@ -22,10 +22,8 @@ import {monaco} from "react-monaco-editor"
 const {ipcRenderer} = window.require("electron")
 const {Panel} = Collapse
 
-const content = `chr 将传入的值根据ascii码表转换为对应的字符\n\nExample:\n\`\`\`\nchr(65) // A\nchr("65") // A\n\`\`\``
-
 export const CollapseList: <T>(props: CollapseListProp<T>) => ReactElement | null = memo((props) => {
-    const {type = "sideBar", onlyKey, list, titleRender, renderItem} = props
+    const {type = "sideBar", onlyKey, list, titleRender, renderItem,collapseProps} = props
 
     const wrapperClassName = useMemo(() => {
         if (type === "sideBar") return styles["collapse-list-side-bar"]
@@ -46,6 +44,7 @@ export const CollapseList: <T>(props: CollapseListProp<T>) => ReactElement | nul
                     const {isActive} = panelProps
                     return <OutlineChevronrightIcon className={classNames({"collapse-expand-arrow": !!isActive})} />
                 }}
+                {...collapseProps}
             >
                 {list.map((item, index) => {
                     return (
@@ -208,7 +207,6 @@ export const HelpInfoList: React.FC<HelpInfoListProps> = memo((props) => {
                 const iWord = getWordWithPointAtPosition(model, position)
                 if (iWord.word.length === 0) return
                 const type = getModelContext(model, "plugin") || "yak"
-
                 await ipcRenderer
                     .invoke("YaklangLanguageFind", {
                         InspectType: "definition",

diff --git a/app/renderer/src/main/src/pages/YakRunner/CollapseList/CollapseListType.ts b/app/renderer/src/main/src/pages/YakRunner/CollapseList/CollapseListType.ts
@@ -1,3 +1,4 @@
+import { CollapseProps } from "antd"
 import {ReactNode} from "react"
 import { monaco } from "react-monaco-editor"
 
@@ -12,6 +13,7 @@ export interface CollapseListProp<T> {
     list: T[]
     titleRender: (info: T) => ReactNode
     renderItem: (info: T) => ReactNode
+    collapseProps?: CollapseProps
 }
 
 export interface HelpInfoListProps {}

diff --git a/app/renderer/src/main/src/pages/YakRunner/FileTree/FileTree.module.scss b/app/renderer/src/main/src/pages/YakRunner/FileTree/FileTree.module.scss
@@ -125,6 +125,7 @@
     }
 
     &:hover {
+        border-radius: 4px;
         background-color: #f8f8f8;
     }
 

diff --git a/app/renderer/src/main/src/pages/YakRunner/FileTree/FileTree.tsx b/app/renderer/src/main/src/pages/YakRunner/FileTree/FileTree.tsx
@@ -290,7 +290,7 @@ const FileTreeNode: React.FC<FileTreeNodeProps> = (props) => {
         setCopyPath,
         setFoucsedKey
     } = props
-    const {areaInfo, activeFile} = useStore()
+    const {areaInfo, activeFile, fileTree} = useStore()
     const {setAreaInfo, setActiveFile, setFileTree} = useDispatcher()
     // 是否为编辑模式
     const [isEdit, setEdit] = useState<boolean>(false)
@@ -388,6 +388,7 @@ const FileTreeNode: React.FC<FileTreeNodeProps> = (props) => {
                 // 重命名 调用接口成功后更新tree
                 const result = await grpcFetchRenameFileTree(info.path, value, info.parent)
                 console.log("更新", result)
+
                 if (result.length === 0) return
                 const {path, name, icon} = result[0]
                 // 文件夹重命名
@@ -601,8 +602,16 @@ const FileTreeNode: React.FC<FileTreeNodeProps> = (props) => {
                 key: "rename"
             }
         ]
+        const CloseFolder: YakitMenuItemType[] = []
+        if (fileTree.length > 0 && info.path === fileTree[0].path) {
+            CloseFolder.push({
+                label: "关闭文件夹",
+                key: "closeFolder"
+            })
+        }
         if (info.isFolder) {
             return [
+                ...CloseFolder,
                 ...FolderMenu,
                 {type: "divider"},
                 // {label: "复制", key: "copy"},
@@ -619,7 +628,11 @@ const FileTreeNode: React.FC<FileTreeNodeProps> = (props) => {
                 ...base
             ]
         }
-    }, [info.isFolder, copyPath])
+    }, [info, copyPath])
+
+    const closeFolder = useMemoizedFn(() => {
+        setFileTree && setFileTree([])
+    })
 
     const handleContextMenu = useMemoizedFn(() => {
         showByRightContext({
@@ -629,6 +642,9 @@ const FileTreeNode: React.FC<FileTreeNodeProps> = (props) => {
             onClick: ({key, keyPath}) => {
                 console.log("handleContextMenu", key, keyPath)
                 switch (key) {
+                    case "closeFolder":
+                        closeFolder()
+                        break
                     case "newFile":
                         onNewFile(info.path)
                         break

diff --git a/app/renderer/src/main/src/pages/YakRunner/LeftSideBar/LeftSideBar.tsx b/app/renderer/src/main/src/pages/YakRunner/LeftSideBar/LeftSideBar.tsx
@@ -63,6 +63,9 @@ export const LeftSideBar: React.FC<LeftSideBarProps> = (props) => {
                         [styles["left-side-bar-item-advanced-config-unShow"]]: active === "help-doc" && isUnShow
                     })}
                     onClick={() => {
+                        if(active === "file-tree"){
+                            setUnShow(false)
+                        }
                         if (active === "help-doc") {
                             setUnShow(!isUnShow)
                         }

diff --git a/app/renderer/src/main/src/pages/YakRunner/RunnerFileTree/RunnerFileTree.module.scss b/app/renderer/src/main/src/pages/YakRunner/RunnerFileTree/RunnerFileTree.module.scss
@@ -58,6 +58,7 @@
     user-select: none;
 }
 .opened-file-body {
+    padding: 0px 4px;
     @media screen and (min-height: 950px) {
         max-height: 220px;
     }

diff --git a/app/renderer/src/main/src/pages/YakRunner/RunnerFileTree/RunnerFileTree.tsx b/app/renderer/src/main/src/pages/YakRunner/RunnerFileTree/RunnerFileTree.tsx
@@ -771,6 +771,9 @@ export const OpenedFile: React.FC<OpenedFileProps> = memo((props) => {
                         list={[[...getOpenFileList]]}
                         titleRender={titleRender}
                         renderItem={renderItem}
+                        collapseProps={{
+                            defaultActiveKey:['collapse-list-0']
+                        }}
                     />
                 </div>
             ) : (

diff --git a/app/renderer/src/main/src/pages/YakRunner/RunnerTabs/RunnerTabs.module.scss b/app/renderer/src/main/src/pages/YakRunner/RunnerTabs/RunnerTabs.module.scss
@@ -398,6 +398,7 @@
     }
     .operate-box {
         width: 100%;
+        max-width: 1200px;
         display: flex;
         flex-direction: column;
         gap: 24px;
@@ -505,7 +506,7 @@
                     .file-path {
                         color: #b4bbca;
                     }
-                    &:hover{
+                    &:hover {
                         .file-path {
                             color: #f28b44;
                             text-decoration: underline;
@@ -516,3 +517,13 @@
         }
     }
 }
+.hint-right-btn {
+    margin-top: 24px;
+    display: flex;
+    justify-content: space-between;
+
+    .btn-group-wrapper {
+        display: flex;
+        gap: 8px;
+    }
+}
-Original file line number
+Diff line change
@@ Expand Up / @@ -125,6 +125,7 @@ @@
         }
         &:hover {
+            border-radius: 4px;
             background-color: #f8f8f8;
         }
@@ Expand Down @@