From d56c9b491136220f10c5986db524c3a12e2e2892 Mon Sep 17 00:00:00 2001
From: AkaraChen <akarachen@outlook.com>
Date: Thu, 26 Dec 2024 13:07:15 +0800
Subject: [PATCH] chore: add cursor pointer for option card

---
 .../components/datasets/create/step-two/option-card.tsx    | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/web/app/components/datasets/create/step-two/option-card.tsx b/web/app/components/datasets/create/step-two/option-card.tsx
index d0efdaabb1cdb8..b27be757b30d9d 100644
--- a/web/app/components/datasets/create/step-two/option-card.tsx
+++ b/web/app/components/datasets/create/step-two/option-card.tsx
@@ -15,13 +15,15 @@ type OptionCardHeaderProps = {
   isActive?: boolean
   activeClassName?: string
   effectImg?: string
+  disabled?: boolean
 }
 
 export const OptionCardHeader: FC<OptionCardHeaderProps> = (props) => {
-  const { icon, title, description, isActive, activeClassName, effectImg } = props
+  const { icon, title, description, isActive, activeClassName, effectImg, disabled } = props
   return <div className={classNames(
     'flex h-full overflow-hidden rounded-t-xl relative',
     isActive && activeClassName,
+    !disabled && 'cursor-pointer',
   )}>
     <div className='size-14 flex items-center justify-center relative overflow-hidden'>
       {isActive && effectImg && <Image src={effectImg} className='absolute top-0 left-0 w-full h-full' alt='' width={56} height={56} />}
@@ -63,7 +65,7 @@ export const OptionCard: FC<OptionCardProps> = forwardRef((props, ref) => {
       (isActive && !noHighlight)
         ? 'border-[1.5px] border-components-option-card-option-selected-border'
         : 'border border-components-option-card-option-border',
-      disabled && 'opacity-50',
+      disabled && 'opacity-50 cursor-not-allowed',
       className,
     )}
     style={{
@@ -83,6 +85,7 @@ export const OptionCard: FC<OptionCardProps> = forwardRef((props, ref) => {
       isActive={isActive && !noHighlight}
       activeClassName={activeHeaderClassName}
       effectImg={effectImg}
+      disabled={disabled}
     />
     {/** Body */}
     {isActive && (children || actions) && <div className='py-3 px-4 bg-components-panel-bg rounded-b-xl'>