From f11cb7b15ec9333a1fee09c7a9bd7fbfafbbad68 Mon Sep 17 00:00:00 2001
From: gnezim <gnezim@gmail.com>
Date: Wed, 22 Apr 2026 17:21:58 +0300
Subject: [PATCH] =?UTF-8?q?Pin=20'=D0=A0=D0=BE=D1=81=D1=81=D0=B8=D1=8F=20?=
 =?UTF-8?q?=D0=B8=20=D0=A1=D0=9D=D0=93'=20first=20in=20city=20picker=20dir?=
 =?UTF-8?q?ection=20tabs=20(TZ=20=C2=A74.1.9.2)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The dictionary API returns regions in arbitrary order. CityPickerPopup
now sorts them alphabetically by localized name and pulls the
Russia-and-CIS direction to the front — matching the TZ Table 14
listing order. Detection is loose (substring match on 'Россия' /
'Russia' / 'СНГ' / 'CIS') so minor backend renames still pin
correctly.
---
 src/ui/city-autocomplete/CityPickerPopup.tsx | 25 +++++++++++++++++++-
 1 file changed, 24 insertions(+), 1 deletion(-)

diff --git a/src/ui/city-autocomplete/CityPickerPopup.tsx b/src/ui/city-autocomplete/CityPickerPopup.tsx
index 9a074e0a..5224a4bc 100644
--- a/src/ui/city-autocomplete/CityPickerPopup.tsx
+++ b/src/ui/city-autocomplete/CityPickerPopup.tsx
@@ -25,7 +25,30 @@ export const CityPickerPopup: FC<CityPickerPopupProps> = ({
   onLocate,
   onClose,
 }) => {
-  const regions = dictionaries.regions;
+  // TZ §4.1.9.2: "Россия и СНГ" direction pinned first; other directions
+  // alphabetical by localized name. `localeCompare` gives locale-aware
+  // collation; we detect the pinned direction by matching "Россия" /
+  // "Russia" / "CIS" as substrings so minor name variations still match.
+  const regions = useMemo(() => {
+    const sorted = [...dictionaries.regions].sort((a, b) =>
+      a.name.localeCompare(b.name),
+    );
+    const isCisName = (s: string): boolean => {
+      const lower = s.toLowerCase();
+      return (
+        lower.includes("россия") ||
+        lower.includes("russia") ||
+        lower.includes("снг") ||
+        lower.includes("cis")
+      );
+    };
+    const cisIdx = sorted.findIndex((r) => isCisName(r.name));
+    if (cisIdx > 0) {
+      const [cis] = sorted.splice(cisIdx, 1);
+      if (cis) sorted.unshift(cis);
+    }
+    return sorted;
+  }, [dictionaries.regions]);
   const [activeRegionId, setActiveRegionId] = useState<number>(
     regions[0]?.id ?? 0,
   );