From a721c5073d2a7c5468d97ba407740aaee4703ec5 Mon Sep 17 00:00:00 2001
From: Jenny <32821331+jenny-s51@users.noreply.github.com>
Date: Thu, 24 Jul 2025 09:29:01 -0400
Subject: [PATCH] fix(ws): Apply sentence case to text elements across UI
 (#497)

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

fix(ws): align nav item names with corresponding page headers

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

fix(ws): apply sentence case, fix tests

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

fix(ws): apply correct sentence case to TableTitleText
---
 .../src/__tests__/cypress/cypress/pages/home.ts  |  2 +-
 workspaces/frontend/src/app/AppRoutes.tsx        |  4 ++--
 .../src/app/components/WorkspaceTable.tsx        |  2 +-
 .../src/app/context/WorkspaceActionsContext.tsx  |  2 +-
 .../properties/WorkspaceKindFormProperties.tsx   |  4 ++--
 .../app/pages/WorkspaceKinds/WorkspaceKinds.tsx  | 16 ++++++++--------
 .../details/WorkspaceKindDetails.tsx             |  2 +-
 .../details/WorkspaceKindDetailsOverview.tsx     |  2 +-
 .../WorkspaceKindSummaryExpandableCard.tsx       |  8 ++++----
 .../Details/WorkspaceDetailsActivity.tsx         |  8 ++++----
 .../src/app/pages/Workspaces/Workspaces.tsx      |  2 +-
 .../WorkspaceRedirectInformationView.tsx         |  4 ++--
 .../WorkspaceRestartActionModal.tsx              |  4 ++--
 .../WorkspaceStopActionModal.tsx                 |  6 +++---
 .../frontend/src/shared/components/Filter.tsx    | 12 ++++++++----
 .../frontend/src/shared/style/MUI-theme.scss     |  5 -----
 16 files changed, 41 insertions(+), 42 deletions(-)

diff --git a/workspaces/frontend/src/__tests__/cypress/cypress/pages/home.ts b/workspaces/frontend/src/__tests__/cypress/cypress/pages/home.ts
index 106ad8fc..f630eaba 100644
--- a/workspaces/frontend/src/__tests__/cypress/cypress/pages/home.ts
+++ b/workspaces/frontend/src/__tests__/cypress/cypress/pages/home.ts
@@ -4,7 +4,7 @@ class Home {
   }
 
   findButton() {
-    return cy.get('button:contains("Create Workspace")');
+    return cy.get('button:contains("Create workspace")');
   }
 }
 
diff --git a/workspaces/frontend/src/app/AppRoutes.tsx b/workspaces/frontend/src/app/AppRoutes.tsx
index 0251d74e..6b0136b4 100644
--- a/workspaces/frontend/src/app/AppRoutes.tsx
+++ b/workspaces/frontend/src/app/AppRoutes.tsx
@@ -43,7 +43,7 @@ export const useAdminDebugSettings = (): NavDataItem[] => {
       children: [{ label: 'Notebooks', path: '/notebookDebugSettings' }],
     },
     {
-      label: 'Workspace Kinds',
+      label: 'Workspace kinds',
       path: AppRoutePaths.workspaceKinds,
     },
   ];
@@ -51,7 +51,7 @@ export const useAdminDebugSettings = (): NavDataItem[] => {
 
 export const useNavData = (): NavDataItem[] => [
   {
-    label: 'Notebooks',
+    label: 'Workspaces',
     path: AppRoutePaths.workspaces,
   },
   ...useAdminDebugSettings(),
diff --git a/workspaces/frontend/src/app/components/WorkspaceTable.tsx b/workspaces/frontend/src/app/components/WorkspaceTable.tsx
index 184e8408..8be07a03 100644
--- a/workspaces/frontend/src/app/components/WorkspaceTable.tsx
+++ b/workspaces/frontend/src/app/components/WorkspaceTable.tsx
@@ -394,7 +394,7 @@ const WorkspaceTable = React.forwardRef<WorkspaceTableRef, WorkspaceTableProps>(
             toolbarActions={
               canCreateWorkspaces && (
                 <Button variant="primary" ouiaId="Primary" onClick={createWorkspace}>
-                  Create Workspace
+                  Create workspace
                 </Button>
               )
             }
diff --git a/workspaces/frontend/src/app/context/WorkspaceActionsContext.tsx b/workspaces/frontend/src/app/context/WorkspaceActionsContext.tsx
index d9a70d54..aac7efd9 100644
--- a/workspaces/frontend/src/app/context/WorkspaceActionsContext.tsx
+++ b/workspaces/frontend/src/app/context/WorkspaceActionsContext.tsx
@@ -213,7 +213,7 @@ export const WorkspaceActionsContextProvider: React.FC<WorkspaceActionsContextPr
                     isOpen
                     resourceName={activeWsAction.workspace.name}
                     namespace={activeWsAction.workspace.namespace}
-                    title="Delete Workspace?"
+                    title="Delete workspace?"
                     onClose={() => setActiveWsAction(null)}
                     onDelete={async () => executeDeleteAction()}
                   />
diff --git a/workspaces/frontend/src/app/pages/WorkspaceKinds/Form/properties/WorkspaceKindFormProperties.tsx b/workspaces/frontend/src/app/pages/WorkspaceKinds/Form/properties/WorkspaceKindFormProperties.tsx
index 652156a3..4aafe35e 100644
--- a/workspaces/frontend/src/app/pages/WorkspaceKinds/Form/properties/WorkspaceKindFormProperties.tsx
+++ b/workspaces/frontend/src/app/pages/WorkspaceKinds/Form/properties/WorkspaceKindFormProperties.tsx
@@ -76,9 +76,9 @@ export const WorkspaceKindFormProperties: React.FC<WorkspaceKindFormPropertiesPr
                 <TextInput
                   isDisabled={!properties.deprecated}
                   type="text"
-                  label="Deprecation Message"
+                  label="Deprecation message"
                   value={properties.deprecationMessage}
-                  placeholder="Deprecation Message"
+                  placeholder="Deprecation message"
                   onChange={(_, value) => updateField({ ...properties, deprecationMessage: value })}
                   id="workspace-kind-deprecated-msg"
                 />
diff --git a/workspaces/frontend/src/app/pages/WorkspaceKinds/WorkspaceKinds.tsx b/workspaces/frontend/src/app/pages/WorkspaceKinds/WorkspaceKinds.tsx
index daea4356..d0868e40 100644
--- a/workspaces/frontend/src/app/pages/WorkspaceKinds/WorkspaceKinds.tsx
+++ b/workspaces/frontend/src/app/pages/WorkspaceKinds/WorkspaceKinds.tsx
@@ -478,7 +478,7 @@ export const WorkspaceKinds: React.FunctionComponent = () => {
         <DrawerContentBody>
           <PageSection isFilled>
             <Content>
-              <h1>Kubeflow Workspace Kinds</h1>
+              <h1>Workspace kinds</h1>
               <p>View your existing workspace kinds.</p>
             </Content>
             <br />
@@ -499,9 +499,9 @@ export const WorkspaceKinds: React.FunctionComponent = () => {
                           <ThemeAwareSearchInput
                             value={searchNameValue}
                             onChange={onSearchNameChange}
-                            placeholder="Filter by Name"
-                            fieldLabel="Find by Name"
-                            aria-label="Filter by Name"
+                            placeholder="Filter by name"
+                            fieldLabel="Find by name"
+                            aria-label="Filter by name"
                           />
                         </ToolbarItem>
                       </ToolbarFilter>
@@ -520,9 +520,9 @@ export const WorkspaceKinds: React.FunctionComponent = () => {
                           <ThemeAwareSearchInput
                             value={searchDescriptionValue}
                             onChange={onSearchDescriptionChange}
-                            placeholder="Filter by Description"
-                            fieldLabel="Find by Description"
-                            aria-label="Filter by Description"
+                            placeholder="Filter by description"
+                            fieldLabel="Find by description"
+                            aria-label="Filter by description"
                           />
                         </ToolbarItem>
                       </ToolbarFilter>
@@ -537,7 +537,7 @@ export const WorkspaceKinds: React.FunctionComponent = () => {
                       </ToolbarFilter>
                       <ToolbarItem>
                         <Button variant="primary" ouiaId="Primary" onClick={createWorkspaceKind}>
-                          Create Workspace Kind
+                          Create workspace kind
                         </Button>
                       </ToolbarItem>
                     </ToolbarGroup>
diff --git a/workspaces/frontend/src/app/pages/WorkspaceKinds/details/WorkspaceKindDetails.tsx b/workspaces/frontend/src/app/pages/WorkspaceKinds/details/WorkspaceKindDetails.tsx
index ebaf0531..aaa7a150 100644
--- a/workspaces/frontend/src/app/pages/WorkspaceKinds/details/WorkspaceKindDetails.tsx
+++ b/workspaces/frontend/src/app/pages/WorkspaceKinds/details/WorkspaceKindDetails.tsx
@@ -71,7 +71,7 @@ export const WorkspaceKindDetails: React.FunctionComponent<WorkspaceKindDetailsP
           />
           <Tab
             eventKey={podConfigsTabKey}
-            title={<TabTitleText>Pod Configs</TabTitleText>}
+            title={<TabTitleText>Pod configs</TabTitleText>}
             tabContentId="podConfigsTabContent"
             aria-label="Pod Configs"
           />
diff --git a/workspaces/frontend/src/app/pages/WorkspaceKinds/details/WorkspaceKindDetailsOverview.tsx b/workspaces/frontend/src/app/pages/WorkspaceKinds/details/WorkspaceKindDetailsOverview.tsx
index d5aa3e8f..7a0b58d8 100644
--- a/workspaces/frontend/src/app/pages/WorkspaceKinds/details/WorkspaceKindDetailsOverview.tsx
+++ b/workspaces/frontend/src/app/pages/WorkspaceKinds/details/WorkspaceKindDetailsOverview.tsx
@@ -42,7 +42,7 @@ export const WorkspaceKindDetailsOverview: React.FunctionComponent<
     </DescriptionListGroup>
     <Divider />
     <DescriptionListGroup>
-      <DescriptionListTerm>Deprecation Message</DescriptionListTerm>
+      <DescriptionListTerm>Deprecation message</DescriptionListTerm>
       <DescriptionListDescription>{workspaceKind.deprecationMessage}</DescriptionListDescription>
     </DescriptionListGroup>
     <Divider />
diff --git a/workspaces/frontend/src/app/pages/WorkspaceKinds/summary/WorkspaceKindSummaryExpandableCard.tsx b/workspaces/frontend/src/app/pages/WorkspaceKinds/summary/WorkspaceKindSummaryExpandableCard.tsx
index a1c3bee8..b5415036 100644
--- a/workspaces/frontend/src/app/pages/WorkspaceKinds/summary/WorkspaceKindSummaryExpandableCard.tsx
+++ b/workspaces/frontend/src/app/pages/WorkspaceKinds/summary/WorkspaceKindSummaryExpandableCard.tsx
@@ -54,7 +54,7 @@ const WorkspaceKindSummaryExpandableCard: React.FC<WorkspaceKindSummaryExpandabl
     <Card isExpanded={isExpanded}>
       <CardHeader onExpand={onExpandToggle}>
         <CardTitle>
-          <Content component={ContentVariants.h2}>Workspaces Summary</Content>
+          <Content component={ContentVariants.h2}>Workspaces summary</Content>
         </CardTitle>
       </CardHeader>
       <CardExpandableContent>
@@ -71,7 +71,7 @@ const WorkspaceKindSummaryExpandableCard: React.FC<WorkspaceKindSummaryExpandabl
               </FlexItem>
             </SectionFlex>
             <SectionDivider />
-            <SectionFlex title="Idle GPU Workspaces">
+            <SectionFlex title="Idle GPU workspaces">
               <FlexItem>
                 <Bullseye>
                   <Button
@@ -88,12 +88,12 @@ const WorkspaceKindSummaryExpandableCard: React.FC<WorkspaceKindSummaryExpandabl
               </FlexItem>
               <FlexItem>
                 <Bullseye>
-                  <Content>Idle GPU Workspaces</Content>
+                  <Content>Idle GPU workspaces</Content>
                 </Bullseye>
               </FlexItem>
             </SectionFlex>
             <SectionDivider />
-            <SectionFlex title="Top GPU Consumer Namespaces">
+            <SectionFlex title="Top GPU consumer namespaces">
               <FlexItem>
                 <Stack hasGutter>
                   {topGpuConsumersByNamespace.length > 0 ? (
diff --git a/workspaces/frontend/src/app/pages/Workspaces/Details/WorkspaceDetailsActivity.tsx b/workspaces/frontend/src/app/pages/Workspaces/Details/WorkspaceDetailsActivity.tsx
index 30601dce..17a4b411 100644
--- a/workspaces/frontend/src/app/pages/Workspaces/Details/WorkspaceDetailsActivity.tsx
+++ b/workspaces/frontend/src/app/pages/Workspaces/Details/WorkspaceDetailsActivity.tsx
@@ -23,28 +23,28 @@ export const WorkspaceDetailsActivity: React.FunctionComponent<WorkspaceDetailsA
   return (
     <DescriptionList isHorizontal>
       <DescriptionListGroup>
-        <DescriptionListTerm>Last Activity</DescriptionListTerm>
+        <DescriptionListTerm>Last activity</DescriptionListTerm>
         <DescriptionListDescription data-testid="lastActivity">
           {format(activity.lastActivity, DATE_FORMAT)}
         </DescriptionListDescription>
       </DescriptionListGroup>
       <Divider />
       <DescriptionListGroup>
-        <DescriptionListTerm>Last Update</DescriptionListTerm>
+        <DescriptionListTerm>Last update</DescriptionListTerm>
         <DescriptionListDescription data-testid="lastUpdate">
           {format(activity.lastUpdate, DATE_FORMAT)}
         </DescriptionListDescription>
       </DescriptionListGroup>
       <Divider />
       <DescriptionListGroup>
-        <DescriptionListTerm>Pause Time</DescriptionListTerm>
+        <DescriptionListTerm>Pause time</DescriptionListTerm>
         <DescriptionListDescription data-testid="pauseTime">
           {format(pausedTime, DATE_FORMAT)}
         </DescriptionListDescription>
       </DescriptionListGroup>
       <Divider />
       <DescriptionListGroup>
-        <DescriptionListTerm>Pending Restart</DescriptionListTerm>
+        <DescriptionListTerm>Pending restart</DescriptionListTerm>
         <DescriptionListDescription data-testid="pendingRestart">
           {pendingRestart ? 'Yes' : 'No'}
         </DescriptionListDescription>
diff --git a/workspaces/frontend/src/app/pages/Workspaces/Workspaces.tsx b/workspaces/frontend/src/app/pages/Workspaces/Workspaces.tsx
index e7749751..0c76e373 100644
--- a/workspaces/frontend/src/app/pages/Workspaces/Workspaces.tsx
+++ b/workspaces/frontend/src/app/pages/Workspaces/Workspaces.tsx
@@ -54,7 +54,7 @@ export const Workspaces: React.FunctionComponent = () => {
     <PageSection isFilled>
       <Stack hasGutter>
         <StackItem>
-          <Content component={ContentVariants.h1}>Kubeflow Workspaces</Content>
+          <Content component={ContentVariants.h1}>Workspaces</Content>
         </StackItem>
         <StackItem>
           <Content component={ContentVariants.p}>
diff --git a/workspaces/frontend/src/app/pages/Workspaces/workspaceActions/WorkspaceRedirectInformationView.tsx b/workspaces/frontend/src/app/pages/Workspaces/workspaceActions/WorkspaceRedirectInformationView.tsx
index e3086a2f..72b2786f 100644
--- a/workspaces/frontend/src/app/pages/Workspaces/workspaceActions/WorkspaceRedirectInformationView.tsx
+++ b/workspaces/frontend/src/app/pages/Workspaces/workspaceActions/WorkspaceRedirectInformationView.tsx
@@ -93,7 +93,7 @@ export const WorkspaceRedirectInformationView: React.FC<WorkspaceRedirectInforma
           eventKey={0}
           title={
             <TabTitleText>
-              Image Config {getLevelIcon(getMaxLevel(imageConfigRedirects))}
+              Image config {getLevelIcon(getMaxLevel(imageConfigRedirects))}
             </TabTitleText>
           }
         >
@@ -111,7 +111,7 @@ export const WorkspaceRedirectInformationView: React.FC<WorkspaceRedirectInforma
         <Tab
           eventKey={1}
           title={
-            <TabTitleText>Pod Config {getLevelIcon(getMaxLevel(podConfigRedirects))}</TabTitleText>
+            <TabTitleText>Pod config {getLevelIcon(getMaxLevel(podConfigRedirects))}</TabTitleText>
           }
         >
           {podConfigRedirects.map((redirect, index) => (
diff --git a/workspaces/frontend/src/app/pages/Workspaces/workspaceActions/WorkspaceRestartActionModal.tsx b/workspaces/frontend/src/app/pages/Workspaces/workspaceActions/WorkspaceRestartActionModal.tsx
index d2eccc40..3e341701 100644
--- a/workspaces/frontend/src/app/pages/Workspaces/workspaceActions/WorkspaceRestartActionModal.tsx
+++ b/workspaces/frontend/src/app/pages/Workspaces/workspaceActions/WorkspaceRestartActionModal.tsx
@@ -38,7 +38,7 @@ export const WorkspaceRestartActionModal: React.FC<RestartActionAlertProps> = ({
       aria-labelledby="title-icon-modal-title"
       onClose={onClose}
     >
-      <ModalHeader title="Restart Workspace" />
+      <ModalHeader title="Restart workspace" />
       <ModalBody>
         {workspacePendingUpdate ? (
           <>
@@ -54,7 +54,7 @@ export const WorkspaceRestartActionModal: React.FC<RestartActionAlertProps> = ({
       </ModalBody>
       <ModalFooter>
         {workspacePendingUpdate && (
-          <Button onClick={() => handleClick(true)}>Update and Restart</Button>
+          <Button onClick={() => handleClick(true)}>Update and restart</Button>
         )}
         <Button
           onClick={() => handleClick(false)}
diff --git a/workspaces/frontend/src/app/pages/Workspaces/workspaceActions/WorkspaceStopActionModal.tsx b/workspaces/frontend/src/app/pages/Workspaces/workspaceActions/WorkspaceStopActionModal.tsx
index 3375b6dd..631724ba 100644
--- a/workspaces/frontend/src/app/pages/Workspaces/workspaceActions/WorkspaceStopActionModal.tsx
+++ b/workspaces/frontend/src/app/pages/Workspaces/workspaceActions/WorkspaceStopActionModal.tsx
@@ -86,7 +86,7 @@ export const WorkspaceStopActionModal: React.FC<StopActionAlertProps> = ({
       aria-labelledby="title-icon-modal-title"
       onClose={onClose}
     >
-      <ModalHeader title="Stop Workspace" />
+      <ModalHeader title="Stop workspace" />
       <ModalBody>
         {workspacePendingUpdate ? (
           <>
@@ -103,11 +103,11 @@ export const WorkspaceStopActionModal: React.FC<StopActionAlertProps> = ({
       <ModalFooter>
         {shouldShowActionButton('updateAndStop') && workspacePendingUpdate && (
           <ActionButton
-            action="Update and Stop"
+            action="Update and stop"
             titleOnLoading="Stopping ..."
             onClick={() => handleUpdateAndStop()}
           >
-            Update and Stop
+            Update and stop
           </ActionButton>
         )}
 
diff --git a/workspaces/frontend/src/shared/components/Filter.tsx b/workspaces/frontend/src/shared/components/Filter.tsx
index a2c59570..9290c2cd 100644
--- a/workspaces/frontend/src/shared/components/Filter.tsx
+++ b/workspaces/frontend/src/shared/components/Filter.tsx
@@ -65,6 +65,11 @@ const Filter = React.forwardRef<FilterRef, FilterProps>(
       [activeFilter.columnKey, columnDefinition],
     );
 
+    const textInputActiveFilterLabel = useMemo(
+      () => activeFilterLabel.toLowerCase(),
+      [activeFilterLabel],
+    );
+
     const handleFilterMenuKeys = useCallback(
       (event: KeyboardEvent) => {
         if (!isFilterMenuOpen) {
@@ -174,7 +179,6 @@ const Filter = React.forwardRef<FilterRef, FilterProps>(
         columnKey: Object.keys(columnDefinition)[0],
         value: '',
       });
-      setFilters([]);
     }, [columnDefinition, setFilters]);
 
     useImperativeHandle(ref, () => ({
@@ -262,9 +266,9 @@ const Filter = React.forwardRef<FilterRef, FilterProps>(
                   data-testid={`${id}-search-input`}
                   value={searchValue}
                   onChange={onSearchChange}
-                  placeholder={`Filter by ${activeFilterLabel}`}
-                  fieldLabel={`Find by ${activeFilterLabel}`}
-                  aria-label={`Filter by ${activeFilterLabel}`}
+                  placeholder={`Filter by ${textInputActiveFilterLabel}`}
+                  fieldLabel={`Find by ${textInputActiveFilterLabel}`}
+                  aria-label={`Filter by ${textInputActiveFilterLabel}`}
                 />
               </ToolbarItem>
               {filters.map(
diff --git a/workspaces/frontend/src/shared/style/MUI-theme.scss b/workspaces/frontend/src/shared/style/MUI-theme.scss
index e6d39922..ddaf6135 100644
--- a/workspaces/frontend/src/shared/style/MUI-theme.scss
+++ b/workspaces/frontend/src/shared/style/MUI-theme.scss
@@ -154,8 +154,6 @@
   --pf-v6-c-button--PaddingInlineStart: var(--mui-button--PaddingInlineStart);
   --pf-v6-c-button--PaddingInlineEnd: var(--mui-button--PaddingInlineEnd);
   --pf-v6-c-button--LineHeight: var(--mui-button--LineHeight);
-
-  text-transform: var(--mui-text-transform);
   letter-spacing: 0.02857em;
 }
 
@@ -546,13 +544,11 @@
     --mui-palette-primary-dark
   );
 
-  text-transform: var(--mui-text-transform);
   font-weight: var(--mui-button-font-weight);
   letter-spacing: 0.02857em;
 }
 
 .mui-theme .pf-v6-c-menu-toggle__button {
-  text-transform: var(--mui-text-transform);
   font-weight: var(--mui-button-font-weight);
   letter-spacing: 0.02857em;
   align-self: stretch;
@@ -765,7 +761,6 @@
 }
 
 .mui-theme .pf-v6-c-tabs__link {
-  text-transform: var(--mui-text-transform);
   font-weight: var(--mui-button-font-weight);
   line-height: var(--mui-button-line-height);
   letter-spacing: 0.02857em;