Skip to content

Commit

Permalink
#62 Exposed notification API 'add' and 'remove' methods as non-hook f…
Browse files Browse the repository at this point in the history
…unction variants.
  • Loading branch information
lmatejic-CROZ committed Apr 18, 2024
1 parent 29384a0 commit 3e3ba59
Show file tree
Hide file tree
Showing 4 changed files with 25 additions and 7 deletions.
5 changes: 5 additions & 0 deletions .changeset/loud-bees-raise.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@croz/nrich-notification-core": patch
---

Exposed notification API 'add' and 'remove' methods as non-hook function variants.
9 changes: 9 additions & 0 deletions CONTRIBUTING.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,15 @@ Thank you for your interest in contributing to `nrich-frontend`. Anyone is welco

As `nrich-frontend` evolves, the policies described here might change.

## Opening a Pull Request

To contribute to the project, the easiest way would be to fork the repository and open a cross-PR.

Keep in mind that running the `changeset` script is required before merging.

When opening the PR, you will get a template to fill out for easier and systematic descriptions.
The issue resolved by the PR will be mentioned, so keep in mind to have an issue ready before opening the PR.

## Code of conduct

Our [Code of conduct](./CODE_OF_CONDUCT.md) governs this project and everyone participating in it. By participating, you are expected to uphold this code.
12 changes: 6 additions & 6 deletions libs/notification/core/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,22 +2,22 @@

## Overview

`@croz/nrich-notification-core` is a module which serves for showing automatic messages from backend on user interface.
It's a frontend part of [nrich-notification](https://github.com/croz-ltd/nrich/tree/master/nrich-notification) backend module.
`@croz/nrich-notification-core` is a module that is designed for showing automatic messages from the backend on the user interface.
It's the frontend part of [nrich-notification](https://github.com/croz-ltd/nrich/tree/master/nrich-notification) backend module.

Internally, it intercepts http calls and scans for sign of nrich notification object, and shows it if it exists.
Internally, it intercepts http calls and scans for sign of nrich notification object, and shows the notification if it exists.

## Setup

To use this module in your project run `npm install @croz/nrich-notification-core` or `yarn add @croz/nrich-notification-core`

## Usage

1. On top level of your app, register an appropriate interceptor for notifications.
1. On the top level of your app, register an appropriate interceptor for notifications.
- If you use fetch API or a lib that uses fetch internally, use `fetchNotificationInterceptor()`.
- If you use a lib that uses `XMLHttpRequest`, eg. `axios`, use `xhrNotificationInterceptor()`.
- If you use a lib that uses `XMLHttpRequest`, e.g. `axios`, use `xhrNotificationInterceptor()`.

2. Using `useNotification()` custom hook you get an object containing `notifications` array and `remove` and `add` methods for working with that array.
2. Using the `useNotification()` custom hook you get an object containing `notifications` array and `remove` and `add` methods for working with that array. Alternatively, you can use the standalone `removeNotification` and `addNotification` methods if the hook variant is not fit for your use-case.

Example:

Expand Down
6 changes: 5 additions & 1 deletion libs/notification/core/src/store/notification-store.ts
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ export interface NotificationState {
*
* @returns A hook for managing notification state usable in a React environment.
*/
export const useNotificationStore = create<NotificationState>((set) => ({
const store = create<NotificationState>((set) => ({
notifications: [],
add: (notification) => set((state) => ({
notifications: [...state.notifications, { ...notification, timestamp: new Date(notification.timestamp) || new Date() }],
Expand All @@ -55,3 +55,7 @@ export const useNotificationStore = create<NotificationState>((set) => ({
notifications: state.notifications.filter((currentNotification) => currentNotification !== notification),
})),
}));

export const useNotificationStore = store;
export const addNotification = store.getState().add;
export const removeNotification = store.getState().remove;

0 comments on commit 3e3ba59

Please sign in to comment.