From aa916c8aebaeb94caccc6396b4e767adfe0bff9f Mon Sep 17 00:00:00 2001 From: iris salcedo Date: Mon, 10 Jan 2022 11:42:41 +0100 Subject: [PATCH 1/4] Remove --- .../screens/login/networkSelector/customNode/editMode.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/screens/login/networkSelector/customNode/editMode.js b/src/components/screens/login/networkSelector/customNode/editMode.js index 348c5fa5e1..546d6a4d30 100644 --- a/src/components/screens/login/networkSelector/customNode/editMode.js +++ b/src/components/screens/login/networkSelector/customNode/editMode.js @@ -34,10 +34,11 @@ const EditMode = ({ }); const timeout = useRef(); - const validate = (value) => { + const validate = (input) => { clearTimeout(timeout.current); // validate the URL with debouncer timeout.current = setTimeout(() => { + const value = input.charAt(input.length - 1) === '/' ? input.substring(0, input.length - 1) : input; const normalized = addHttp(value); setLoading(true); validateNode(normalized) From c5ac0157845bfd4a6ddee3540fd419794395c058 Mon Sep 17 00:00:00 2001 From: iris salcedo Date: Mon, 10 Jan 2022 14:43:21 +0100 Subject: [PATCH 2/4] Create removeTrailingSlash function --- .../login/networkSelector/customNode/editMode.js | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/src/components/screens/login/networkSelector/customNode/editMode.js b/src/components/screens/login/networkSelector/customNode/editMode.js index 546d6a4d30..bbd27abbd0 100644 --- a/src/components/screens/login/networkSelector/customNode/editMode.js +++ b/src/components/screens/login/networkSelector/customNode/editMode.js @@ -22,6 +22,16 @@ const validateNode = async (address) => { } }; +const removeTrailingSlash = (input) => { + const bypassStrings = ['http:/', 'http://', 'https:/', 'https://']; + + if (input.charAt(input.length - 1) !== '/' || bypassStrings.includes(input)) { + return input; + } + + return input.substring(0, input.length - 1); +}; + const EditMode = ({ t, setMode, dropdownRef, storedCustomNetwork, networkSelected, customNetworkStored, @@ -38,7 +48,7 @@ const EditMode = ({ clearTimeout(timeout.current); // validate the URL with debouncer timeout.current = setTimeout(() => { - const value = input.charAt(input.length - 1) === '/' ? input.substring(0, input.length - 1) : input; + const value = removeTrailingSlash(input); const normalized = addHttp(value); setLoading(true); validateNode(normalized) From c2cff00e8ff0942c733e14d898392b92ff1d46ec Mon Sep 17 00:00:00 2001 From: iris salcedo Date: Tue, 11 Jan 2022 13:15:45 +0100 Subject: [PATCH 3/4] Use regex and add documentation --- .../networkSelector/customNode/editMode.js | 17 ++++++++++++----- 1 file changed, 12 insertions(+), 5 deletions(-) diff --git a/src/components/screens/login/networkSelector/customNode/editMode.js b/src/components/screens/login/networkSelector/customNode/editMode.js index bbd27abbd0..60d4f61e73 100644 --- a/src/components/screens/login/networkSelector/customNode/editMode.js +++ b/src/components/screens/login/networkSelector/customNode/editMode.js @@ -22,14 +22,21 @@ const validateNode = async (address) => { } }; -const removeTrailingSlash = (input) => { - const bypassStrings = ['http:/', 'http://', 'https:/', 'https://']; +/** + * Removes the trailing slash + * + * @param {string} url - A URL that might end in a slash + * @returns {string} A URL without a trailing slash + */ +const removeTrailingSlash = (url) => { + const regexs = [/http:\/$/, /http:\/\/$/, /https:\/$/, /https:\/\/$/]; + const bypass = regexs.some(regex => regex.test(url)); - if (input.charAt(input.length - 1) !== '/' || bypassStrings.includes(input)) { - return input; + if (url.charAt(url.length - 1) !== '/' || bypass) { + return url; } - return input.substring(0, input.length - 1); + return url.substring(0, url.length - 1); }; const EditMode = ({ From 8d814e3e2fef1e7a21e47b295e7e469383e932ad Mon Sep 17 00:00:00 2001 From: iris salcedo Date: Tue, 11 Jan 2022 14:53:26 +0100 Subject: [PATCH 4/4] Only setAddress for last input --- .../networkSelector/customNode/editMode.js | 37 ++++++++++--------- 1 file changed, 20 insertions(+), 17 deletions(-) diff --git a/src/components/screens/login/networkSelector/customNode/editMode.js b/src/components/screens/login/networkSelector/customNode/editMode.js index 60d4f61e73..028c1b1b18 100644 --- a/src/components/screens/login/networkSelector/customNode/editMode.js +++ b/src/components/screens/login/networkSelector/customNode/editMode.js @@ -23,16 +23,13 @@ const validateNode = async (address) => { }; /** - * Removes the trailing slash + * Removes the trailing slash if string is not exactly equal to 'http:/','http://','https:/' or 'https://' * * @param {string} url - A URL that might end in a slash * @returns {string} A URL without a trailing slash */ const removeTrailingSlash = (url) => { - const regexs = [/http:\/$/, /http:\/\/$/, /https:\/$/, /https:\/\/$/]; - const bypass = regexs.some(regex => regex.test(url)); - - if (url.charAt(url.length - 1) !== '/' || bypass) { + if (url.charAt(url.length - 1) !== '/' || /http(s?):(\/){1,2}$/.test(url)) { return url; } @@ -50,9 +47,11 @@ const EditMode = ({ feedback: '', }); const timeout = useRef(); + const lastInput = useRef(); const validate = (input) => { clearTimeout(timeout.current); + lastInput.current = input; // validate the URL with debouncer timeout.current = setTimeout(() => { const value = removeTrailingSlash(input); @@ -60,20 +59,24 @@ const EditMode = ({ setLoading(true); validateNode(normalized) .then(() => { - setAddress({ - value, - error: 0, - feedback: '', - }); - setLoading(false); + if (input === lastInput.current) { + setAddress({ + value, + error: 0, + feedback: '', + }); + setLoading(false); + } }) .catch(() => { - setAddress({ - value, - error: 1, - feedback: t('Unable to connect to Lisk Service, please check the address and try again'), - }); - setLoading(false); + if (input === lastInput.current) { + setAddress({ + value, + error: 1, + feedback: t('Unable to connect to Lisk Service, please check the address and try again'), + }); + setLoading(false); + } }); }, 500); };