Notification-Client Library

Overview

The Notification-Client library is a React-based solution designed to deliver real-time notifications to users in a web application. It integrates with a WebSocket backend (live-notification) to provide instant updates and filters notifications dynamically based on the currently active service within the application.

Key Features

• Real-Time Updates: Utilizes WebSocket technology for immediate delivery of notifications.
• Backend Filtering: The WebSocket backend (live-notification) filters notifications based on user roles and business partners before broadcasting.
• Client-Side Service Filtering: The client filters notifications based on the currently displayed service (URL path).
• Integration: Serves as a wrapper around the main application.

Requirements

The library can be used without any props:

<LiveNotificationContainer>
  {/* Your app content */}
</LiveNotificationContainer>

Optional props:

• useMargin: Boolean to add margin to the container (default: false)
• children: React nodes to be wrapped by the notification container

How It Works

1. Backend Communication (live-notification): Connects to the WebSocket backend to receive live notifications.
2. Backend Filtering: The server filters notifications by user roles and business partners before sending them to the client.
3. Client-Side Filtering: The client filters notifications based on TargetServices matching the current URL path.
4. Local Storage: Tracks read notifications to prevent displaying them again.
5. Seamless Embedding: Acts as a container for the main application, wrapping its content and managing notifications without disrupting the user experience, showing notifications at the top of the screen.