From c6e81c2a77ed89d013fefb2fd48aa9bd8619ca7a Mon Sep 17 00:00:00 2001
From: Jenny <32821331+jenny-s51@users.noreply.github.com>
Date: Fri, 4 Jul 2025 10:36:19 -0400
Subject: [PATCH] fix(ws): Improve Workspace Creation Wizard Step Descriptions
 (#452)

Signed-off-by: Jenny <32821331+jenny-s51@users.noreply.github.com>

Changes to step descriptions based on feedback
---
 .../src/app/pages/Workspaces/Form/WorkspaceForm.tsx | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

diff --git a/workspaces/frontend/src/app/pages/Workspaces/Form/WorkspaceForm.tsx b/workspaces/frontend/src/app/pages/Workspaces/Form/WorkspaceForm.tsx
index be13e07b..cf377e9f 100644
--- a/workspaces/frontend/src/app/pages/Workspaces/Form/WorkspaceForm.tsx
+++ b/workspaces/frontend/src/app/pages/Workspaces/Form/WorkspaceForm.tsx
@@ -9,6 +9,7 @@ import {
   ProgressStep,
   ProgressStepper,
   Stack,
+  StackItem,
 } from '@patternfly/react-core';
 import useGenericObjectState from '~/app/hooks/useGenericObjectState';
 import { useNotebookAPI } from '~/app/hooks/useNotebookAPI';
@@ -30,10 +31,12 @@ enum WorkspaceFormSteps {
 }
 
 const stepDescriptions: { [key in WorkspaceFormSteps]?: string } = {
-  [WorkspaceFormSteps.KindSelection]: 'Select a workspace kind to use for the workspace.',
+  [WorkspaceFormSteps.KindSelection]:
+    'A workspace kind is a template for creating a workspace, which is an isolated area where you can work with models in your preferred IDE, such as Jupyter Notebook.',
   [WorkspaceFormSteps.ImageSelection]:
-    'Select a workspace image and image version to use for the workspace.',
-  [WorkspaceFormSteps.PodConfigSelection]: 'Select a pod config to use for the workspace.',
+    'Select a workspace image and image version to use for the workspace. A workspace image is a container image that contains the software and dependencies needed to run a workspace.',
+  [WorkspaceFormSteps.PodConfigSelection]:
+    'Select a pod config to use for the workspace. A pod config is a configuration that defines the resources and settings for a workspace.',
   [WorkspaceFormSteps.Properties]: 'Configure properties for your workspace.',
 };
 
@@ -167,7 +170,6 @@ const WorkspaceForm: React.FC = () => {
               <FlexItem>
                 <Content>
                   <h1>{`${mode === 'create' ? 'Create' : 'Edit'} workspace`}</h1>
-                  <p>{stepDescriptions[currentStep]}</p>
                 </Content>
               </FlexItem>
               <FlexItem>
@@ -211,6 +213,9 @@ const WorkspaceForm: React.FC = () => {
                 </ProgressStepper>
               </FlexItem>
             </Flex>
+            <StackItem>
+              <p>{stepDescriptions[currentStep]}</p>
+            </StackItem>
           </Stack>
         </PageSection>
       </PageGroup>