Fix native language issue. (zh_Hant)

src/shared/components/person/settings.tsx

@@ -1,5 +1,4 @@
 import { Component, linkEvent } from "inferno";
-import ISO6391 from "iso-639-1";
 import {
   BlockCommunity,
   BlockCommunityResponse,
@@ -32,6 +31,7 @@ import {
   fetchCommunities,
   fetchUsers,
   getLanguage,
+  getNativeLanguageName,
   isBrowser,
   languages,
   personSelectName,
@@ -523,9 +523,11 @@ export class Settings extends Component<any, SettingsState> {
                 <option disabled aria-hidden="true">
                   ──
                 </option>
-                {languages.sort().map(lang => (
+                {languages
+                  .sort((a, b) => a.code.localeCompare(b.code))
+                  .map(lang => (
                     <option value={lang.code}>
-                    {ISO6391.getNativeName(lang.code) || lang.code}
+                      {getNativeLanguageName(lang.code)}
                     </option>
                   ))}
               </select>

src/shared/utils.ts

@@ -1,4 +1,5 @@
 import emojiShortName from "emoji-short-name";
+import ISO6391 from "iso-639-1";
 import {
   BlockCommunityResponse,
   BlockPersonResponse,
@@ -414,6 +415,18 @@ export function debounce(func: any, wait = 1000, immediate = false) {
   };
 }
 
+export function getNativeLanguageName(code: string): string {
+  let [isoCode, qualifier] = code.split("_");
+
+  let native = ISO6391.getNativeName(isoCode) || code;
+
+  if (qualifier) {
+    return `${native}_${qualifier}`;
+  } else {
+    return native;
+  }
+}
+
 // TODO
 export function getLanguage(override?: string): string {
   let myUserInfo = UserService.Instance.myUserInfo;