Skip to content

Commit

Permalink
chore: inprogress of adding link (binary-com#6159)
Browse files Browse the repository at this point in the history 
* chore: inprogress of adding link

* chore: fixed link component issue

* chore: added keys for new tab redirection

* chore: updated key

* chore: updated nav data for UE

* chore: updated footer and header nav

* chore: added target blank condition

* chore: chore updated target blank in data

---------

Co-authored-by: Fasih Ali <[email protected]>
  • Loading branch information
@fasihali-deriv
fasihali-deriv and Fasih Ali authored Dec 11, 2023
1 parent a47345d commit 303b5e2
Show file tree
Hide file tree
Showing 26 changed files with 695 additions and 87 deletions.
16 changes: 8 additions & 8 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 2 additions & 2 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,10 @@
"dependencies": {
"@artsy/fresnel": "^6.2.1",
"@builder.io/partytown": "^0.8.1",
"@deriv-com/blocks": "^0.41.0",
"@deriv-com/blocks": "^0.42.0",
"@deriv-com/components": "^0.26.0",
"@deriv-com/hooks": "^0.9.0",
"@deriv-com/providers": "^0.9.0",
"@deriv-com/providers": "^0.10.0",
"@deriv/analytics": "^1.4.3",
"@deriv/deriv-api": "^1.0.13",
"@deriv/quill-design": "^1.2.6",
Expand Down
60 changes: 32 additions & 28 deletions src/features/pages/home/footer/banner-and-awards.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,42 +5,46 @@ import { DerivProductDerivGoBrandLightLogoHorizontalIcon } from '@deriv/quill-ic
import { StaticImage } from 'gatsby-plugin-image'
import DownloadBadges from './download'
import { Localize, localize } from 'components/localization'
import useRegion from 'components/hooks/use-region'

export const DerivGoBannerAndAwards = () => {
const { is_row } = useRegion()
return (
<div className="flex flex-col gap-gap-lg">
<div className="flex lg:flex-col gap-gap-lg rounded-lg border-solid border-xs border-opacity-black-100 p-general-md">
<div className="flex flex-col gap-gap-md max-lg:flex-1 max-lg:justify-center">
<div className="flex flex-col gap-gap-md">
<div className="flex items-center gap-gap-md">
<DerivProductDerivGoBrandLightLogoHorizontalIcon
width={24}
height={24}
/>
<Heading.H5>
<Localize translate_text="_t_Deriv GO_t_" />
</Heading.H5>
{is_row && (
<div className="flex lg:flex-col gap-gap-lg rounded-lg border-solid border-xs border-opacity-black-100 p-general-md">
<div className="flex flex-col gap-gap-md max-lg:flex-1 max-lg:justify-center">
<div className="flex flex-col gap-gap-md">
<div className="flex items-center gap-gap-md">
<DerivProductDerivGoBrandLightLogoHorizontalIcon
width={24}
height={24}
/>
<Heading.H5>
<Localize translate_text="_t_Deriv GO_t_" />
</Heading.H5>
</div>
<Text size="sm">
<Localize translate_text="_t_Trade multipliers on our mobile app._t_" />
</Text>
</div>
<Text size="sm">
<Localize translate_text="_t_Trade multipliers on our mobile app._t_" />
</Text>
</div>

<div className="flex items-center gap-gap-md rounded-md border-solid border-[0.5px] border-opacity-black-200 p-general-sm max-sm:hidden">
<StaticImage
src="../../../../images/common/migration/footer/deriv-go-qr.png"
alt={localize('_t_download deriv-go_t_')}
height={64}
width={64}
placeholder="none"
/>
<CaptionText className="text-typography-default">
<Localize translate_text="_t_Scan to download_t_" />
</CaptionText>
<div className="flex items-center gap-gap-md rounded-md border-solid border-[0.5px] border-opacity-black-200 p-general-sm max-sm:hidden">
<StaticImage
src="../../../../images/common/migration/footer/deriv-go-qr.png"
alt={localize('_t_download deriv-go_t_')}
height={64}
width={64}
placeholder="none"
/>
<CaptionText className="text-typography-default">
<Localize translate_text="_t_Scan to download_t_" />
</CaptionText>
</div>
</div>
<DownloadBadges />
</div>
<DownloadBadges />
</div>
)}
<div className="rounded-lg border-solid border-xs border-opacity-black-100 p-general-md">
<div className="flex justify-center">
<StaticImage
Expand Down
223 changes: 222 additions & 1 deletion src/features/pages/home/footer/data.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import {
import { DerivGoBannerAndAwards } from './banner-and-awards'
import { Localize } from 'components/localization'

export const footerNavData: FooterItems[] = [
export const RowFooterNavData: FooterItems[] = [
{
id: 0,
layers: [
Expand Down Expand Up @@ -149,12 +149,14 @@ export const footerNavData: FooterItems[] = [
id: 5,
href: 'https://smarttrader.deriv.com/',
text: <Localize translate_text="_t_SmartTrader_t_" />,
target: '_blank',
},
{ id: 6, href: '/dbot', text: <Localize translate_text="_t_Deriv Bot_t_" /> },
{
id: 7,
href: 'https://bot.deriv.com/',
text: <Localize translate_text="_t_Binary Bot_t_" />,
target: '_blank',
},
],
},
Expand Down Expand Up @@ -263,6 +265,225 @@ export const footerNavData: FooterItems[] = [
},
]

export const EuFooterNavData: FooterItems[] = [
{
id: 0,
layers: [
{
id: 0,
header: <Localize translate_text="_t_ABOUT US_t_" />,
type: 'link',
items: [
{
id: 0,
href: '/who-we-are',
text: <Localize translate_text="_t_Who we are_t_" />,
},
{
id: 1,
href: '/why-choose-us',
text: <Localize translate_text="_t_Why choose us_t_" />,
},
{
id: 3,
href: '/our-principles',
text: <Localize translate_text="_t_Our principles_t_" />,
},
{
id: 4,
href: '/partners',
text: <Localize translate_text="_t_Partnership programmes_t_" />,
},
{
id: 5,
href: '/contact_us',
text: <Localize translate_text="_t_Contact us_t_" />,
},
{ id: 6, href: '/careers', text: <Localize translate_text="_t_Careers_t_" /> },
{
id: 7,
href: 'https://derivlife.com',
text: <Localize translate_text="_t_Deriv life_t_" />,
},
],
},
],
},
{
id: 1,
layers: [
{
id: 0,
header: <Localize translate_text="_t_TRADE TYPES_t_" />,
type: 'link',
items: [
{
id: 0,
href: '/trade-types/cfds',
text: <Localize translate_text="_t_CFDs_t_" />,
},
{
id: 1,
href: '/trade-types/multiplier',
text: <Localize translate_text="_t_Multipliers_t_" />,
},
],
},
{
id: 1,
header: <Localize translate_text="_t_MARKETS_t_" />,
type: 'link',
items: [
{
id: 0,
href: '/markets/forex',
text: <Localize translate_text="_t_Forex_t_" />,
},
{
id: 1,
href: '/markets/synthetic',
text: <Localize translate_text="_t_Derived indices_t_" />,
},
{
id: 2,
href: '/markets/stock',
text: <Localize translate_text="_t_Stocks & indices_t_" />,
},
{
id: 3,
href: '/markets/exchange-traded-funds',
text: <Localize translate_text="_t_ETFs_t_" />,
},
{
id: 4,
href: '/markets/cryptocurrencies',
text: <Localize translate_text="_t_Cryptocurrencies_t_" />,
},
{
id: 5,
href: '/markets/commodities',
text: <Localize translate_text="_t_Commodities_t_" />,
},
],
},
],
},
{
id: 2,
layers: [
{
id: 0,
header: <Localize translate_text="_t_PLATFORMS_t_" />,
type: 'link',
items: [
{ id: 0, href: '/dmt5', text: <Localize translate_text="_t_Deriv MT5_t_" /> },
{
id: 1,
href: '/dtrader',
text: <Localize translate_text="_t_Deriv Trader_t_" />,
},
],
},
],
},
{
id: 3,
layers: [
{
id: 0,
header: <Localize translate_text="_t_SUPPORT_t_" />,
type: 'link',
items: [
{
id: 0,
href: '/help-centre',
text: <Localize translate_text="_t_Help centre_t_" />,
},
{
id: 1,
href: 'https://community.deriv.com/',
text: <Localize translate_text="_t_Community_t_" />,
},
{
id: 2,
href: '/payment-methods',
text: <Localize translate_text="_t_Payment methods_t_" />,
},
{
id: 3,
href: 'https://deriv.statuspage.io/',
text: <Localize translate_text="_t_Status page_t_" />,
},
{
id: 4,
href: 'https://blog.deriv.com/',
text: <Localize translate_text="_t_Deriv Blog_t_" />,
},
],
},
],
},
{
id: 4,
layers: [
{
id: 0,
header: <Localize translate_text="_t_LEGAL_t_" />,
type: 'link',
items: [
{
id: 0,
href: '/regulatory',
text: <Localize translate_text="_t_Regulatory information_t_" />,
},
{
id: 1,
href: '/terms-and-conditions',
text: <Localize translate_text="_t_Terms & conditions_t_" />,
},
{
id: 2,
href: '/responsible',
text: <Localize translate_text="_t_Secure & responsible trading_t_" />,
},
],
},
{
id: 1,
header: <Localize translate_text="_t_PARTNERS_t_" />,
type: 'link',
items: [
{
id: 0,
href: '/partners/deriv-prime',
text: <Localize translate_text="_t_Deriv Prime_t_" />,
},
{
id: 1,
href: '/partners/affiliate-ib',
text: <Localize translate_text="_t_Affiliates_t_" />,
},
{
id: 3,
href: 'https://api.deriv.com/',
text: <Localize translate_text="_t_API_t_" />,
},
],
},
],
},
{
id: 5,
layers: [
{
id: 0,
type: 'node',
node: <DerivGoBannerAndAwards />,
},
],
},
]

export const warnText = (
<Localize translate_text="_t_CFDs and other products offered on this website are complex instruments with high risk of losing money rapidly owing to leverage. You should consider whether you understand how these products work and whether you can afford to risk losing your money._t_" />
)
Expand Down
6 changes: 4 additions & 2 deletions src/features/pages/home/footer/index.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,18 +1,20 @@
import React from 'react'
import { Footer } from '@deriv-com/blocks'
import { footerNavData, socialButtons, warnText } from './data'
import { EuFooterNavData, RowFooterNavData, socialButtons, warnText } from './data'
import { DerivGoBannerAndAwards } from './banner-and-awards'
import { DescriptionContent } from './description'
import useRegion from 'components/hooks/use-region'

export const ROWFooter = () => {
const { is_eu } = useRegion()
return (
<Footer.FooterBlock
warningText={warnText}
socialButtons={socialButtons}
bannerAndAwards={DerivGoBannerAndAwards}
descriptionContent={DescriptionContent}
>
<Footer.MainNavContent items={footerNavData} cols="six" />
<Footer.MainNavContent items={is_eu ? EuFooterNavData : RowFooterNavData} cols="six" />
</Footer.FooterBlock>
)
}
Expand Down
Loading

0 comments on commit 303b5e2

Please sign in to comment.