diff --git a/src/renderer/src/trace/pages/Component.tsx b/src/renderer/src/trace/pages/Component.tsx
index 2ceb26f89e..8fff68c9cb 100644
--- a/src/renderer/src/trace/pages/Component.tsx
+++ b/src/renderer/src/trace/pages/Component.tsx
@@ -53,8 +53,8 @@ export const Text: React.FC<React.HTMLAttributes<HTMLSpanElement>> = ({ style, c
 )
 
 // VStack 组件
-export const VStack: React.FC<{ grap?: number; align?: string; children: React.ReactNode }> = ({
-  grap = 5,
+export const VStack: React.FC<{ gap?: number; align?: string; children: React.ReactNode }> = ({
+  gap = 5,
   align = 'stretch',
   children,
   ...props
@@ -64,7 +64,7 @@ export const VStack: React.FC<{ grap?: number; align?: string; children: React.R
       display: 'flex',
       flexDirection: 'column',
       alignItems: align,
-      gap: `${grap}px`
+      gap: `${gap}px`
     }}
     {...props}>
     {children}
@@ -88,8 +88,8 @@ export const GridItem: React.FC<
 )
 
 // HStack 组件
-export const HStack: React.FC<{ grap?: number; children: React.ReactNode; style?: React.CSSProperties }> = ({
-  grap,
+export const HStack: React.FC<{ gap?: number; children: React.ReactNode; style?: React.CSSProperties }> = ({
+  gap,
   children,
   style,
   ...props
@@ -99,7 +99,7 @@ export const HStack: React.FC<{ grap?: number; children: React.ReactNode; style?
       display: 'inline-flex',
       flexDirection: 'row',
       alignItems: 'center',
-      gap: grap ? `${grap}px` : '5px',
+      gap: gap ? `${gap}px` : '5px',
       ...style
     }}
     {...props}>
diff --git a/src/renderer/src/trace/pages/TraceTree.tsx b/src/renderer/src/trace/pages/TraceTree.tsx
index 06976b5d00..01384bc9cc 100644
--- a/src/renderer/src/trace/pages/TraceTree.tsx
+++ b/src/renderer/src/trace/pages/TraceTree.tsx
@@ -59,7 +59,7 @@ const TreeNode: React.FC<TreeNodeProps> = ({ node, handleClick, treeData, paddin
           handleClick(node.id)
         }}>
         <GridItem colSpan={8} style={{ paddingLeft: `${paddingLeft}px`, textAlign: 'left' }}>
-          <HStack grap={2}>
+          <HStack gap={2}>
             <IconButton
               aria-label="Toggle"
               aria-expanded={isOpen ? true : false}
diff --git a/src/renderer/src/trace/pages/index.tsx b/src/renderer/src/trace/pages/index.tsx
index d53487e23f..507ce813a6 100644
--- a/src/renderer/src/trace/pages/index.tsx
+++ b/src/renderer/src/trace/pages/index.tsx
@@ -156,7 +156,7 @@ export const TracePage: React.FC<TracePageProp> = ({ topicId, traceId, modelName
         <SimpleGrid columns={1} templateColumns="1fr">
           <Box padding={0} className="scroll-container">
             {showList ? (
-              <VStack grap={1} align="start">
+              <VStack gap={1} align="start">
                 {spans.length === 0 ? (
                   <Text>没有找到Trace信息</Text>
                 ) : (