Cannot DIsplay a Snackbar Notice on Button Click – Notice is undefined

I figured it out. The component was not rerendering, when clicking the “Save” button. I included the compose component in the render method and all is working good now:

const Notices = ({ notices, removeNotice }) => {

    const snackbarNotices = notices ? notices.filter((notice) => notice.type === 'snackbar') : [];
    return (
        <>
            <SnackbarList
                className="cwg-admin-notices"
                notices={snackbarNotices}
                onRemove={removeNotice}
            />
        </>
    );
}

const AppNotices = compose(
    withSelect((select) => ({
        notices: select('core/notices').getNotices(),
    })),
    withDispatch((dispatch) => ({
        removeNotice: dispatch('core/notices').removeNotice,
    })),
)(Notices);

—

<Button
   isPrimary
   onClick={() =>
       {
       settings.save();
       dispatch('core/notices')
       .createNotice(
           'success',
           __('Settings Saved', 'slug'),
           {
           type: 'snackbar',
           isDismissible: true,
           icon: <Icon icon="smiley" />
           }
       );
   }}
   >
   {__('Save', 'slug')}
</Button>
<AppNotices/>