diff --git a/frontend/realtime/src/KonvaRootComponent/SignaledLoadingIndicator.tsx b/frontend/realtime/src/KonvaRootComponent/SignaledLoadingIndicator.tsx index f67ec2a66d..d2ea3b72c1 100644 --- a/frontend/realtime/src/KonvaRootComponent/SignaledLoadingIndicator.tsx +++ b/frontend/realtime/src/KonvaRootComponent/SignaledLoadingIndicator.tsx @@ -3,6 +3,7 @@ import { LoadingBar, LoadingBarStatus } from "~/components/ui"; import { isLoadingVisible, loadingProgress, + loadingText, } from "~/signals/uiEvents/loadingIndicator"; export const SignaledLoadingIndicator = () => { @@ -10,6 +11,7 @@ export const SignaledLoadingIndicator = () => { useSignalEffect(() => { isLoadingVisible.value; loadingProgress.value; + loadingText.value; }); if (!isLoadingVisible.value) { @@ -47,7 +49,7 @@ export const SignaledLoadingIndicator = () => { className="text-white/90" > - Downloading models - {loadingProgress.value}% + {loadingText.value} - {loadingProgress.value}% ); diff --git a/frontend/realtime/src/signals/uiEvents/loadingIndicator.ts b/frontend/realtime/src/signals/uiEvents/loadingIndicator.ts index 2a5ceae646..23b49d59c1 100644 --- a/frontend/realtime/src/signals/uiEvents/loadingIndicator.ts +++ b/frontend/realtime/src/signals/uiEvents/loadingIndicator.ts @@ -28,13 +28,28 @@ const onLoadingProgressChanged = (callback: (progress: number) => void) => { }); }; +// Loading text signal +export const DEFAULT_LOADING_TEXT = "Downloading"; +export const loadingText = signal(DEFAULT_LOADING_TEXT); +const setLoadingText = (text: string) => { + loadingText.value = text; +}; + +const onLoadingTextChanged = (callback: (text: string) => void) => { + effect(() => { + callback(loadingText.value); + }); +}; + // EXPORTS export const dispatchers = { setIsLoadingVisible, setLoadingProgress, + setLoadingText, }; export const events = { onIsLoadingVisibleChanged, onLoadingProgressChanged, + onLoadingTextChanged, };