added loading indicator text

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"
           ></path>
         </svg>
-        Downloading models - {loadingProgress.value}%
+        {loadingText.value} - {loadingProgress.value}%
       </div>
     </div>
   );

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<string>(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,
 };