From 6f9c99ae10dbdc93ec9dbe96cf32f54d6c75113a Mon Sep 17 00:00:00 2001
From: Lukas Harbarth <lukas.harbarth@sap.com>
Date: Fri, 15 Aug 2025 08:47:27 +0200
Subject: [PATCH 1/2] docs(UXC Integration): update pattern & add description

---
 docs/Patterns.mdx                             | 17 ++++++++++++++++
 patterns/navigation-layout/src/NLShellBar.tsx |  4 ++--
 .../src/NotificationsPopover.tsx              | 20 -------------------
 patterns/navigation-layout/src/index.css      |  5 -----
 4 files changed, 19 insertions(+), 27 deletions(-)

diff --git a/docs/Patterns.mdx b/docs/Patterns.mdx
index 91e32b1accb..d26552e48e7 100644
--- a/docs/Patterns.mdx
+++ b/docs/Patterns.mdx
@@ -6,6 +6,23 @@ import UXCIntegration from "./UXCIntegration.js"
 
 # UXC Integration
 
+This code sample demonstrates full adherence to the UXC Product Consistency standards currently available within SAP. It serves as a comprehensive reference implementation, showcasing the integration of all mandatory and some optional UI elements and interaction patterns required for a consistent user experience across SAP products.
+
+**Key features illustrated in this example include:**
+
+- **Side Navigation**: An organized layout presenting a clear hierarchical structure.
+- **Shell Bar**: Incorporates all required elements, such as:
+  - Side Navigation access
+  - Branding element
+  - ShellBar action help
+  - User profile with access to the user menu
+  - Optional components like notifications or settings
+- **ShellBar Search**: Provides search functionality fully aligned with SAP's usability guidelines.
+- **User Settings**: Offers personalization options for users to tailor their experience, such as theming and language preferences.
+- **Notification Experience**: Delivers real-time alerts and updates, complete with badge indicators and intuitive interaction patterns.
+
+This example is ideal for developers and designers looking to align their applications with SAP's UXC standards, ensuring consistency, usability, and compliance across the SAP ecosystem.
+
 <UXCIntegration/>
 
 <Footer/>
diff --git a/patterns/navigation-layout/src/NLShellBar.tsx b/patterns/navigation-layout/src/NLShellBar.tsx
index 37a33c8522a..5cd1f52abb6 100644
--- a/patterns/navigation-layout/src/NLShellBar.tsx
+++ b/patterns/navigation-layout/src/NLShellBar.tsx
@@ -17,6 +17,7 @@ import {
   SearchItem,
   SearchScope,
   ShellBar,
+  ShellBarBranding,
   ShellBarItem,
   ShellBarSearch,
   ShellBarSpacer,
@@ -80,7 +81,6 @@ export function NLShellBar(props: NLShellBarProps) {
       <ShellBar
         {...rest}
         id="shellbar"
-        primaryTitle="VEGA CRM"
         notificationsCount="10"
         showNotifications
         showProductSwitch
@@ -95,7 +95,7 @@ export function NLShellBar(props: NLShellBarProps) {
             onClick={handleMenuBtnClick}
           />
         }
-        logo={<img src={SapLogoSvg} alt="SAP Logo" />}
+        branding={<ShellBarBranding logo={<img src={SapLogoSvg} alt="SAP Logo" />}>Vega CRM</ShellBarBranding>}
         content={
           <>
             <Tag design="Set2" colorScheme="7" data-hide-order="2">
diff --git a/patterns/navigation-layout/src/NotificationsPopover.tsx b/patterns/navigation-layout/src/NotificationsPopover.tsx
index 1b5f8272eb8..a492000d103 100644
--- a/patterns/navigation-layout/src/NotificationsPopover.tsx
+++ b/patterns/navigation-layout/src/NotificationsPopover.tsx
@@ -51,7 +51,6 @@ export const NotificationsPopover = forwardRef<ResponsivePopoverDomRef, Notifica
   const [notificationsToday, setTodayNotifications] = useState<Notification[]>(initialNotificationsToday);
   const [notificationsYesterday, setYesterdayNotifications] = useState<Notification[]>(initialNotificationsYesterday);
   const [groupLoading, setGroupLoading] = useState(false);
-  const [showMessageStrip, setShowMessageStrip] = useState(false);
   const [clearAllOpen, setClearAllOpen] = useState(false);
   const [sortMenuOpen, setSortMenuOpen] = useState(false);
 
@@ -129,14 +128,6 @@ export const NotificationsPopover = forwardRef<ResponsivePopoverDomRef, Notifica
               startContent={<Title level="H5">Notifications</Title>}
               endContent={
                 <>
-                  <Button
-                    onClick={() => {
-                      setShowMessageStrip(true);
-                    }}
-                    design="Emphasized"
-                  >
-                    Show M. Strip
-                  </Button>
                   <Button
                     design="Transparent"
                     accessibilityAttributes={{ hasPopup: 'dialog' }}
@@ -159,17 +150,6 @@ export const NotificationsPopover = forwardRef<ResponsivePopoverDomRef, Notifica
                 </>
               }
             />
-            {showMessageStrip && (
-              <MessageStrip
-                className="notificationsMessageStrip"
-                design="Negative"
-                onClose={() => {
-                  setShowMessageStrip(false);
-                }}
-              >
-                Something went wrong.
-              </MessageStrip>
-            )}
           </div>
         }
       >
diff --git a/patterns/navigation-layout/src/index.css b/patterns/navigation-layout/src/index.css
index 32248070a2c..06ca73b17c9 100644
--- a/patterns/navigation-layout/src/index.css
+++ b/patterns/navigation-layout/src/index.css
@@ -50,11 +50,6 @@ body {
   box-shadow: none;
 }
 
-.notificationsMessageStrip {
-  margin: 0.5rem;
-  width: auto;
-}
-
 /* End notifications */
 
 /* User Settings Dialog */

From 84a484b997fd4792e9fbc43173e133b14666e49e Mon Sep 17 00:00:00 2001
From: Lukas Harbarth <lukas.harbarth@sap.com>
Date: Fri, 15 Aug 2025 08:51:21 +0200
Subject: [PATCH 2/2] Update NotificationsPopover.tsx

---
 patterns/navigation-layout/src/NotificationsPopover.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/patterns/navigation-layout/src/NotificationsPopover.tsx b/patterns/navigation-layout/src/NotificationsPopover.tsx
index a492000d103..a2ba1400f34 100644
--- a/patterns/navigation-layout/src/NotificationsPopover.tsx
+++ b/patterns/navigation-layout/src/NotificationsPopover.tsx
@@ -18,7 +18,6 @@ import {
   IllustratedMessage,
   Menu,
   MenuItem,
-  MessageStrip,
   NotificationList,
   NotificationListGroupItem,
   NotificationListItem,