{chat.name || `Chat ${chat.id}`}

{#if updating === true}

{updatingMessage}

{/if} {#if chat.messages.length === 0 || (chat.messages.length === 1 && chat.messages[0].role === 'system')} {/if}

submitForm()}>

{ // Only send if Enter is pressed, not Shift+Enter if (e.key === 'Enter' && !e.shiftKey) { e.stopPropagation() submitForm() e.preventDefault() } }} on:input={e => autoGrowInputOnEvent(e)} bind:this={input} /> </p> <p class="control mic" class:is-hidden={!recognition}> <button class="button" class:is-disabled={updating} class:is-pulse={recording} on:click|preventDefault={recordToggle} ><span class="icon"><Fa icon={faMicrophone} /></span></button > </p> <p class="control settings"> <button title="Chat/Profile Settings" class="button" on:click|preventDefault={showSettingsModal}><span class="icon"><Fa icon={faGear} /></span></button> </p> <p class="control queue"> <button title="Queue message, don't send yet" class:is-disabled={updating} class="button is-ghost" on:click|preventDefault={addNewMessage}><span class="icon"><Fa icon={faArrowUpFromBracket} /></span></button> </p> {#if updating} <p class="control send"> <button title="Cancel Response" class="button is-danger" type="button" on:click={() => { controller.abort() }}><span class="icon"><Fa icon={faCommentSlash} /></span></button> </p> {:else} <p class="control send"> <button title="Send" class="button is-info" type="submit"><span class="icon"><Fa icon={faPaperPlane} /></span></button> </p> {/if} </form>  <div class="content has-text-centered running-total-container"> {#each Object.entries(chat.usage || {}) as [model, usage]} <p class="is-size-7 running-totals"> <em>{model}</em> total <span class="has-text-weight-bold">{usage.total_tokens}</span> tokens ~= <span class="has-text-weight-bold">${getPrice(usage, model).toFixed(6)}</span> </p> {/each} </div> </Footer>