Add support for text to speech and speech to text (#863)

- Add support for text to speech, speech to text. Add loading and responsive indicators to reflect state.
- When streaming for speech to text, show incremental transcription in the message input field
- When streaming text to speech, and a pause button in the chat message to allow user to stop playback

src/interface/web/app/components/loading/loading.tsx

@@ -2,6 +2,7 @@ import { CircleNotch } from '@phosphor-icons/react';
 
 interface LoadingProps {
     className?: string;
+    iconClassName?: string;
     message?: string;
 }
 
@@ -17,7 +18,7 @@ export default function Loading(props: LoadingProps) {
 export function InlineLoading(props: LoadingProps) {
     return (
         <button className={`${props.className}`}>
-            <span>{props.message} <CircleNotch className="inline animate-spin h-5 w-5 mx-3" /></span>
+            <span>{props.message} <CircleNotch className={`inline animate-spin ${props.iconClassName ? props.iconClassName : 'h-5 w-5 mx-3'}`}/></span>
         </button>
     )
 }