Can't close the notistack when set the action option ?

[160905]

import React, { Fragment } from 'react';
import { useSnackbar } from 'notistack';
import { IconButton } from '@material-ui/core';
import { HighlightOffOutlined } from '@material-ui/icons';
import { connect } from 'umi';

let displayed: Array<string | number> = [];

interface NotifierProps {
  dispatch: (arg: { type: string; key: number }) => void;
  notifications: Array<any>;
}

const Notifier: React.FC<NotifierProps> = (props) => {
  const { dispatch, notifications } = props;

  const { enqueueSnackbar, closeSnackbar } = useSnackbar();

  const storeDisplayed = (id: number) => {
    displayed = [...displayed, id];
  };

  const removeDisplayed = (id: number) => {
    displayed = [...displayed.filter((key) => id !== key)];
  };

  React.useEffect(() => {
    const action = (key: number | string) => (
      <Fragment>
        <IconButton size="small" onClick={() => closeSnackbar(key)} component="span">
          <HighlightOffOutlined fontSize="small" style={{ color: 'white' }} />
        </IconButton>
      </Fragment>
    );

    notifications.forEach(({ key, message, options = {}, dismissed = false }) => {
      if (dismissed) {
        closeSnackbar(key);
        return;
      }

      if (displayed.includes(key)) return;

      enqueueSnackbar(message, {
        key,
        ...options,
        action,
        persist: false,
        onClose: (event, reason, myKey) => {
          if (options.onClose) {
            options.onClose(event, reason, myKey);
          }
        },
        onExited: (event, myKey: number) => {
          dispatch({ type: 'notistack/REMOVE_SNACKBAR', key: myKey });
          removeDisplayed(myKey);
        },
      });

      storeDisplayed(key);
    });
  }, [notifications, closeSnackbar, enqueueSnackbar, dispatch]);

  return null;
};

export default connect((storeState: any) => ({
  notifications: storeState.notistack.notifications,
}))(Notifier);

At this version
"notistack": "^1.0.9"

[160905]

this is my git adress https://gitlab.com/zhuzhennan/link-admin

[debajit-saha]

I am also facing the same issue. It works with Material UI 4.11.4 but not with the latest version 4.12.0.

[iamhosseindhv]

You can use npm i notistack@next for now, or wait until #408 is merged and published.

[160905]

When i use yarn add notistack@next and it work already. Thanks

[Thuplek]

#407 (comment)