From 69c6a4c5b0ddeb5f6c49021bb9907890ec2255b8 Mon Sep 17 00:00:00 2001
From: Likhith Kolayari <98398322+likhith-deriv@users.noreply.github.com>
Date: Wed, 1 Mar 2023 10:32:41 +0400
Subject: [PATCH] likhith/feat:incorporated string normalization to match non
 english characters (#7649)

* feat: :zap: incorporated string normalization to match non english character

* fix: ensuring non english character match

* feat: resolved import issue

* feat: incorporated helper function

* feat: added testcases for helper function

* feat: incorporated helper function to all case

* feat: :art: refactored code

* feat: code refactor

---------

Co-authored-by: Matin shafiei <matin@deriv.com>
Co-authored-by: Carol Sachdeva <58209918+carol-deriv@users.noreply.github.com>
---
 .../components/autocomplete/autocomplete.jsx    |  6 ++++--
 .../components/utils/__tests__/helper.spec.js   | 17 +++++++++++++++++
 packages/components/utils/helper.js             |  8 ++++++++
 3 files changed, 29 insertions(+), 2 deletions(-)
 create mode 100644 packages/components/utils/__tests__/helper.spec.js

diff --git a/packages/components/src/components/autocomplete/autocomplete.jsx b/packages/components/src/components/autocomplete/autocomplete.jsx
index b6b1dfbfa1d0..6c3579f49b4f 100644
--- a/packages/components/src/components/autocomplete/autocomplete.jsx
+++ b/packages/components/src/components/autocomplete/autocomplete.jsx
@@ -6,6 +6,7 @@ import Icon from '../icon';
 import Input from '../input';
 import DropdownList from '../dropdown-list';
 import { useBlockScroll } from '../../hooks/use-blockscroll';
+import { getEnglishCharacters } from '../../../utils/helper';
 
 const KEY_CODE = {
     ENTER: 13,
@@ -23,9 +24,10 @@ const getFilteredItems = (val, list, should_filter_by_char) => {
             is_string_array ? matchStringByChar(item, val) : matchStringByChar(item.text, val)
         );
     }
-
     return list.filter(item =>
-        is_string_array ? item.toLowerCase().includes(val) : item.text.toLowerCase().includes(val)
+        is_string_array
+            ? getEnglishCharacters(item).toLowerCase().includes(val) || item.toLowerCase().includes(val)
+            : getEnglishCharacters(item.text).toLowerCase().includes(val) || item.text.toLowerCase().includes(val)
     );
 };
 const Autocomplete = React.memo(props => {
diff --git a/packages/components/utils/__tests__/helper.spec.js b/packages/components/utils/__tests__/helper.spec.js
new file mode 100644
index 000000000000..b789108a7f08
--- /dev/null
+++ b/packages/components/utils/__tests__/helper.spec.js
@@ -0,0 +1,17 @@
+const { getEnglishCharacters } = require('../helper');
+
+describe('Utility/Helper', () => {
+    it('should return english alphabets removing special characters', () => {
+        const test_input = 'Ai Cập';
+        const test_result = 'Ai Cap';
+
+        expect(getEnglishCharacters(test_input)).toMatch(test_result);
+    });
+
+    it('should return empty string if the text contains no english characters', () => {
+        const test_input = '埃及';
+        const test_result = '';
+
+        expect(getEnglishCharacters(test_input)).toMatch(test_result);
+    });
+});
diff --git a/packages/components/utils/helper.js b/packages/components/utils/helper.js
index b1f02e135520..d4489fad3842 100644
--- a/packages/components/utils/helper.js
+++ b/packages/components/utils/helper.js
@@ -20,8 +20,16 @@ const getPascalCase = str => {
 
 const getFileNameFromPath = path => path.match(/([^/]*)\/*$/)[1].replace('.svg', '');
 
+const getEnglishCharacters = input =>
+    input
+        .normalize('NFD')
+        .split('')
+        .filter(char => /^[a-z ]*$/i.test(char))
+        .join('');
+
 module.exports = {
     getPascalCase,
     getFileNameFromPath,
     getKebabCase,
+    getEnglishCharacters,
 };