Notistack only showing notification when hmr updates

Question

I have a FitPage component that wraps my pages and use some providers

return (
        <SnackbarProvider>
            <I18nextProvider i18n={i18nFit}>
                <FitMuiProvider>
                    <FitContainer sx={{ backgroundColor: 'background.default', p: 8, pr: 8 }} maxWidth={customMaxWidth}>
                        <div>{children}</div>
                    </FitContainer>
                </FitMuiProvider>
            </I18nextProvider>
        </SnackbarProvider>
    );

and when I am using it and trying to enqueue snackbar toasts with notistack enqueueSnackbar inside my FitTreeListRoot

    return (
        <FitPage>
            {loading && <FitTreeList.Skeleton />}
            {!loading && metodoPagamentos.length === 0 && (
                <FitEmptyList.Root>
                    <FitEmptyList.Title title={t('nenhumMetodo')} />
                </FitEmptyList.Root>
            )}
            {!loading && <FitTreeListRoot {...accordionProps} />}
        </FitPage>
    );

my toasts are not been showed up, but when i do change the FitPage component like this

    return (
        <I18nextProvider i18n={i18nFit}>
            <SnackbarProvider>
                <FitMuiProvider>
                    <FitContainer sx={{ backgroundColor: 'background.default', p: 8, pr: 8 }} maxWidth={customMaxWidth}>
                        <div>{children}</div>
                    </FitContainer>
                </FitMuiProvider>
            </SnackbarProvider>
        </I18nextProvider>
    );

and vite updates my component [vite] hmr update /src/components/pages/FitPage/index.tsx

the toast start to show until I F5 the page

I was trying to show a notification when my submit returns a error but my notification is'nt showing up

In the submit I have a catch that call my showErrorNotification function

export const showNotification = ({
    variant,
    message,
    transitionDuration,
    anchorOrigin,
    autoHideDuration,
}: IShowNotification) => {
    if (!message || message.length === 0) {
        return;
    }
    enqueueSnackbar(message, {
        variant: variant,
        anchorOrigin: anchorOrigin || defaultAnchorOrigin,
        transitionDuration: transitionDuration || defaultTransitionDuration,
        autoHideDuration: autoHideDuration || defaultAutoHideDuration,
        style: style,
    });
};

export const showErrorNotification = (message: string) => {
    showNotification({ message: message, variant: 'error', autoHideDuration: 5000 });
};

PS: the showErrorNotification call is inside the FitTreeListRoot component