From f15d0ab243cd2c96a2b6b7d31be97ed1f8ef22c9 Mon Sep 17 00:00:00 2001
From: gitlawr <lawrleegle@gmail.com>
Date: Wed, 27 May 2026 15:43:32 +0800
Subject: [PATCH] fix(cluster-create): hide ProviderCatalog when entering via
 providerHint
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The catalog was gated on ``currentStep === startStep`` so it would
re-appear at step 1 whenever ``providerHint`` skipped the catalog (e.g.
GPU Service's "Add a Kubernetes Cluster" empty-state CTA). Result: the
configure step rendered the catalog *plus* the Name/Description/Advanced
form together, with Kubernetes shown as already selected — confusing
and ugly.

Pin the catalog to step 0 explicitly. ``startStep`` was only used to
seed ``currentStep``, so it's inlined into the ``useState`` initializer
to keep the "skip the catalog when providerHint is set" intent in one
place. Pre-selecting a provider now correctly lands the user straight
on the configure form alone.
---
 src/pages/cluster-management/cluster-create.tsx | 14 +++++++++-----
 1 file changed, 9 insertions(+), 5 deletions(-)

diff --git a/src/pages/cluster-management/cluster-create.tsx b/src/pages/cluster-management/cluster-create.tsx
index 4dc2c6d1..30832691 100644
--- a/src/pages/cluster-management/cluster-create.tsx
+++ b/src/pages/cluster-management/cluster-create.tsx
@@ -62,16 +62,15 @@ const ClusterCreate: React.FC<{
   setCurrentTitle?: (title: string) => void;
   onClose?: () => void;
 }> = ({ onClose, action, providerHint, setCurrentTitle }) => {
-  // When the caller already picked a provider for us, start one step
-  // in — provider catalog is step 0; configure is step 1.
-  const startStep = providerHint ? 1 : 0;
   const stepList = useStepList();
   const [systemConfigState] = useAtom(systemConfigAtom);
   const intl = useIntl();
   const [credentialList, setCredentialList] = useState<
     Global.BaseOption<number, { provider: ProviderType }>[]
   >([]);
-  const [currentStep, setCurrentStep] = useState<number>(startStep);
+  // When the caller already picked a provider for us, start one step
+  // in — provider catalog is step 0; configure is step 1.
+  const [currentStep, setCurrentStep] = useState<number>(providerHint ? 1 : 0);
   const [registrationInfo, setRegistrationInfo] = useState<{
     token: string;
     image: string;
@@ -357,7 +356,12 @@ const ClusterCreate: React.FC<{
         }
       >
         <div style={{ flex: 1 }}>
-          {currentStep === startStep && (
+          {currentStep === 0 && (
+            // Catalog belongs to step 0 only. The previous gate used
+            // ``startStep`` which is 1 when ``providerHint`` skips the
+            // catalog — that wrongly re-rendered it on top of the
+            // configure form for entry points like "Add a Kubernetes
+            // Cluster".
             <ProviderCatalog
               cols={2}
               dataList={providerList}