Rename chat dialog enhancements

This commit is contained in:
Niek van der Maas 2023-03-20 18:39:03 +01:00
parent da2f4321de
commit 3c3e1013eb
1 changed files with 11 additions and 11 deletions

View File

@ -24,7 +24,7 @@
let input: HTMLTextAreaElement let input: HTMLTextAreaElement
let settings: HTMLDivElement let settings: HTMLDivElement
let chatNameSettings: HTMLDivElement let chatNameSettings: HTMLFormElement
let recognition: any = null let recognition: any = null
let recording = false let recording = false
@ -272,12 +272,12 @@
} }
const showChatNameSettings = () => { const showChatNameSettings = () => {
chatNameSettings.classList.add('is-active') chatNameSettings.classList.add('is-active');
(chatNameSettings.querySelector('#settings-chat-name') as HTMLInputElement).focus()
} }
const saveChatNameSettings = () => { const saveChatNameSettings = () => {
const newChatName = ( const newChatName = (chatNameSettings.querySelector('#settings-chat-name') as HTMLInputElement).value
chatNameSettings.querySelector('#settings-chat-name') as HTMLInputElement
).value
// save if changed // save if changed
if (newChatName && newChatName !== chat.name) { if (newChatName && newChatName !== chat.name) {
chat.name = newChatName chat.name = newChatName
@ -285,6 +285,7 @@
} }
closeChatNameSettings() closeChatNameSettings()
} }
const closeChatNameSettings = () => { const closeChatNameSettings = () => {
chatNameSettings.classList.remove('is-active') chatNameSettings.classList.remove('is-active')
} }
@ -479,6 +480,7 @@
on:keydown={(event) => { on:keydown={(event) => {
if (event.key === 'Escape') { if (event.key === 'Escape') {
closeSettings() closeSettings()
closeChatNameSettings()
} }
}} }}
/> />
@ -532,7 +534,7 @@
</div> </div>
<!-- rename modal --> <!-- rename modal -->
<div class="modal" bind:this={chatNameSettings}> <form class="modal" bind:this={chatNameSettings} on:submit={saveChatNameSettings}>
<!-- svelte-ignore a11y-click-events-have-key-events --> <!-- svelte-ignore a11y-click-events-have-key-events -->
<div class="modal-background" on:click={closeChatNameSettings} /> <div class="modal-background" on:click={closeChatNameSettings} />
<div class="modal-card"> <div class="modal-card">
@ -542,7 +544,7 @@
<section class="modal-card-body"> <section class="modal-card-body">
<div class="field is-horizontal"> <div class="field is-horizontal">
<div class="field-label is-normal"> <div class="field-label is-normal">
<label class="label" for="settings-temperature">New name:</label> <label class="label" for="settings-chat-name">New name:</label>
</div> </div>
<div class="field-body"> <div class="field-body">
<div class="field"> <div class="field">
@ -557,11 +559,9 @@
</div> </div>
</section> </section>
<footer class="modal-card-foot"> <footer class="modal-card-foot">
<button class="button is-info" on:click={saveChatNameSettings} <input type="submit" class="button is-info" value="Save" />
>Save</button
>
<button class="button" on:click={closeChatNameSettings}>Cancel</button> <button class="button" on:click={closeChatNameSettings}>Cancel</button>
</footer> </footer>
</div> </div>
</div> </form>
<!-- end --> <!-- end -->