fix(@porrtal/r-shell-material): fix banner key and banner menu icons

Comcast · Dec 11, 2022 · b40746f · b40746f
1 parent e84ab38
commit b40746f
Show file tree

Hide file tree

Showing 4 changed files with 7 additions and 6 deletions.
diff --git a/apps/n/porrtal-io-app/page-data/data.ts b/apps/n/porrtal-io-app/page-data/data.ts
@@ -53,14 +53,15 @@ export const getAngularUiLibrary = (): string => {
   return 'material';
 }
 
-export const getBannerData = (): BannerData => {
+export const getBannerData = (reactUiLibrary: string): BannerData => {
+  const displayIcon = reactUiLibrary === 'blueprint' ? 'hurricane' : 'cyclone';
   return {
     displayText: 'porrtal.io',
-    displayIcon: 'hurricane',
+    displayIcon: displayIcon,
     childData: [
       {
         key: 'porrtal.io',
-        displayIcon: 'hurricane',
+        displayIcon: displayIcon,
         displayText: 'porrtal.io',
         targetUrl: '/',
       },

diff --git a/apps/n/porrtal-io-app/pages/react/quick-start/index.tsx b/apps/n/porrtal-io-app/pages/react/quick-start/index.tsx
@@ -40,7 +40,7 @@ export function QuickStart(props: QuickStartProps) {
   }, []);
 
   const quickStartBannerData = {
-    ...getBannerData(),
+    ...getBannerData(reactUiLibrary),
     displayText: `quick-start ${reactUiLibrary ? '(' : ''}${reactUiLibrary}${
       reactUiLibrary ? ')' : ''
     }`,

diff --git a/apps/n/porrtal-io-app/pages/react/samples/index.tsx b/apps/n/porrtal-io-app/pages/react/samples/index.tsx
@@ -38,7 +38,7 @@ export function Samples(props: SamplesProps) {
   }, []);
 
   const quickStartBannerData = {
-    ...getBannerData(),
+    ...getBannerData(reactUiLibrary),
     displayText: `samples ${reactUiLibrary ? '(' : ''}${reactUiLibrary}${
       reactUiLibrary ? ')' : ''
     }`,

diff --git a/libs/porrtal/r-shell-material/src/lib/banner/banner.tsx b/libs/porrtal/r-shell-material/src/lib/banner/banner.tsx
@@ -94,7 +94,7 @@ function BannerMenu(props: BannerProps & { children: ReactNode | undefined }) {
       >
         {props.bannerData.childData.map((menuItem) => (
           <IconMenuItem
-            key={menuItem.displayText}
+            key={menuItem.key ?? menuItem.displayText}
             leftIcon={
               <>
                 {menuItem.displayIcon && <Icon>{menuItem.displayIcon}</Icon>}