From 3e3ba590a6a45ce62c89b3f5aea3487024c45f68 Mon Sep 17 00:00:00 2001 From: lmatejic Date: Thu, 18 Apr 2024 10:59:22 +0200 Subject: [PATCH] #62 Exposed notification API 'add' and 'remove' methods as non-hook function variants. --- .changeset/loud-bees-raise.md | 5 +++++ CONTRIBUTING.md | 9 +++++++++ libs/notification/core/README.md | 12 ++++++------ .../core/src/store/notification-store.ts | 6 +++++- 4 files changed, 25 insertions(+), 7 deletions(-) create mode 100644 .changeset/loud-bees-raise.md diff --git a/.changeset/loud-bees-raise.md b/.changeset/loud-bees-raise.md new file mode 100644 index 0000000..7478265 --- /dev/null +++ b/.changeset/loud-bees-raise.md @@ -0,0 +1,5 @@ +--- +"@croz/nrich-notification-core": patch +--- + +Exposed notification API 'add' and 'remove' methods as non-hook function variants. diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 2b795fa..294e293 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -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. diff --git a/libs/notification/core/README.md b/libs/notification/core/README.md index 3872a94..562c02d 100644 --- a/libs/notification/core/README.md +++ b/libs/notification/core/README.md @@ -2,10 +2,10 @@ ## 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 @@ -13,11 +13,11 @@ To use this module in your project run `npm install @croz/nrich-notification-cor ## 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: diff --git a/libs/notification/core/src/store/notification-store.ts b/libs/notification/core/src/store/notification-store.ts index ac223ce..a39bf79 100644 --- a/libs/notification/core/src/store/notification-store.ts +++ b/libs/notification/core/src/store/notification-store.ts @@ -46,7 +46,7 @@ export interface NotificationState { * * @returns A hook for managing notification state usable in a React environment. */ -export const useNotificationStore = create((set) => ({ +const store = create((set) => ({ notifications: [], add: (notification) => set((state) => ({ notifications: [...state.notifications, { ...notification, timestamp: new Date(notification.timestamp) || new Date() }], @@ -55,3 +55,7 @@ export const useNotificationStore = create((set) => ({ notifications: state.notifications.filter((currentNotification) => currentNotification !== notification), })), })); + +export const useNotificationStore = store; +export const addNotification = store.getState().add; +export const removeNotification = store.getState().remove;