@jacobii/notifications

@jacobii/notifications

Complex notification system for jacobii apps.

This plugin utilizes react contextApi and creates NotificationsContextProvider to wrap your application with.

Installation

npm install @jacobii/notifications

Import styles from plugin entry point.

/* style.css */

@import '@jacobii/notifications/style';

Basic Usage

// Import the context provider and wrap your application with it:

import { ExampleComponent } from './components/exampleComponent/ExampleComponent';
import { NotificationsContextProvider } from '@jacobii/notifications';

export function App() {
    return (
        <div className="App">
            <NotificationsContextProvider>
                <ExampleComponent />
            </NotificationsContextProvider>
        </div>
    );
}

// Inside your components, you can use the provided methods like addNotification or removeNotifiction:

import { useContext} from 'react';
import { NotificationsContext, NotificationTypes } from '@jacobii/notifications';

export function ExampleComponent() {
    const { addNotification, removeNotification } = useContext(NotificationsContext);
    
    // const addNotification: (message: string, type?: NotificationTypeType, timeout?: number) => string
    // This will create a notification with message, type of succes and timeout of 5 seconds
    // The addNotification function returns the id of the created notification, so you can remove it yourself
    const notificationId = addNotification('My first notification', NotificationTypes.SUCCESS, 5000)
    
    // Remove the notification, if you dont remove it, it will remove itself after the timeout expires
    removeNotification(notificationId)
    
    return (<div>...</div>)
}