From dc641348f69578e4381a1652d70a9c0b9ce2fd69 Mon Sep 17 00:00:00 2001
From: lyzno1 <92089059+lyzno1@users.noreply.github.com>
Date: Sat, 9 Aug 2025 22:41:42 +0800
Subject: [PATCH] fix: resolve datasets container rounded corners disappearing
 during scroll (#23667)

---
 web/app/(commonLayout)/datasets/container.tsx    | 4 ++--
 web/app/(commonLayout)/datasets/doc.tsx          | 2 +-
 web/app/components/base/tab-slider-new/index.tsx | 4 ++--
 web/app/components/header/header-wrapper.tsx     | 2 +-
 4 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/web/app/(commonLayout)/datasets/container.tsx b/web/app/(commonLayout)/datasets/container.tsx
index 444119332..5328fd03a 100644
--- a/web/app/(commonLayout)/datasets/container.tsx
+++ b/web/app/(commonLayout)/datasets/container.tsx
@@ -86,8 +86,8 @@ const Container = () => {
   }, [currentWorkspace, router])
 
   return (
-    <div ref={containerRef} className='scroll-container relative flex grow flex-col overflow-y-auto bg-background-body'>
-      <div className='sticky top-0 z-10 flex h-[80px] shrink-0 flex-wrap items-center justify-between gap-y-2 bg-background-body px-12 pb-2 pt-4 leading-[56px]'>
+    <div ref={containerRef} className={`scroll-container relative flex grow flex-col overflow-y-auto rounded-t-xl outline-none ${activeTab === 'dataset' ? 'bg-background-body' : 'bg-components-panel-bg'}`}>
+      <div className={`sticky top-0 z-10 flex shrink-0 flex-wrap items-center justify-between gap-y-2 rounded-t-xl px-6 py-2 ${activeTab === 'api' ? 'border-b border-solid border-b-divider-regular' : ''} ${activeTab === 'dataset' ? 'bg-background-body' : 'bg-components-panel-bg'}`}>
         <TabSliderNew
           value={activeTab}
           onChange={newActiveTab => setActiveTab(newActiveTab)}
diff --git a/web/app/(commonLayout)/datasets/doc.tsx b/web/app/(commonLayout)/datasets/doc.tsx
index b31e0a416..c31dad3c0 100644
--- a/web/app/(commonLayout)/datasets/doc.tsx
+++ b/web/app/(commonLayout)/datasets/doc.tsx
@@ -193,7 +193,7 @@ const Doc = ({ apiBaseUrl }: DocProps) => {
             </button>
           )}
       </div>
-      <article className={cn('prose-xl prose mx-1 rounded-t-xl bg-background-default px-4 pt-16 sm:mx-12', theme === Theme.dark && 'prose-invert')}>
+      <article className={cn('prose-xl prose', theme === Theme.dark && 'prose-invert')}>
         {Template}
       </article>
     </div>
diff --git a/web/app/components/base/tab-slider-new/index.tsx b/web/app/components/base/tab-slider-new/index.tsx
index fc0bc1c98..cf68abff1 100644
--- a/web/app/components/base/tab-slider-new/index.tsx
+++ b/web/app/components/base/tab-slider-new/index.tsx
@@ -25,8 +25,8 @@ const TabSliderNew: FC<TabSliderProps> = ({
           key={option.value}
           onClick={() => onChange(option.value)}
           className={cn(
-            'mr-1 flex h-[32px] cursor-pointer items-center rounded-lg border-[0.5px] border-transparent px-3 py-[7px] text-[13px] font-medium leading-[18px] text-text-tertiary hover:bg-components-main-nav-nav-button-bg-active',
-            value === option.value && 'border-components-main-nav-nav-button-border bg-components-main-nav-nav-button-bg-active text-components-main-nav-nav-button-text-active shadow-xs',
+            'mr-1 flex h-[32px] cursor-pointer items-center rounded-lg border-[0.5px] border-transparent px-3 py-[7px] text-[13px] font-medium leading-[18px] text-text-tertiary hover:bg-state-base-hover',
+            value === option.value && 'border-components-main-nav-nav-button-border bg-state-base-hover text-components-main-nav-nav-button-text-active shadow-xs',
           )}
         >
           {option.icon}
diff --git a/web/app/components/header/header-wrapper.tsx b/web/app/components/header/header-wrapper.tsx
index 6486e3707..17026d46b 100644
--- a/web/app/components/header/header-wrapper.tsx
+++ b/web/app/components/header/header-wrapper.tsx
@@ -13,7 +13,7 @@ const HeaderWrapper = ({
   children,
 }: HeaderWrapperProps) => {
   const pathname = usePathname()
-  const isBordered = ['/apps', '/datasets', '/datasets/create', '/tools'].includes(pathname)
+  const isBordered = ['/apps', '/datasets/create', '/tools'].includes(pathname)
   // Check if the current path is a workflow canvas & fullscreen
   const inWorkflowCanvas = pathname.endsWith('/workflow')
   const workflowCanvasMaximize = localStorage.getItem('workflow-canvas-maximize') === 'true'