diff --git a/invokeai/frontend/web/src/features/modelManagerV2/subpanels/AddModelPanel/HuggingFaceFolder/HFToken.tsx b/invokeai/frontend/web/src/features/modelManagerV2/subpanels/AddModelPanel/HuggingFaceFolder/HFToken.tsx index 7432cff3b0..59cff4b8fe 100644 --- a/invokeai/frontend/web/src/features/modelManagerV2/subpanels/AddModelPanel/HuggingFaceFolder/HFToken.tsx +++ b/invokeai/frontend/web/src/features/modelManagerV2/subpanels/AddModelPanel/HuggingFaceFolder/HFToken.tsx @@ -7,10 +7,10 @@ import { FormHelperText, FormLabel, Input, - useToast, } from '@invoke-ai/ui-library'; import { skipToken } from '@reduxjs/toolkit/query'; import { useFeatureStatus } from 'features/system/hooks/useFeatureStatus'; +import { toast } from 'features/toast/toast'; import type { ChangeEvent } from 'react'; import { useCallback, useMemo, useState } from 'react'; import { useTranslation } from 'react-i18next'; @@ -23,7 +23,6 @@ export const HFToken = () => { const [token, setToken] = useState(''); const { currentData } = useGetHFTokenStatusQuery(isHFTokenEnabled ? undefined : skipToken); const [trigger, { isLoading, isUninitialized }] = useSetHFTokenMutation(); - const toast = useToast(); const onChange = useCallback((e: ChangeEvent) => { setToken(e.target.value); }, []); @@ -41,7 +40,7 @@ export const HFToken = () => { }); } }); - }, [t, toast, token, trigger]); + }, [t, token, trigger]); const error = useMemo(() => { if (!currentData || isUninitialized || isLoading) { diff --git a/invokeai/frontend/web/src/features/toast/toast.ts b/invokeai/frontend/web/src/features/toast/toast.ts index 15db1e052b..6f05476613 100644 --- a/invokeai/frontend/web/src/features/toast/toast.ts +++ b/invokeai/frontend/web/src/features/toast/toast.ts @@ -3,7 +3,7 @@ import { createStandaloneToast, theme, TOAST_OPTIONS } from '@invoke-ai/ui-libra import { nanoid } from 'features/controlLayers/konva/util'; import { map } from 'nanostores'; -const toastApi = createStandaloneToast({ +export const toastApi = createStandaloneToast({ theme: theme, defaultOptions: TOAST_OPTIONS.defaultOptions, }).toast; diff --git a/invokeai/frontend/web/src/services/events/onModelInstallError.tsx b/invokeai/frontend/web/src/services/events/onModelInstallError.tsx index 7ca9211c19..b9ca60df20 100644 --- a/invokeai/frontend/web/src/services/events/onModelInstallError.tsx +++ b/invokeai/frontend/web/src/services/events/onModelInstallError.tsx @@ -1,11 +1,11 @@ -import { Button, ExternalLink, Spinner, Text, useToast } from '@invoke-ai/ui-library'; +import { Button, ExternalLink, Spinner, Text } from '@invoke-ai/ui-library'; import { skipToken } from '@reduxjs/toolkit/query'; import { logger } from 'app/logging/logger'; import type { AppDispatch, RootState } from 'app/store/store'; import { useAppDispatch } from 'app/store/storeHooks'; import { getPrefixedId } from 'features/controlLayers/konva/util'; import { useFeatureStatus } from 'features/system/hooks/useFeatureStatus'; -import { toast } from 'features/toast/toast'; +import { toast, toastApi } from 'features/toast/toast'; import { setActiveTab } from 'features/ui/store/uiSlice'; import { t } from 'i18next'; import { useCallback } from 'react'; @@ -151,12 +151,11 @@ const HFUnauthorizedToastDescription = () => { const { t } = useTranslation(); const dispatch = useAppDispatch(); - const toast = useToast(); const onClick = useCallback(() => { dispatch(setActiveTab('models')); - toast.close(UNAUTHORIZED_TOAST_ID); - }, [dispatch, toast]); + toastApi.close(UNAUTHORIZED_TOAST_ID); + }, [dispatch]); if (!data) { return ;