admin-bro/src/frontend/hoc/with-notice.ts

/* eslint-disable @typescript-eslint/explicit-function-return-type */
import { connect } from 'react-redux'
import { addNotice } from '../store/actions/add-notice'

/**
 * NoticeMessage which can be presented as a "Toast" message.
 * @alias NoticeMessage
 * @memberof withNotice
 */
export type NoticeMessage = {
  message: string;
  type?: 'success' | 'error';
}


/**
 * Additional props which are passed to your component
 * @alias AddNoticeProps
 * @memberof withNotice
 */
export type AddNoticeProps = {
  // Function triggering notice messages
  addNotice: (notice: NoticeMessage) => void;
}


const mapDispatchToProps = (dispatch): AddNoticeProps => ({
  addNotice: (notice: NoticeMessage): void => dispatch(addNotice(notice)),
})

/**
 * Higher Order Component which allows you to post notice messages from your components
 *
 * It gives you the additional prop: `addNotice(noticeMessage)` taking {@link NoticeMessage}.
 *
 * ```javascript
 * import { withNotice } from 'admin-bro/core'
 *
 * const MY_MESSAGE = {
 *   message: 'I am toast message',
 *   type: 'success',
 * }
 * const MyCustomComponent = ({ addNotice }) => {
 *   return (
 *     <a onClick={() => addNotice(MY_MESSAGE)}>Click Me</a>
 *   )
 * }
 * export default withNotice(MyCustomComponent)
 * ```
 *
 * @component
 * @subcategory HOC
 */
const withNotice = Component => connect(null, mapDispatchToProps)(Component)

export {
  withNotice as default,
  withNotice,
}