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.

Commit 7f5ab36

Browse files
mohammad-hashemi-derivmohammad-hashemi-deriv
authored
MohammadH/Update assets information second changes (#2626)
* apply all changes according to Asset gaps pdf. only icons remained. * add: all svg icons and update accoring files * update eu changes * update: uk assets information * add UKEU component to visibility * minify svgs * fix: UK version problems * fix: few bugs on EU version * fix: remove cryptocurrency tab in uk market * update symbols and add EU crypto items * fix nzd-cad icon and remove micro-pairs from UK * remove commodities options from UK * add forex to noneu and nonuk * separate cfds minor pairs from options minor pairs * remove synthetic and crypto from uk * remove synthetic indices and cryptocurrency from off-convas-menu and navbar * merge eu uk forex cfds since the are the same * add crypto-pairs icons to svg foler * add import and export for all added crypto pairs icons in symbols.js * add all crypto pairs icons to the site * minify all crypto pair svgs * add ava-usd and ter-usd to cryptocurrency * remove crypto and synthetic from footer and other-markets in uk version * rearrange all market names alphabetically * rename cryptocurrency to crypto pairs in cfd trading * remove synthetic indices from trade-types-multiplier page in uk version * remove duplicate cad-chf from forex minor pairs and replace chf-jpy * add uk_markets array to othermarkets * remove navigate-replace from crypto and synthetic page in uk version * cleaner map in _energy.js and use desktop and mobile component instead of show in _synthetic-indices.tsx * minify svgs * fix: space between other markets cards in UK version * fix: unresovled conflicts which didn't allow project to run * revert: remove image-not-available.png * fix: update assets description * fix: incorrect asset added to Options synthetic indices. * fix: duplicate instruments on row forex page * fix: empty energy list in comodities * fix: add 300 ticks to crash boom row description * fix: in uk remove synthetic indices from description * fix: remove synthetic indices from trade-types page available markets * fix: remove duplicate 'and' words * fix: replace germany 30 by germany 40 in description * fix: remove everything according to germany 30 * fix: remove synthetic indices and crypto from uk available markets * refactor: hardcoded available markets component to dynamic components * fix: other carousel issues after previous changes * trigger vercel * remove cr crash-boom 300 * feat: remove jump indices from eu and add metals for eu * remove oil/usd from cr * style: add 2px x-padding for volatility indices * fix: markets tab scroll offset in mobile uk * fix: add crash boom 300 to cr * fix: bring back oil/usd to energy cr * fix: remove crash boom from multipliers taab * fix: energy under cfds tab and options tab are different now * feat: add xalusd xcuusd xniusd xpbusd xznusd to metals * fix: zinc typo * fix: remove 5 metals from options * fix: update crash/boom * fix: now metal cfds are the same in all regions * fix: volatility 200, 300 icon in eu region * fix: trade-types multiplier crash boom description in cr * fix: typo in crash boom description * fix: update crash boom 300 icon and remove old icons from src * fix: remove 200s 300s from countinous indices description * chore: add crash boom 300 to CR * fix: crash boom in cfds is now different than multipliers * fix: remove crash boom 300 from trade-types/multiplier page * fix: crash boom in eu trader tools shows 300 now * fix: rename airbnb to airbnb inc * chore: update graphql.types.ts * fix: update other stock names * fix: stocks order by alphabet * chore: refactor to use the latest features of visibility.tsx
1 parent 89be2e3 commit 7f5ab36

File tree

150 files changed

+6880
-5087
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

150 files changed

+6880
-5087
lines changed

‎package-lock.json

Lines changed: 4785 additions & 4298 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/common/constants.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,9 @@ const getDomainAppID = () => {
2727
else return deriv_com_app_id
2828
}
2929

30+
export const eu_domains = ['eu', 'staging-eu']
31+
export const uk_domains = ['uk', 'staging-uk']
32+
3033
// URL
3134
export const domain_full_url = `https://${getDomainUrl()}`
3235
export const deriv_app_id = getDomainAppID()

‎src/components/containers/index.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import CssGrid, { CssGridColumn } from './css-grid'
88
import SEO from './seo'
99
import Show from './show'
1010
import Box from './box'
11-
import { Desktop, Mobile, EU, UK, ROW, NonEU, NonUK } from './visibility'
11+
import { Desktop, Mobile, EU, UK, ROW, NonEU, NonUK, UKEU } from './visibility'
1212

1313
export {
1414
Container,
@@ -26,6 +26,7 @@ export {
2626
Mobile,
2727
EU,
2828
UK,
29+
UKEU,
2930
ROW,
3031
NonUK,
3132
NonEU,

‎src/components/containers/visibility.tsx

Lines changed: 35 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
1-
import React, { ReactElement, useEffect, useState } from 'react'
1+
import React, { ReactElement, useEffect, useState, useContext } from 'react'
22
import styled from 'styled-components'
33
import { size } from 'themes/device'
44
import { useBrowserResize } from 'components/hooks/use-browser-resize'
55
import { DerivStore } from 'store'
6+
import { eu_domains, uk_domains } from 'common/constants'
67

78
type ResponsiveContainerProps = {
89
children: ReactElement
@@ -26,6 +27,7 @@ const DesktopLayer = styled.div<LayerProps>`
2627
display: none;
2728
}
2829
`
30+
2931
const MobileLayer = styled.div<LayerProps>`
3032
@media (min-width: ${({ breakpoint }) => breakpoint}px) {
3133
display: none;
@@ -38,11 +40,12 @@ const domainBasedCheck = () => {
3840

3941
useEffect(() => {
4042
if (window) {
41-
const host_name = window.location.hostname
42-
if (host_name.includes('eu')) {
43+
const subdomain = window.location.hostname.split('.').slice(0, -2).join('.')
44+
45+
if (eu_domains.includes(subdomain)) {
4346
setEuDomain(true)
4447
}
45-
if (host_name.includes('uk')) {
48+
if (uk_domains.includes(subdomain)) {
4649
setUkDomain(true)
4750
}
4851
}
@@ -65,6 +68,20 @@ const deviceRenderer = (): boolean => {
6568
return is_loaded
6669
}
6770

71+
export const getCountryRule = () => {
72+
const { is_eu_domain, is_uk_domain } = domainBasedCheck()
73+
const { is_eu_country, is_uk_country } = useContext<StoreDataType>(DerivStore)
74+
75+
const is_eu = (is_eu_country || is_eu_domain) && !is_uk_country
76+
const is_uk = is_uk_country || is_uk_domain
77+
const is_non_uk = !is_uk
78+
const is_non_eu = !is_eu
79+
const is_eu_uk = !(!is_eu && !is_uk)
80+
const is_row = !is_eu_uk
81+
82+
return { is_eu, is_uk, is_non_uk, is_non_eu, is_eu_uk, is_row }
83+
}
84+
6885
export const Desktop = ({
6986
children,
7087
breakpoint = DEFAULT_BREAKPOINT,
@@ -74,7 +91,7 @@ export const Desktop = ({
7491
const [is_mobile] = useBrowserResize(breakpoint_size)
7592
const is_loaded = deviceRenderer()
7693

77-
const desktop_view = is_mobile ? <></> : <div className={className}>{children}</div>
94+
const desktop_view = is_mobile ? <></> : <>{children}</>
7895

7996
return is_loaded ? (
8097
desktop_view
@@ -102,47 +119,37 @@ export const Mobile = ({
102119
}
103120

104121
export const EU = ({ children }: ResponsiveContainerProps) => {
105-
const { is_eu_domain } = domainBasedCheck()
106-
const { is_eu_country } = React.useContext<StoreDataType>(DerivStore)
107-
108-
const is_eu = is_eu_country || is_eu_domain
122+
const { is_eu } = getCountryRule()
109123

110124
return is_eu ? <>{children}</> : null
111125
}
112126

113127
export const NonEU = ({ children }: ResponsiveContainerProps) => {
114-
const { is_eu_domain } = domainBasedCheck()
115-
const { is_eu_country } = React.useContext<StoreDataType>(DerivStore)
128+
const { is_non_eu } = getCountryRule()
116129

117-
const is_eu = is_eu_domain || is_eu_country
118-
119-
return !is_eu ? <>{children}</> : null
130+
return is_non_eu ? <>{children}</> : null
120131
}
121132

122133
export const UK = ({ children }: ResponsiveContainerProps) => {
123-
const { is_uk_domain } = domainBasedCheck()
124-
const { is_uk_country } = React.useContext<StoreDataType>(DerivStore)
125-
126-
const is_uk = is_uk_country || is_uk_domain
134+
const { is_uk } = getCountryRule()
127135

128136
return is_uk ? <>{children}</> : null
129137
}
130138

131139
export const NonUK = ({ children }: ResponsiveContainerProps) => {
132-
const { is_uk_domain } = domainBasedCheck()
133-
const { is_uk_country } = React.useContext<StoreDataType>(DerivStore)
140+
const { is_non_uk } = getCountryRule()
134141

135-
const is_uk = is_uk_domain || is_uk_country
142+
return is_non_uk ? <>{children}</> : null
143+
}
136144

137-
return !is_uk ? <>{children}</> : null
145+
export const UKEU = ({ children }: ResponsiveContainerProps) => {
146+
const { is_eu_uk } = getCountryRule()
147+
148+
return is_eu_uk ? <>{children}</> : null
138149
}
139150

140151
export const ROW = ({ children }: ResponsiveContainerProps) => {
141-
const { is_uk_domain, is_eu_domain } = domainBasedCheck()
142-
const { is_uk_country, is_eu_country } = React.useContext<StoreDataType>(DerivStore)
143-
144-
const is_uk = is_uk_country || is_uk_domain
145-
const is_eu = is_eu_domain || is_eu_country
152+
const { is_row } = getCountryRule()
146153

147-
return !is_eu && !is_uk ? <>{children}</> : null
154+
return is_row ? <>{children}</> : null
148155
}

‎src/components/custom/other-platforms.js

Lines changed: 65 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React from 'react'
22
import PropTypes from 'prop-types'
33
import styled, { css } from 'styled-components'
4-
import { SectionContainer, Flex, FlexGridContainer, EU, NonEU } from 'components/containers'
4+
import { SectionContainer, Flex, FlexGridContainer, EU, NonEU, ROW } from 'components/containers'
55
import {
66
Text,
77
Card,
@@ -12,6 +12,7 @@ import {
1212
Divider,
1313
} from 'components/elements'
1414
import { localize, LocalizedLink, Localize } from 'components/localization'
15+
import { getCountryRule } from 'components/containers/visibility'
1516
import { binary_bot_url } from 'common/constants'
1617
import device from 'themes/device'
1718
// icons
@@ -286,7 +287,7 @@ export const NavPlatform = ({ onClick, is_ppc, is_ppc_redirect }) => {
286287
onClick={onClick}
287288
to="/trade-types/cfds/"
288289
/>
289-
<NonEU>
290+
<ROW>
290291
<NavCard
291292
aria_label="Options"
292293
icon={() => <img src={Options} alt="" width="32" height="32" />}
@@ -297,7 +298,7 @@ export const NavPlatform = ({ onClick, is_ppc, is_ppc_redirect }) => {
297298
onClick={onClick}
298299
to="/trade-types/options/"
299300
/>
300-
</NonEU>
301+
</ROW>
301302
<NavCard
302303
aria_label="Multipliers"
303304
icon={() => <img src={Multipliers} alt="" width="32" height="32" />}
@@ -324,7 +325,7 @@ export const NavPlatform = ({ onClick, is_ppc, is_ppc_redirect }) => {
324325
onClick={onClick}
325326
to={is_ppc_redirect ? '/landing/dmt5/' : '/dmt5/'}
326327
/>
327-
<NonEU>
328+
<ROW>
328329
<>
329330
<NavCard
330331
aria_label="Derivx"
@@ -351,7 +352,7 @@ export const NavPlatform = ({ onClick, is_ppc, is_ppc_redirect }) => {
351352
otherLinkProps={{ rel: 'noopener noreferrer' }}
352353
/>
353354
</>
354-
</NonEU>
355+
</ROW>
355356
</Flex>
356357
<Flex direction="column" wrap="wrap" jc="flex-start">
357358
<EmptySpace />
@@ -365,7 +366,7 @@ export const NavPlatform = ({ onClick, is_ppc, is_ppc_redirect }) => {
365366
onClick={onClick}
366367
to="/dtrader/"
367368
/>
368-
<NonEU>
369+
<ROW>
369370
<>
370371
<NavCard
371372
aria_label="Deriv GO"
@@ -401,7 +402,7 @@ export const NavPlatform = ({ onClick, is_ppc, is_ppc_redirect }) => {
401402
otherLinkProps={{ rel: 'noopener noreferrer' }}
402403
/>
403404
</>
404-
</NonEU>
405+
</ROW>
405406
</Flex>
406407
</Flex>
407408
)
@@ -413,62 +414,68 @@ NavPlatform.propTypes = {
413414
onClick: PropTypes.func,
414415
}
415416

416-
export const NavMarket = ({ onClick, is_ppc }) => (
417-
<Flex direction="column" wrap="wrap" jc="flex-start">
418-
<NavCard
419-
aria_label="Forex"
420-
icon={() => <img src={Forex} alt="" width="32" height="32" />}
421-
content={
422-
<Localize translate_text="Trade the world’s largest financial market with popular forex pairs." />
423-
}
424-
title={<Localize translate_text="Forex" />}
425-
onClick={onClick}
426-
to="/markets/forex/"
427-
/>
428-
{!is_ppc && (
417+
export const NavMarket = ({ onClick, is_ppc }) => {
418+
const { is_not_uk } = getCountryRule()
419+
420+
return (
421+
<Flex direction="column" wrap="wrap" jc="flex-start">
429422
<NavCard
430-
aria_label="Synthetic indices"
431-
icon={() => <img src={SyntheticIndices} alt="" width="32" height="32" />}
423+
aria_label="Forex"
424+
icon={() => <img src={Forex} alt="" width="32" height="32" />}
432425
content={
433-
<Localize translate_text="Enjoy synthetic markets that emulate real-world market movements." />
426+
<Localize translate_text="Trade the world’s largest financial market with popular forex pairs." />
434427
}
435-
title={<Localize translate_text="Synthetic indices" />}
428+
title={<Localize translate_text="Forex" />}
436429
onClick={onClick}
437-
to="/markets/synthetic/"
430+
to="/markets/forex/"
438431
/>
439-
)}
440-
<NavCard
441-
aria_label="Stocks & indices"
442-
icon={() => <img src={StockIndices} alt="" width="32" height="32" />}
443-
content={
444-
<Localize translate_text="Predict broader market trends and diversify your risk with stocks & indices." />
445-
}
446-
title={<Localize translate_text="Stocks & indices" />}
447-
onClick={onClick}
448-
to="/markets/stock/"
449-
/>
450-
<NavCard
451-
aria_label="Cryptocurrencies"
452-
icon={() => <img src={Cryptocurrencies} alt="" width="32" height="32" />}
453-
content={
454-
<Localize translate_text="Trade with leverage on the price movement of popular crypto-fiat pairs." />
455-
}
456-
title={<Localize translate_text="Cryptocurrencies" />}
457-
onClick={onClick}
458-
to="/markets/cryptocurrencies/"
459-
/>
460-
<NavCard
461-
aria_label="Commodities"
462-
icon={() => <img src={Commodities} alt="" width="32" height="32" />}
463-
content={
464-
<Localize translate_text="Trade natural resources that are central to the world's economy." />
465-
}
466-
title={<Localize translate_text="Commodities" />}
467-
onClick={onClick}
468-
to="/markets/commodities/"
469-
/>
470-
</Flex>
471-
)
432+
{!is_ppc && is_not_uk && (
433+
<NavCard
434+
aria_label="Synthetic indices"
435+
icon={() => <img src={SyntheticIndices} alt="" width="32" height="32" />}
436+
content={
437+
<Localize translate_text="Enjoy synthetic markets that emulate real-world market movements." />
438+
}
439+
title={<Localize translate_text="Synthetic indices" />}
440+
onClick={onClick}
441+
to="/markets/synthetic/"
442+
/>
443+
)}
444+
<NavCard
445+
aria_label="Stocks & indices"
446+
icon={() => <img src={StockIndices} alt="" width="32" height="32" />}
447+
content={
448+
<Localize translate_text="Predict broader market trends and diversify your risk with stocks & indices." />
449+
}
450+
title={<Localize translate_text="Stocks & indices" />}
451+
onClick={onClick}
452+
to="/markets/stock/"
453+
/>
454+
{is_not_uk && (
455+
<NavCard
456+
aria_label="Cryptocurrencies"
457+
icon={() => <img src={Cryptocurrencies} alt="" width="32" height="32" />}
458+
content={
459+
<Localize translate_text="Trade with leverage on the price movement of popular crypto-fiat pairs." />
460+
}
461+
title={<Localize translate_text="Cryptocurrencies" />}
462+
onClick={onClick}
463+
to="/markets/cryptocurrencies/"
464+
/>
465+
)}
466+
<NavCard
467+
aria_label="Commodities"
468+
icon={() => <img src={Commodities} alt="" width="32" height="32" />}
469+
content={
470+
<Localize translate_text="Trade natural resources that are central to the world's economy." />
471+
}
472+
title={<Localize translate_text="Commodities" />}
473+
onClick={onClick}
474+
to="/markets/commodities/"
475+
/>
476+
</Flex>
477+
)
478+
}
472479

473480
NavMarket.propTypes = {
474481
is_ppc: PropTypes.bool,

‎src/components/elements/carousel/carousel.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -140,7 +140,6 @@ export const Carousel = ({
140140
chevron_style || {}
141141
const is_arrow = prevBtnEnabled || nextBtnEnabled
142142
const { nav_color, bottom_offset, height } = navigation_style || {}
143-
144143
return (
145144
<div style={container_style}>
146145
<Embla>

0 commit comments

Comments
 (0)