feat(global-header): release global-header 1.0.0 (#428)

Author: christoph-jerolimov

workspaces/global-header/.changeset/seven-queens-whisper.md

@@ -0,0 +1,5 @@
+---
+'@red-hat-developer-hub/backstage-plugin-global-header': major
+---
+
+Release 1.0.0

workspaces/global-header/plugins/global-header/dev/index.tsx

@@ -279,7 +279,7 @@ createDevApp()
           title="A colorized notification: ⚠️ Maintainance planned for this week! ⚠️"
           textColor="blue"
           backgroundColor="yellow"
-          border="2px solid blue"
+          borderColor="blue"
         />
         <NotificationBanner
           title="And a dismissable notification! Will appear after reload!"

workspaces/global-header/plugins/global-header/package.json

@@ -52,8 +52,6 @@
     "@mui/material": "5.16.13",
     "@mui/styled-engine": "5.16.13",
     "@scalprum/react-core": "0.9.3",
-    "react-dom": "18.3.1",
-    "react-router-dom": "^6.26.2",
     "react-use": "^17.5.0"
   },
   "peerDependencies": {
@@ -77,7 +75,7 @@
     "react-router-dom": "^6.0.0"
   },
   "keywords": [
-    "support:tech-preview",
+    "support:production",
     "lifecycle:active",
     "backstage",
     "plugin"

workspaces/global-header/plugins/global-header/report.api.md

@@ -200,14 +200,16 @@ export interface NotificationBannerProps {
   // (undocumented)
   backgroundColor?: string;
   // (undocumented)
-  border?: string;
-  // (undocumented)
-  borderRadius?: string;
+  borderColor?: string;
   // (undocumented)
   dismiss?: NotificationBannerDismiss;
   // (undocumented)
+  icon?: string;
+  // (undocumented)
   id?: string;
   // (undocumented)
+  layout?: React_2.CSSProperties;
+  // (undocumented)
   markdown?: boolean;
   // (undocumented)
   textColor?: string;

workspaces/global-header/plugins/global-header/src/components/NotificationBanner.tsx

@@ -15,12 +15,12 @@
  */
 
 import React from 'react';
-import Alert from '@mui/material/Alert';
+
 import { MarkdownContent } from '@backstage/core-components';
 
-// export type NotificationBannerColor = 'success' | 'info' | 'warning' | 'error';
-// export type NotificationBannerIcon = 'success' | 'info' | 'warning' | 'error';
-// export type NotificationBannerVariant = 'standard' | 'filled' | 'outlined';
+import Alert from '@mui/material/Alert';
+
+import { HeaderIcon } from './HeaderIcon/HeaderIcon';
 
 /**
  * @public
@@ -34,15 +34,12 @@ export interface NotificationBannerProps {
   id?: string;
   title: string;
   markdown?: boolean;
+  icon?: string;
 
   textColor?: string;
   backgroundColor?: string;
-  border?: string;
-  borderRadius?: string;
-
-  // color?: NotificationBannerColor;
-  // icon?: NotificationBannerIcon;
-  // variant?: NotificationBannerVariant;
+  borderColor?: string;
+  layout?: React.CSSProperties;
 
   dismiss?: NotificationBannerDismiss;
 }
@@ -99,18 +96,19 @@ export const NotificationBanner = (props: NotificationBannerProps) => {
 
   return (
     <Alert
-      // color={props.color}
-      // severity={props.icon}
-      icon={false}
-      // variant={props.variant}
+      color="warning"
+      icon={props.icon ? <HeaderIcon icon={props.icon} /> : false}
       onClose={onClose}
       sx={{
-        color: props.textColor ?? 'text.primary',
-        backgroundColor: props.backgroundColor ?? 'background.paper',
-        border: props.border,
-        borderRadius: props.borderRadius,
+        color: props.textColor,
+        backgroundColor: props.backgroundColor,
+        borderColor: props.borderColor,
+        borderStyle: 'solid',
+        borderWidth: 2,
+        borderRadius: 0,
         justifyContent: 'center',
         textAlign: 'center',
+        ...props.layout,
       }}
     >
       {props.markdown ? (

workspaces/global-header/yarn.lock

@@ -11042,7 +11042,6 @@ __metadata:
     "@testing-library/user-event": ^14.0.0
     msw: ^1.0.0
     react: ^16.13.1 || ^17.0.0 || ^18.0.0
-    react-dom: 18.3.1
     react-router-dom: ^6.0.0
     react-use: ^17.5.0
   peerDependencies:
@@ -30644,7 +30643,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react-dom@npm:18.3.1, react-dom@npm:^18.0.2":
+"react-dom@npm:^18.0.2":
   version: 18.3.1
   resolution: "react-dom@npm:18.3.1"
   dependencies: