add type annotations, improve ui

src/View/ChatPages/messagePage.tsx

@@ -66,7 +66,7 @@ export function MessagePage(
                         </span>
                         <span>
                             <button
-                                class="ghost"
+                                class="ghost inset-outline"
                                 on:click={messagePageViewModel.showFilterModal}
                                 aria-label={
                                     coreViewModel.translations.chatPage.message

src/View/Modals/boardSettingsModal.tsx

@@ -4,11 +4,14 @@ import BoardViewModel from "../../ViewModel/Pages/boardViewModel";
 import { ColorPicker } from "../Components/colorPicker";
 import { DangerousActionButton } from "../Components/dangerousActionButton";
 import CoreViewModel from "../../ViewModel/Global/coreViewModel";
+import { setFocusWithDelay } from "../utility";
 
 export function BoardSettingsModal(
     coreViewModel: CoreViewModel,
     boardViewModel: BoardViewModel,
 ) {
+    boardViewModel.isPresentingSettingsModal.subscribe(setFocusWithDelay);
+
     return (
         <div
             class="modal"
@@ -33,6 +36,7 @@ export function BoardSettingsModal(
                                 }
                             </span>
                             <input
+                                id="focused"
                                 on:enter={boardViewModel.saveSettings}
                                 bind:value={boardViewModel.name}
                             ></input>

src/View/Modals/dataTransferModal.tsx

@@ -450,7 +450,9 @@ function TransferDataInputModal(
                                     }
                                 </span>
                                 <input
-                                    on:enter={fileTransferViewModel.prepareReceivingData}
+                                    on:enter={
+                                        fileTransferViewModel.prepareReceivingData
+                                    }
                                     bind:value={
                                         fileTransferViewModel.receivingTransferChannel
                                     }
@@ -468,7 +470,9 @@ function TransferDataInputModal(
                                     }
                                 </span>
                                 <input
-                                    on:enter={fileTransferViewModel.prepareReceivingData}
+                                    on:enter={
+                                        fileTransferViewModel.prepareReceivingData
+                                    }
                                     bind:value={
                                         fileTransferViewModel.receivingTransferKey
                                     }

src/View/Modals/searchModal.tsx

@@ -28,7 +28,7 @@ export function SearchModal<T>(
                     <h2>{headline}</h2>
                     <div class="flex-row width-input">
                         <input
-                        id="focused"
+                            id="focused"
                             placeholder={
                                 coreViewModel.translations.general.searchLabel
                             }

src/View/utility.ts

@@ -11,7 +11,9 @@ export function reload() {
 }
 
 export function setFocus() {
-    const focusedInModal = document.querySelector(".modal[open] #focused") as HTMLElement;
+    const focusedInModal = document.querySelector(
+        ".modal[open] #focused",
+    ) as HTMLElement;
     if (focusedInModal) return focusedInModal.focus();
     document.getElementById("focused")?.focus();
 }