Merge pull request opendatahub-io#2365 from dpanshug/RHOAIENG-2041-ca…

…rd-title 'Jupyter ' text is missing for Notebook tile in RHOAI Enabled/Explore tab
red-hat-data-services · Jan 22, 2024 · dded0e6 · dded0e6
2 parents f2de311 + c8ae440
commit dded0e6
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 30 deletions.
diff --git a/frontend/src/__tests__/cypress/cypress/e2e/applications/explore.cy.ts b/frontend/src/__tests__/cypress/cypress/e2e/applications/explore.cy.ts
@@ -4,19 +4,21 @@ import { mockStatus } from '~/__mocks__/mockStatus';
 import { explorePage } from '~/__tests__/cypress/cypress/pages/explore';
 import { mockComponents } from '~/__mocks__/mockComponents';
 
-const initIntercepts = () => {
-  cy.intercept('/api/dsc/status', mockDscStatus({}));
-  cy.intercept('/api/status', mockStatus());
-  cy.intercept('/api/config', mockDashboardConfig({}));
-  cy.intercept('/api/components', mockComponents());
-};
-
 describe('Explore Page', { testIsolation: false }, () => {
-  it('should have selectable cards', () => {
-    initIntercepts();
+  beforeEach(() => {
+    cy.intercept('/api/dsc/status', mockDscStatus({}));
+    cy.intercept('/api/status', mockStatus());
+    cy.intercept('/api/config', mockDashboardConfig({}));
+    cy.intercept('/api/components', mockComponents());
+  });
 
+  it('should have selectable cards', () => {
     explorePage.visit();
     explorePage.findExploreCard('jupyter').click();
     explorePage.findDrawerPanel().should('be.visible');
   });
+
+  it('card title should be visible', () => {
+    cy.get('span').should('contain', 'Jupyter');
+  });
 });
diff --git a/frontend/src/components/SupportedAppTitle.tsx b/frontend/src/components/SupportedAppTitle.tsx
@@ -10,31 +10,25 @@ type SupportedAppTitleProps = {
 };
 
 const SupportedAppTitle: React.FC<SupportedAppTitleProps> = ({ odhApp, showProvider = false }) => {
-  let title = odhApp.spec.displayName;
-  let icon;
-
-  if (isRedHatSupported(odhApp)) {
-    const splitTitle = odhApp.spec.displayName.split(' ');
-    title = `${splitTitle.slice(0, -1).join(' ')} `;
-    icon = (
-      <span style={{ whiteSpace: 'nowrap' }}>
-        <Tooltip content={`${ODH_PRODUCT_NAME} certified and supported`}>
-          <Button variant="plain" style={{ padding: 0 }}>
-            <img
-              style={{ marginLeft: 'var(--pf-v5-global--spacer--xs)', verticalAlign: 'middle' }}
-              src="../images/CheckStar.svg"
-              alt={`${ODH_PRODUCT_NAME} certified and supported`}
-            />
-          </Button>
-        </Tooltip>
-      </span>
-    );
-  }
+  const title = odhApp.spec.displayName;
+  const icon = (
+    <span style={{ whiteSpace: 'nowrap' }}>
+      <Tooltip content={`${ODH_PRODUCT_NAME} certified and supported`}>
+        <Button variant="plain" style={{ padding: 0, verticalAlign: 'middle' }}>
+          <img
+            style={{ marginLeft: 'var(--pf-v5-global--spacer--xs)' }}
+            src="../images/CheckStar.svg"
+            alt={`${ODH_PRODUCT_NAME} certified and supported`}
+          />
+        </Button>
+      </Tooltip>
+    </span>
+  );
 
   return (
     <CardTitle>
       <span style={{ verticalAlign: 'text-bottom' }}>{title}</span>
-      {icon}
+      {isRedHatSupported(odhApp) && icon}
       {showProvider && odhApp.spec.provider && (
         <div>
           <span className="odh-card__provider">by {odhApp.spec.provider}</span>