add setting for primary channel

src/View/ChatPages/settingsPage.tsx

@@ -9,6 +9,30 @@ export function SettingsPage(chatViewModel: ChatViewModel) {
       <div class="toolbar">
         <span>{translations.chatPage.settings.settingsHeadline}</span>
       </div>
+      <div class="content">
+        <label class="tile flex-no">
+          <div>
+            <span>{translations.chatPage.settings.primaryChannelLabel}</span>
+            <input
+              bind:value={chatViewModel.primaryChannelInput}
+              on:enter={chatViewModel.setPrimaryChannel}
+            ></input>
+          </div>
+        </label>
+        <div class="flex-row justify-end width-input">
+          <button
+            class="width-50"
+            aria-label={
+              translations.chatPage.settings.setPrimaryChannelButtonAudioLabel
+            }
+            on:click={chatViewModel.setPrimaryChannel}
+            toggle:disabled={chatViewModel.cannotSetPrimaryChannel}
+          >
+            {translations.general.setButton}
+            <span class="icon">check</span>
+          </button>
+        </div>
+      </div>
     </div>
   );
 }

src/View/chatPage.css

@@ -53,6 +53,8 @@
 
 #chat-page #main .content {
   overflow: auto;
+
+  padding: var(--content-padding);
 }
 
 #chat-page #ribbon,

src/View/homePage.tsx

@@ -106,8 +106,9 @@ export function HomePage(
           class="width-50"
           on:click={settingsViewModel.setName}
           toggle:disabled={settingsViewModel.cannotSetName}
+          aria-label={translations.homePage.setNameButtonAudioLabel}
         >
-          {translations.homePage.setNameButton}
+          {translations.general.setButton}
           <span class="icon">check</span>
         </button>
       </div>

src/View/translations.ts

@@ -2,6 +2,8 @@ const englishTranslations = {
   general: {
     closeButtonAudioLabel: "close",
     deleteItemButtonAudioLabel: "delete item",
+    
+    setButton: "Set",
   },
 
   regional: {
@@ -43,7 +45,7 @@ const englishTranslations = {
 
     yourNameLabel: "Your name",
     yourNamePlaceholder: "Jane Doe",
-    setNameButton: "Set",
+    setNameButtonAudioLabel: "set name",
 
     firstDayOfWeekLabel: "First day of week",
 
@@ -82,6 +84,9 @@ const englishTranslations = {
 
     settings: {
       settingsHeadline: "Settings",
+
+      primaryChannelLabel: "Primary channel",
+      setPrimaryChannelButtonAudioLabel: "set primary channel",
     }
   },
 };