How to use the redux-react-hook.useDispatch function in redux-react-hook

export default function BaseLayout(props) {
    const store = useContext(StoreContext)
    const { isLogin } = store.getState().toJS().global
    const dispatch = useDispatch()

    const pathname = props.location.pathname
    // 初始化state
    const initalState = {
        currentMenu: formatSecondMenu(pathname),
        menuData: {
            theme: 'dark', // 菜单主题色
            defaultSelectedKeys: pathname, // 当前默认值
            mode: 'inline', // 菜单模式
            defaultOpenKeys: formatFirstMenu(pathname),
            list: userData
        }
    }
    const [state, setState] = useState(initalState)
    const { menuData, currentMenu } = state
    const { history } = props

const Packages = props => {
  const { packages, mode, directory } = useMappedState(mapState);
  const dispatch = useDispatch();

  const [newPackages, error] = useIpc(
    'ipc-event',
    merge(options, {
      mode,
      directory
    })
  );

  if (error) {
    console.error(error);
  }

  useEffect(
    () => {
      if (typeof newPackages === 'string' && !Boolean(newPackages.length)) {

const Audit = ({ classes }) => {
  const { loading, message, mode, result } = useMappedState(mapState);
  const [metadataValues, setMetadata] = useState({
    dependencies: 0,
    devDependencies: 0,
    optionalDependencies: 0,
    vulnerabilities: null,
    advisories: null
  });
  const dispatch = useDispatch();
  const { content, error } = result || {};

  const auditRun = option =>
    dispatch(
      runAudit({
        ipcEvent: 'npm-audit',
        cmd: ['audit'],
        options: {
          flag: option || false
        }
      })
    );

  const dialogText = mode === 'global' ? iMessage('warning', 'noGlobalAudit') : iMessage('info', 'npmAuditInfo');
  const dialogActionText = iMessage('action', 'runAudit');

const AuditOptions = ({ classes, packagesInstallOptions, selected }) => {
  const dispatch = useDispatch();

  return (
    <div>
      
        {INFO_MESSAGES.fixOptions}
      
      
      
        
          package-lock only
            }
          /&gt;
          
        </div>

packagesInstallOptions,
    active,
    operationStatus,
    operationPackages,
    operationCommand,
  } = useMappedState(mapState);

  const [options, toggleOptions] = useState({
    open: false,
    single: false,
    name: null,
    version: null
  });
  const [filteredByNamePackages, setFilteredByNamePackages] = useState([]);
  const wrapperRef = useRef(null);
  const dispatch = useDispatch();

  const reload = useCallback(() => {
    dispatch(setActivePage({ page: 'packages', paused: false }));
    dispatch(
      setPackagesStart({
        channel: 'npm-list-outdated',
        options: {
          cmd: ['outdated', 'list']
        }
      })
    );
  }, [dispatch]);

  const switchModeHandler = useCallback((appMode, appDirectory) => {
    dispatch(setMode({ mode: appMode, directory: appDirectory }));
    dispatch(setActivePage({ page: 'packages', paused: false }));

export function useAppThunkDispatch() {
  return useDispatch() as AppThunkDispatch
}

const AppLayout = ({ classes }) => {
  const { activePage, snackbar } = useMappedState(mapState);
  const dispatch = useDispatch();

  const onClose = useCallback(() =>
    dispatch(
      setSnackbar({
        ...snackbar,
        open: false,
        message: null,
        type: 'info',
        hideOnClose: false
      })
    ), [dispatch, snackbar]);

  const { hideOnClose } = snackbar;

  return (

const NotificationsList = ({ classes }) => {
  const { notifications } = useMappedState(mapState);
  const dispatch = useDispatch();

  const onSearchHandler = packageName => {
    dispatch(clearFilters());

    dispatch({
      type: setActivePage.type,
      payload: {
        page: 'packages',
        paused: true
      }
    });

    dispatch(
      setPackagesSearch({
        channel: 'npm-search',
        options: {

const useNotificationHandlers = () => {
  const intl = useIntl()
  const dispatch = useDispatch()
  return React.useMemo(
    () => ({
      onAuthLost: () => {
        dispatch(notify(intl.formatMessage(msg.notificationAuthLost)))
      },
    }),
    [intl, dispatch],
  )
}

notifications,
    loading,
    activePage
  } = useMappedState(mapState);

  const [initFlow, toggleInitFlow] = useState({
    show: false,
    directory: null
  })
  const [dialog, setDialog] = useState({
    open: false,
    title: '',
    active: null
  });

  const dispatch = useDispatch();

  const onLoadDirectory = useCallback(() => {
    const dialogHandler = filePath => {
      dispatch(
        setActivePage({
          page: 'packages',
          paused: false
        })
      );
      dispatch(setMode({ mode: 'local', directory: filePath.join('') }));
    };

    return showDialog(dialogHandler, { mode: 'file', ...navigatorParameters });
  }, [dispatch]);

  const closeDialog = useCallback(() => {