From 8e86cce515d5208bbe3dd9b0a23f8794b63c73c2 Mon Sep 17 00:00:00 2001 From: Prince Date: Wed, 26 Jan 2022 15:06:49 +0400 Subject: [PATCH 1/3] update: country components --- src/components/containers/index.js | 3 ++- src/components/containers/visibility.tsx | 10 ++++++++++ 2 files changed, 12 insertions(+), 1 deletion(-) diff --git a/src/components/containers/index.js b/src/components/containers/index.js index 1ce044d1180..ef0ecd52911 100644 --- a/src/components/containers/index.js +++ b/src/components/containers/index.js @@ -8,7 +8,7 @@ import CssGrid, { CssGridColumn } from './css-grid' import SEO from './seo' import Show from './show' import Box from './box' -import { Desktop, Mobile, EU, UK, ROW, NonEU, NonUK } from './visibility' +import { Desktop, Mobile, EU, UK, ROW, NonEU, NonUK, UKEU } from './visibility' export { Container, @@ -26,6 +26,7 @@ export { Mobile, EU, UK, + UKEU, ROW, NonUK, NonEU, diff --git a/src/components/containers/visibility.tsx b/src/components/containers/visibility.tsx index 618dac01a5f..fa2cd342405 100644 --- a/src/components/containers/visibility.tsx +++ b/src/components/containers/visibility.tsx @@ -131,6 +131,16 @@ export const NonUK = ({ children }: ResponsiveContainerProps) => { return !is_uk ? <>{children} : null } +export const UKEU = ({ children }: ResponsiveContainerProps) => { + const { is_uk_domain, is_eu_domain } = domainBasedCheck() + const { is_uk_country, is_eu_country } = React.useContext(DerivStore) + + const is_uk = is_uk_country || is_uk_domain + const is_eu = is_eu_domain || is_eu_country + + return !is_eu && !is_uk ? null : <>{children} +} + export const ROW = ({ children }: ResponsiveContainerProps) => { const { is_uk_domain, is_eu_domain } = domainBasedCheck() const { is_uk_country, is_eu_country } = React.useContext(DerivStore) From 083273e2f6f5c1a5d7a089f68d0498ecc24adc19 Mon Sep 17 00:00:00 2001 From: Prince Date: Thu, 27 Jan 2022 17:41:06 +0400 Subject: [PATCH 2/3] update: location based components --- src/components/containers/visibility.tsx | 54 +++++++++++------------- 1 file changed, 24 insertions(+), 30 deletions(-) diff --git a/src/components/containers/visibility.tsx b/src/components/containers/visibility.tsx index fa2cd342405..fbdbc2d14ec 100644 --- a/src/components/containers/visibility.tsx +++ b/src/components/containers/visibility.tsx @@ -64,6 +64,20 @@ const deviceRenderer = (): boolean => { return is_loaded } +export const getCountryRule = () => { + const { is_eu_domain, is_uk_domain } = domainBasedCheck() + const { is_eu_country, is_uk_country } = React.useContext(DerivStore) + + const is_eu = (is_eu_country || is_eu_domain) && !is_uk_country + const is_uk = is_uk_country || is_uk_domain + const is_non_uk = !is_uk + const is_non_eu = !is_eu + const is_eu_uk = !(!is_eu && !is_uk) + const is_row = !is_eu && !is_uk + + return { is_eu, is_uk, is_non_uk, is_non_eu, is_eu_uk, is_row } +} + export const Desktop = ({ children, breakpoint = DEFAULT_BREAKPOINT, @@ -96,57 +110,37 @@ export const Mobile = ({ children, breakpoint = DEFAULT_BREAKPOINT }: Responsive } export const EU = ({ children }: ResponsiveContainerProps) => { - const { is_eu_domain } = domainBasedCheck() - const { is_eu_country } = React.useContext(DerivStore) - - const is_eu = is_eu_country || is_eu_domain + const { is_eu } = getCountryRule() return is_eu ? <>{children} : null } export const NonEU = ({ children }: ResponsiveContainerProps) => { - const { is_eu_domain } = domainBasedCheck() - const { is_eu_country } = React.useContext(DerivStore) - - const is_eu = is_eu_domain || is_eu_country + const { is_non_eu } = getCountryRule() - return !is_eu ? <>{children} : null + return is_non_eu ? <>{children} : null } export const UK = ({ children }: ResponsiveContainerProps) => { - const { is_uk_domain } = domainBasedCheck() - const { is_uk_country } = React.useContext(DerivStore) - - const is_uk = is_uk_country || is_uk_domain + const { is_uk } = getCountryRule() return is_uk ? <>{children} : null } export const NonUK = ({ children }: ResponsiveContainerProps) => { - const { is_uk_domain } = domainBasedCheck() - const { is_uk_country } = React.useContext(DerivStore) + const { is_non_uk } = getCountryRule() - const is_uk = is_uk_domain || is_uk_country - - return !is_uk ? <>{children} : null + return is_non_uk ? <>{children} : null } export const UKEU = ({ children }: ResponsiveContainerProps) => { - const { is_uk_domain, is_eu_domain } = domainBasedCheck() - const { is_uk_country, is_eu_country } = React.useContext(DerivStore) + const { is_eu_uk } = getCountryRule() - const is_uk = is_uk_country || is_uk_domain - const is_eu = is_eu_domain || is_eu_country - - return !is_eu && !is_uk ? null : <>{children} + return is_eu_uk ? <>{children} : null } export const ROW = ({ children }: ResponsiveContainerProps) => { - const { is_uk_domain, is_eu_domain } = domainBasedCheck() - const { is_uk_country, is_eu_country } = React.useContext(DerivStore) - - const is_uk = is_uk_country || is_uk_domain - const is_eu = is_eu_domain || is_eu_country + const { is_row } = getCountryRule() - return !is_eu && !is_uk ? <>{children} : null + return is_row ? <>{children} : null } From 6ae22f9500de6f6e86929e9f0fe1d4a4a653a09a Mon Sep 17 00:00:00 2001 From: Prince Date: Fri, 28 Jan 2022 15:08:07 +0400 Subject: [PATCH 3/3] update: nitpick --- src/components/containers/visibility.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/containers/visibility.tsx b/src/components/containers/visibility.tsx index fbdbc2d14ec..b8f4ba0e136 100644 --- a/src/components/containers/visibility.tsx +++ b/src/components/containers/visibility.tsx @@ -73,7 +73,7 @@ export const getCountryRule = () => { const is_non_uk = !is_uk const is_non_eu = !is_eu const is_eu_uk = !(!is_eu && !is_uk) - const is_row = !is_eu && !is_uk + const is_row = !is_eu_uk return { is_eu, is_uk, is_non_uk, is_non_eu, is_eu_uk, is_row } }