@wildberries/notifications
![Build Status](https://camo.githubusercontent.com/47995f979bd68532b223f21a970f114fd21ddd2e5dd849a8a7afd7faf046b10b/68747470733a2f2f7472617669732d63692e636f6d2f6d6968616e697a6d35362f6e6f74696669636174696f6e732e7376673f6272616e63683d6d6173746572)
Sollution for notifications, connected with redux
npm install @wildberries/notifications
Connect to your root reducer
import {
notificationsState,
NOTIFICATIONS_REDUCER_NAME,
} from '@wildberries/notifications';
export const rootReducer = {
[NOTIFICATIONS_REDUCER_NAME]: notificationsState,
...other root reducers
};
Insert the Notifications component into your project
import React, { memo } from "react";
import { Notifications } from "@wildberries/notifications";
const TestComponent = memo(() => (
<div className="TestComponent">
<Notifications />
</div>
);
})
Dispatch setModalAction to add notifications modal
- status -
success | error
- modal status (required)
- text -
string
- modal test (required)
- additionalPayload -
string
- payload of additional action if need to call from modal (not required)
- additionalActionType -
any
- type of additional action if need to call from modal (not required)
import React from "react";
import { setModalAction } from "@wildberries/notifications";
import { useDispatch } from "react-redux";
function ExampleComponent() {
const dispatch = useDispatch();
const setModal = () => {
dispatch(setModalAction({
status: 'success',
title: 'modal title',
text: 'modal text',
additionalPayload: { foo:'bar' },
additionalActionType: 'SOME_TYPE',
}))
}
return (
<div className="ExampleComponent">
<button onClick={setModal}>button</button>
</div>
);
}
export default App;