Thanks to visit codestin.com
Credit goes to github.com

Skip to content
This repository was archived by the owner on May 20, 2025. It is now read-only.

Prince/ visibility component update #2577

Merged
merged 4 commits into from
Jan 29, 2022
Merged

Prince/ visibility component update #2577

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
8e86cce
update: country components
prince-deriv Jan 26, 2022
1e3b2c5
Merge branch 'master' into visibility-component-update
prince-deriv Jan 27, 2022
083273e
update: location based components
prince-deriv Jan 27, 2022
6ae22f9
update: nitpick
prince-deriv Jan 28, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion src/components/containers/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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,
Expand All @@ -26,6 +26,7 @@ export {
Mobile,
EU,
UK,
UKEU,
ROW,
NonUK,
NonEU,
Expand Down
50 changes: 27 additions & 23 deletions src/components/containers/visibility.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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<StoreDataType>(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_uk

return { is_eu, is_uk, is_non_uk, is_non_eu, is_eu_uk, is_row }
}

export const Desktop = ({
children,
breakpoint = DEFAULT_BREAKPOINT,
Expand Down Expand Up @@ -96,47 +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<StoreDataType>(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<StoreDataType>(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<StoreDataType>(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<StoreDataType>(DerivStore)
const { is_non_uk } = getCountryRule()

return is_non_uk ? <>{children}</> : null
}

const is_uk = is_uk_domain || is_uk_country
export const UKEU = ({ children }: ResponsiveContainerProps) => {
const { is_eu_uk } = getCountryRule()

return !is_uk ? <>{children}</> : null
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<StoreDataType>(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
}