Don't allow a prompt to be sent while streaming.

src/lib/Chat.svelte

@@ -57,7 +57,7 @@
   export let params = { chatId: '' }
   const chatId: number = parseInt(params.chatId)
 
-  let updating: boolean = false
+  let updating: boolean|number = false
   let updatingMessage: string = ''
   let input: HTMLTextAreaElement
   let recognition: any = null
@@ -370,11 +370,12 @@
       }
 
       if (opts.streaming) {
+        chatResponse.onFinish(() => { updating = false; updatingMessage = '' })
         fetchEventSource(apiBase + '/v1/chat/completions', {
           ...fetchOptions,
           onmessage (ev) {
             // Remove updating indicator
-            updating = false
+            updating = 1 // hide indicator, but still signal we're updating
             updatingMessage = ''
             if (!chatResponse.hasFinished()) {
               // console.log('ev.data', ev.data)
@@ -403,12 +404,10 @@
         chatResponse.updateFromSyncResponse(json)
       }
     } catch (e) {
-      chatResponse.updateFromError(e.message)
-    }
-
-    // Hide updating bar
       updating = false
       updatingMessage = ''
+      chatResponse.updateFromError(e.message)
+    }
 
     return chatResponse
   }
@@ -559,7 +558,7 @@
 
 <Messages messages={chat.messages} chatId={chatId} />
 
-{#if updating}
+{#if updating === true}
   <article class="message is-success assistant-message">
     <div class="message-body content">
       <span class="is-loading" ></span>
@@ -603,7 +602,7 @@
       <button title="Queue message, don't send yet" class="button is-ghost" on:click|preventDefault={addNewMessage}><span class="icon"><Fa icon={faArrowUpFromBracket} /></span></button>
     </p>
     <p class="control send">
-      <button title="Send" class="button is-info" type="submit"><span class="icon"><Fa icon={faPaperPlane} /></span></button>
+      <button title="Send" class="button is-info" class:is-disabled={updating} type="submit"><span class="icon"><Fa icon={faPaperPlane} /></span></button>
     </p>
   </form>
   <!-- a target to scroll to -->

src/lib/ChatCompletionResponse.svelte

@@ -20,7 +20,6 @@ export class ChatCompletionResponse {
   private messages: Message[]
 
   private error: string
-  private didFinish: boolean
 
   private finishResolver: (value: Message[]) => void
   private errorResolver: (error: string) => void
@@ -32,6 +31,7 @@ export class ChatCompletionResponse {
   private promptTokenCount:number
   private finished = false
   private messageChangeListeners: ((m: Message[]) => void)[] = []
+  private finishListeners: ((m: Message[]) => void)[] = []
 
   setPromptTokenCount (tokens:number) {
     this.promptTokenCount = tokens
@@ -100,6 +100,9 @@ export class ChatCompletionResponse {
   onMessageChange = (listener: (m: Message[]) => void): number =>
     this.messageChangeListeners.push(listener)
 
+  onFinish = (listener: (m: Message[]) => void): number =>
+    this.finishListeners.push(listener)
+
   promiseToFinish = (): Promise<Message[]> => this.finishPromise
 
   hasFinished = (): boolean => this.finished
@@ -114,14 +117,20 @@ export class ChatCompletionResponse {
     })
   }
 
+  private notifyFinish (): void {
+    this.finishListeners.forEach((listener) => {
+      listener(this.messages)
+    })
+  }
+
   private finish = (): void => {
-    if (this.didFinish) return
-    this.didFinish = true
+    if (this.finished) return
+    this.finished = true
     const message = this.messages[0]
     if (message) {
       updateRunningTotal(this.chat.id, message.usage as any, message.model as any)
     }
-    this.finished = true
+    this.notifyFinish()
     if (this.error) {
       this.errorResolver(this.error)
     } else {