From 7881fb4d2238d98fc7fc3cb7ee4db450d3eba0b7 Mon Sep 17 00:00:00 2001
From: AkaraChen <akarachen@outlook.com>
Date: Fri, 22 Nov 2024 13:12:24 +0800
Subject: [PATCH] fix: layout overflow

---
 web/app/components/datasets/create/index.tsx          | 2 +-
 web/app/components/datasets/create/step-two/index.tsx | 2 +-
 web/app/components/datasets/create/top-bar/index.tsx  | 9 +++++----
 3 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/web/app/components/datasets/create/index.tsx b/web/app/components/datasets/create/index.tsx
index 9dc498bcae..c78fda6953 100644
--- a/web/app/components/datasets/create/index.tsx
+++ b/web/app/components/datasets/create/index.tsx
@@ -119,7 +119,7 @@ const DatasetUpdateForm = ({ datasetId }: DatasetUpdateFormProps) => {
 
   return (
     <div className='flex flex-col' style={{ height: 'calc(100vh - 56px)' }}>
-      <div className="grow bg-white">
+      <div className="grow bg-white flex flex-col max-h-full h-full">
         <Topbar activeStepIndex={step - 1} />
         <div className={step === 1 ? 'block h-full' : 'hidden'}>
           <StepOne
diff --git a/web/app/components/datasets/create/step-two/index.tsx b/web/app/components/datasets/create/step-two/index.tsx
index a5d44e7b37..536b426cb4 100644
--- a/web/app/components/datasets/create/step-two/index.tsx
+++ b/web/app/components/datasets/create/step-two/index.tsx
@@ -636,7 +636,7 @@ const StepTwo = ({
   } as RetrievalConfig)
 
   return (
-    <div className='flex w-full h-full'>
+    <div className='flex w-full max-h-full h-full overflow-y-auto'>
       <div className='relative h-full w-full overflow-y-scroll'>
         <div className={cn(s.form, isMobile && '!px-4')}>
           <div className={s.label}>{t('datasetCreation.stepTwo.segmentation')}</div>
diff --git a/web/app/components/datasets/create/top-bar/index.tsx b/web/app/components/datasets/create/top-bar/index.tsx
index 86260cce70..dc2604c45b 100644
--- a/web/app/components/datasets/create/top-bar/index.tsx
+++ b/web/app/components/datasets/create/top-bar/index.tsx
@@ -1,5 +1,6 @@
 import type { FC } from 'react'
 import { RiArrowLeftLine } from '@remixicon/react'
+import Link from 'next/link'
 import { Stepper, type StepperProps } from '../stepper'
 import classNames from '@/utils/classnames'
 
@@ -10,12 +11,12 @@ export type TopbarProps = Pick<StepperProps, 'activeStepIndex'> & {
 export const Topbar: FC<TopbarProps> = (props) => {
   const { className, ...rest } = props
   return <div className={classNames('flex items-center justify-between relative', className)}>
-    <div className="h-12 pl-2 pr-6 py-2 justify-start items-center gap-1 inline-flex">
+    <Link href={'/datasets'} className="h-12 pl-2 pr-6 py-2 justify-start items-center gap-1 inline-flex">
       <RiArrowLeftLine className='size-4 mr-2' />
-      <div className="text-[#101827] text-[13px] font-semibold uppercase leading-none">
+      <p className="text-[#101827] text-[13px] font-semibold uppercase leading-none">
         Create Knowledge
-      </div>
-    </div>
+      </p>
+    </Link>
     <div className={
       'top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 absolute'
     }>