From 99d00ec670e7001920bfc97dad938ca7d90f0810 Mon Sep 17 00:00:00 2001 From: aswathy-deriv Date: Tue, 20 Feb 2024 09:01:55 +0400 Subject: [PATCH] fix: changed the url flow for academy signup flow --- crowdin/messages.json | 1 + .../hooks/use-residence-list/index.tsx | 31 ++++++------ .../residence-form.tsx | 49 ++++++++++++++----- .../index.tsx | 0 .../signup => academy-signup}/index.tsx | 0 5 files changed, 54 insertions(+), 27 deletions(-) rename src/pages/{academy/completesignup => academy-complete-signup}/index.tsx (100%) rename src/pages/{academy/signup => academy-signup}/index.tsx (100%) diff --git a/crowdin/messages.json b/crowdin/messages.json index c700102b437..f02d3686145 100644 --- a/crowdin/messages.json +++ b/crowdin/messages.json @@ -1813,6 +1813,7 @@ "1673505406": "An impersonator’s main goal is to steal your sensitive information and funds.", "1673824550": "Minimum stake", "1674164323": "<0>With a x500 multiplier, if the market goes down 2%, you'll <1>lose only $100. An automatic stop out kicks in if your loss reaches your stake amount.", + "1674319947": "Unfortunately, Deriv is not available in this country.", "1674798397": "Trade multipliers on our mobile app.", "1676292946": "Forex trading gives you the chance to profit from changes in the relative values of currencies on the forex market.", "1677027187": "Forex", diff --git a/src/features/hooks/use-residence-list/index.tsx b/src/features/hooks/use-residence-list/index.tsx index 5493372e307..0521e347890 100644 --- a/src/features/hooks/use-residence-list/index.tsx +++ b/src/features/hooks/use-residence-list/index.tsx @@ -18,14 +18,23 @@ const formatResidenceList = ({ } return residences .filter(({ text: name }) => !restricted.includes(name)) - .map(({ text: display_name, text: name, value: symbol, phone_idd: prefix }) => { - return { - name, - display_name, - symbol, - prefix, - } - }) + .map( + ({ + text: display_name, + text: name, + value: symbol, + phone_idd: prefix, + disabled: disabled, + }) => { + return { + name, + display_name, + symbol, + prefix, + disabled, + } + }, + ) } export const useResidenceList = ({ @@ -34,13 +43,7 @@ export const useResidenceList = ({ restricted_countries?: ['Iran', 'North Korea', 'Myanmar (Burma)', 'Syria', 'Cuba'] } = {}) => { const { send, data } = useWS('residence_list') - // console.log( - // data.map((item) => { - // if (item.disabled === 'DISABLED') { - // } - // }), - // ) useEffect(() => { send() }, [send]) diff --git a/src/features/pages/signup-academy-complete/residence-form.tsx b/src/features/pages/signup-academy-complete/residence-form.tsx index ecf3b4d2c5b..f7c10a263c2 100644 --- a/src/features/pages/signup-academy-complete/residence-form.tsx +++ b/src/features/pages/signup-academy-complete/residence-form.tsx @@ -1,4 +1,4 @@ -import React from 'react' +import React, { useState } from 'react' import styled from 'styled-components' import { next_btn } from './signup-academy.module.scss' import { DropdownSearch } from 'components/elements' @@ -30,6 +30,7 @@ type CountryType = { name: string display_name: string value: string + disabled: string } type HandleNextType = () => void @@ -50,6 +51,21 @@ const ResidenceForm = ({ setSelectedValue, }: ResidenceFormProps) => { const { country, citizenship } = selected_value + const [errors, setErrors] = useState(false) + + const handleSelection = (country) => { + const is_country_disabled = residence_list.filter((item) => country.name === item.name)?.[0] + ?.disabled + setSelectedValue((prevState) => ({ + ...prevState, + country: country, + })) + if (is_country_disabled) { + setErrors(true) + } else { + setErrors(false) + } + } const form_inputs = [ { @@ -61,6 +77,7 @@ const ResidenceForm = ({ placeholder_message: localize( '_t_Country of residence is where you currently live._t_', ), + error_message: '_t_Unfortunately, Deriv is not available in this country._t_', }, { id: 'dm-citizenship-select', @@ -73,7 +90,7 @@ const ResidenceForm = ({ ), }, ] - + console.log(residence_list) return ( @@ -93,17 +110,23 @@ const ResidenceForm = ({ items={item.list} selected_item={country} mb="5px" - onChange={(country) => { - setSelectedValue((prevState) => ({ - ...prevState, - country: country, - })) - }} + onChange={(country) => handleSelection(country)} style={{ marginTop: '16px' }} /> - - - + {errors && ( + + + + )} + {!errors && ( + + + + )} ) } else { @@ -124,7 +147,7 @@ const ResidenceForm = ({ }} style={{ marginTop: '16px' }} /> - + @@ -134,7 +157,7 @@ const ResidenceForm = ({
diff --git a/src/pages/academy/completesignup/index.tsx b/src/pages/academy-complete-signup/index.tsx similarity index 100% rename from src/pages/academy/completesignup/index.tsx rename to src/pages/academy-complete-signup/index.tsx diff --git a/src/pages/academy/signup/index.tsx b/src/pages/academy-signup/index.tsx similarity index 100% rename from src/pages/academy/signup/index.tsx rename to src/pages/academy-signup/index.tsx