From 359ece98f99dab22037d5852a49e5e4c537dbfce Mon Sep 17 00:00:00 2001
From: Erik Jan de Wit <erikjan.dewit@gmail.com>
Date: Mon, 3 Jul 2023 15:10:32 +0200
Subject: [PATCH] PR review

---
 js/apps/account-ui/src/api/methods.ts           |  6 +++---
 .../src/personal-info/LocaleSelector.tsx        | 17 +++++++----------
 2 files changed, 10 insertions(+), 13 deletions(-)

diff --git a/js/apps/account-ui/src/api/methods.ts b/js/apps/account-ui/src/api/methods.ts
index 69469882fb3..fe431b23184 100644
--- a/js/apps/account-ui/src/api/methods.ts
+++ b/js/apps/account-ui/src/api/methods.ts
@@ -29,9 +29,9 @@ export async function getPersonalInfo({
   return parseResponse<UserRepresentation>(response);
 }
 
-export async function getSupportedLocales({ signal }: CallOptions = {}): Promise<
-  string[]
-> {
+export async function getSupportedLocales({
+  signal,
+}: CallOptions = {}): Promise<string[]> {
   const response = await request("/supportedLocales", { signal });
   return parseResponse<string[]>(response);
 }
diff --git a/js/apps/account-ui/src/personal-info/LocaleSelector.tsx b/js/apps/account-ui/src/personal-info/LocaleSelector.tsx
index eca6c0d4f5b..1a38ba87e06 100644
--- a/js/apps/account-ui/src/personal-info/LocaleSelector.tsx
+++ b/js/apps/account-ui/src/personal-info/LocaleSelector.tsx
@@ -2,7 +2,7 @@ import { useState } from "react";
 import { useTranslation } from "react-i18next";
 import type { Option } from "ui-shared";
 import { SelectControl } from "ui-shared";
-import { supportedLocales } from "../api/methods";
+import { getSupportedLocales } from "../api/methods";
 import { usePromise } from "../utils/usePromise";
 
 const localeToDisplayName = (locale: string) => {
@@ -18,22 +18,19 @@ export const LocaleSelector = () => {
   const [locales, setLocales] = useState<Option[]>([]);
 
   usePromise(
-    (signal) => supportedLocales({ signal }),
+    (signal) => getSupportedLocales({ signal }),
     (locales) =>
       setLocales(
-        locales.map<Option>(
-          (l) =>
-            ({
-              key: l,
-              value: localeToDisplayName(l),
-            })
-        )
+        locales.map<Option>((locale) => ({
+          key: locale,
+          value: localeToDisplayName(locale) || "",
+        }))
       )
   );
 
   return (
     <SelectControl
-      id="locale-select"
+      data-testid="locale-select"
       name="attributes.locale"
       label={t("selectALocale")}
       controller={{ defaultValue: "" }}