From 509f7bc1e463eae736c8f7e0825e8694fc1a0ffd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Micha=C5=82=20Kokoci=C5=84ski?= <michal@kokocinski.me>
Date: Thu, 10 Nov 2022 07:42:21 +0100
Subject: [PATCH] Fix country sorting for antd area select. (#67)

* Fix country sorting for antd area select.

* Remove filterSort from AreaSelect lite.
---
 src/area-select.lite.tsx |  3 +--
 src/area-select.tsx      |  3 +--
 src/config.tsx           | 16 +++++++++++++++-
 src/shared.tsx           |  6 ------
 4 files changed, 17 insertions(+), 11 deletions(-)

diff --git a/src/area-select.lite.tsx b/src/area-select.lite.tsx
index 87bba73..207adaf 100644
--- a/src/area-select.lite.tsx
+++ b/src/area-select.lite.tsx
@@ -2,7 +2,7 @@ import Select, { SelectProps } from 'rc-select';
 import { OptionProps } from 'rc-select/es/Option';
 import React, { useContext } from 'react';
 import { configContext } from './config';
-import { filterOption, filterSort } from './shared';
+import { filterOption } from './shared';
 
 export interface AreaSelectProps extends SelectProps<any> {
   optionProps?: OptionProps;
@@ -21,7 +21,6 @@ export const AreaSelect = ({
       dropdownMatchSelectWidth={false}
       optionLabelProp="label"
       filterOption={filterOption}
-      filterSort={filterSort}
       {...selectProps}
     >
       {areas.map((item) => {
diff --git a/src/area-select.tsx b/src/area-select.tsx
index 1257545..b627c9d 100644
--- a/src/area-select.tsx
+++ b/src/area-select.tsx
@@ -2,7 +2,7 @@ import { Select } from 'antd';
 import { OptionProps, SelectProps } from 'antd/es/select';
 import React, { useContext } from 'react';
 import { configContext } from './config';
-import { filterOption, filterSort } from './shared';
+import { filterOption } from './shared';
 
 export interface AreaSelectProps extends SelectProps<any> {
   optionProps?: OptionProps;
@@ -28,7 +28,6 @@ export const AreaSelect = ({
         dropdownMatchSelectWidth={false}
         optionLabelProp="label"
         filterOption={filterOption}
-        filterSort={filterSort}
         {...selectProps}
       >
         {areas.map((item) => {
diff --git a/src/config.tsx b/src/config.tsx
index e792159..fa6c5e2 100644
--- a/src/config.tsx
+++ b/src/config.tsx
@@ -47,13 +47,27 @@ export type AreaMapper = (value: Area, index: number, array: Area[]) => Area;
 export type AreaSorter = (a: Area, b: Area) => number;
 const defaultAreaFilter: AreaFilter = () => true;
 const defaultAreaMapper: AreaMapper = (area) => area;
+const defaultAreaSorter: AreaSorter = (a, b) => {
+  if (a.name && b.name) {
+    const nameA = a.name.toUpperCase();
+    const nameB = b.name.toUpperCase();
+    if (nameA < nameB) {
+      return -1;
+    }
+    if (nameA > nameB) {
+      return 1;
+    }
+    return 0;
+  }
+  return 0;
+};
 
 export const ConfigProvider = ({
   children,
   locale = {},
   areaFilter = defaultAreaFilter,
   areaMapper = defaultAreaMapper,
-  areaSorter,
+  areaSorter = defaultAreaSorter,
 }: {
   children: ReactNode;
   locale?: any;
diff --git a/src/shared.tsx b/src/shared.tsx
index 1c72fc5..2f70b91 100644
--- a/src/shared.tsx
+++ b/src/shared.tsx
@@ -15,12 +15,6 @@ export const filterOption: SelectProps['filterOption'] = (input, option) => {
   return keyHasAllChars;
 };
 
-export const filterSort: SelectProps['filterSort'] = (a, b) => {
-  const keyA = a.key as string;
-  const keyB = b.key as string;
-  return keyA.length - keyB.length;
-};
-
 export const usePhoneInput = ({
   isControlled,
   defaultValue,