From 8bf53a76f8a71eaf261ea68b9ee44e5bf19893aa Mon Sep 17 00:00:00 2001
From: BoBoooooo <17746714@qq.com>
Date: Mon, 20 May 2024 15:26:07 +0800
Subject: [PATCH] fix: prototype2code & go back history error (#156)

* fix: snippet import bug

* fix: history could back logic bug

* fix: editor add left border when in dual mode

* fix: setting-form title overflow bug
---
 packages/core/src/helpers/prototype.ts | 16 ++++++++++------
 packages/core/src/models/history.ts    |  2 +-
 packages/designer/src/editor.tsx       | 12 ++++++++++--
 packages/setting-form/src/form-ui.tsx  |  2 ++
 4 files changed, 23 insertions(+), 9 deletions(-)

diff --git a/packages/core/src/helpers/prototype.ts b/packages/core/src/helpers/prototype.ts
index b59a52ce..710f107f 100644
--- a/packages/core/src/helpers/prototype.ts
+++ b/packages/core/src/helpers/prototype.ts
@@ -20,6 +20,7 @@ export function prototype2importDeclarationData(
   relativeFilepath?: string,
 ): { source: string; specifiers: IImportSpecifierData[] } {
   let source = prototype.package;
+  const isSnippet = prototype.type === 'snippet';
   if (relativeFilepath && isFilepath(source)) {
     source = getRelativePath(relativeFilepath, source);
   }
@@ -35,12 +36,15 @@ export function prototype2importDeclarationData(
       type: 'ImportDefaultSpecifier',
     });
   } else {
-    [prototype.name, ...(prototype.relatedImports || [])].forEach((item) => {
-      specifiers.push({
-        localName: item,
-        type: 'ImportSpecifier',
-      });
-    });
+    // 忽略代码片段 name
+    [...(isSnippet ? [] : [prototype.name]), ...(prototype.relatedImports || [])].forEach(
+      (item) => {
+        specifiers.push({
+          localName: item,
+          type: 'ImportSpecifier',
+        });
+      },
+    );
   }
 
   return {
diff --git a/packages/core/src/models/history.ts b/packages/core/src/models/history.ts
index e0b16897..1576303d 100644
--- a/packages/core/src/models/history.ts
+++ b/packages/core/src/models/history.ts
@@ -58,7 +58,7 @@ export class TangoHistory {
   }
 
   get couldBack() {
-    return this._records.length > 0 && this._index > -1;
+    return this._records.length > 0 && this._index > 0;
   }
 
   get couldForward() {
diff --git a/packages/designer/src/editor.tsx b/packages/designer/src/editor.tsx
index b208f54f..084f951d 100644
--- a/packages/designer/src/editor.tsx
+++ b/packages/designer/src/editor.tsx
@@ -1,7 +1,7 @@
 import React, { useRef, useEffect, useCallback } from 'react';
 import { Box } from 'coral-system';
 import { MultiEditor, MultiEditorProps } from '@music163/tango-ui';
-import { observer, useWorkspace } from '@music163/tango-context';
+import { observer, useDesigner, useWorkspace } from '@music163/tango-context';
 import { isValidCode } from '@music163/tango-core';
 import { Modal } from 'antd';
 
@@ -32,6 +32,7 @@ export const CodeEditor = observer(
   ({ autoRemoveUnusedImports = true, ...rest }: CodeEditorProps) => {
     const editorRef = useRef(null);
     const workspace = useWorkspace();
+    const designer = useDesigner();
     const files = workspace.listFiles();
     const activeFile = workspace.activeFile;
 
@@ -101,8 +102,15 @@ export const CodeEditor = observer(
       [workspace],
     );
 
+    const borderStyle =
+      designer.activeView === 'dual'
+        ? {
+            borderLeft: 'solid 1px var(--tango-colors-line2)',
+          }
+        : {};
+
     return (
-      <Box display="flex" flexDirection="row" height="100%" bg="white">
+      <Box display="flex" flexDirection="row" height="100%" bg="white" {...borderStyle}>
         <MultiEditor
           ref={editorRef}
           options={{
diff --git a/packages/setting-form/src/form-ui.tsx b/packages/setting-form/src/form-ui.tsx
index 71ad05d3..f695d9b0 100644
--- a/packages/setting-form/src/form-ui.tsx
+++ b/packages/setting-form/src/form-ui.tsx
@@ -257,6 +257,8 @@ export function FormHeader({ title, extra, subTitle }: FormHeaderProps) {
             mr="s"
             whiteSpace="nowrap"
             className="FormHeaderTitle"
+            textOverflow="ellipsis"
+            overflow="hidden"
           >
             {title}
           </Box>