From 058ca28d88f39cace7de67dc6a46a8ab6a3fdf06 Mon Sep 17 00:00:00 2001
From: bo0tzz <git@bo0tzz.me>
Date: Thu, 13 Jun 2024 13:01:18 +0200
Subject: [PATCH] feat(web): Language settings list UX nits (#10261)

* feat(web): Sort language settings list

before: https://bo0.tz/u/xMLnEW.png
after: https://bo0.tz/u/lGLn9h.png

* feat(web): Select combobox text when focused
---
 web/src/lib/components/shared-components/combobox.svelte      | 1 +
 web/src/lib/components/user-settings-page/app-settings.svelte | 4 +++-
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/web/src/lib/components/shared-components/combobox.svelte b/web/src/lib/components/shared-components/combobox.svelte
index 8293eb950a..5024817ef6 100644
--- a/web/src/lib/components/shared-components/combobox.svelte
+++ b/web/src/lib/components/shared-components/combobox.svelte
@@ -59,6 +59,7 @@
 
   const activate = () => {
     isActive = true;
+    input?.select();
     openDropdown();
   };
 
diff --git a/web/src/lib/components/user-settings-page/app-settings.svelte b/web/src/lib/components/user-settings-page/app-settings.svelte
index 9c53fd6a8c..87d8c51f0e 100644
--- a/web/src/lib/components/user-settings-page/app-settings.svelte
+++ b/web/src/lib/components/user-settings-page/app-settings.svelte
@@ -65,7 +65,9 @@
     $locale = $locale ? undefined : fallbackLocale.code;
   };
 
-  const langOptions = langs.map((lang) => ({ label: lang.name, value: lang.code }));
+  const langOptions = langs
+    .map((lang) => ({ label: lang.name, value: lang.code }))
+    .sort((a, b) => a.label.localeCompare(b.label));
   const defaultLangOption = { label: defaultLang.name, value: defaultLang.code };
 
   const handleLanguageChange = async (newLang: string | undefined) => {