Long-lived loading indicators should display progress

[skivdal]

When the frontend is waiting on data for a panel, a spinning wheel is shown. This is fine for quick tasks, like Metadata, but an annoying user experience for longer tasks, such as Transcription, and Upload or Keyframes for longer videos.

Showing a progress bar instead is more interactive. Instrumentation for this exists in the websocket types, more precisely BackendProgress at

veridash/frontend/src/useBackend.ts

Lines 12 to 14 in af11f03

	export interface BackendProgress extends BackendMessage {
	progress: number;
	}

Hijacking the tqdm library seems like a good option.

• Example for ffmpeg library (Keyframes task): https://github.com/kkroening/ffmpeg-python/blob/master/examples/show_progress.py
• Example for whisper library (Transcription task): How to get the progress bar while transcribing? openai/whisper#850 (comment)
• Example for upload task: https://stackoverflow.com/a/69400632 (XHR part). Will need to be implemented entirely in the frontend.

This might be a good option of how to visualize the loading bar: https://flowbite.com/docs/components/progress/