Use meta ID if present for card IDs

patternfly · Feb 20, 2024 · 7a4f46f · 7a4f46f
1 parent 509c856
commit 7a4f46f
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 2 deletions.
diff --git a/packages/dev/src/CustomCatalog.tsx b/packages/dev/src/CustomCatalog.tsx
@@ -97,11 +97,19 @@ export const CustomCatalog: React.FC = () => {
           <Gallery className="pfext-quick-start-catalog__gallery" hasGutter>
             {allQuickStarts
               .filter((quickStart: QuickStart) => quickStart.metadata.instructional)
+              .map((quickStart: QuickStart) => ({
+                ...quickStart,
+                metadata: {
+                  ...quickStart.metadata,
+                  id: `${quickStart.metadata.name}-bookmar`
+                }
+              }))
               .map((quickStart: QuickStart) => {
                 const {
                   metadata: { name: id },
                 } = quickStart;
 
+                console.log(quickStart, 'this is quickstart!');
                 return (
                   <GalleryItem key={id} className="pfext-quick-start-catalog__gallery-item">
                     <QuickStartTile

diff --git a/packages/module/src/catalog/QuickStartTile.tsx b/packages/module/src/catalog/QuickStartTile.tsx
@@ -29,10 +29,11 @@ const QuickStartTile: React.FC<QuickStartTileProps> = ({
   action,
 }) => {
   const {
-    metadata: { name: id },
+    metadata: { name, id: metaId },
     spec: { icon, tasks, displayName, description, durationMinutes, prerequisites, link, type },
   } = quickStart;
 
+  const id = metaId || name;
   const { setActiveQuickStart, footer } =
     React.useContext<QuickStartContextValues>(QuickStartContext);
 
@@ -71,7 +72,7 @@ const QuickStartTile: React.FC<QuickStartTileProps> = ({
       if (link) {
         window.open(link.href);
       } else {
-        setActiveQuickStart(id, tasks?.length);
+        setActiveQuickStart(name, tasks?.length);
       }
       onClick();
     }