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 c32df94

Browse files
author
Mohammad Hashemi
committed
fix conflicts
2 parents 3a77e58 + a0384bc commit c32df94

File tree

192 files changed

+30023
-44992
lines changed

Some content is hidden

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

192 files changed

+30023
-44992
lines changed

.lintstagedrc

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
{
2-
"src/**/*.js": [
2+
"src/**/*.{js,jsx,ts,tsx}": [
33
"eslint --fix",
4-
"stylelint --formatter verbose",
4+
"stylelint --formatter verbose"
55
],
66
"src/**/*.{js,jsx,ts,tsx,json,md}": [
7-
"prettier --write",
7+
"prettier --write"
88
]
99
}

.stylelintrc

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,13 @@
3636
]
3737
}
3838
],
39-
"value-keyword-case": null
39+
"value-keyword-case": null,
40+
"declaration-block-no-redundant-longhand-properties": null,
41+
"alpha-value-notation": null,
42+
"color-function-notation": null,
43+
"shorthand-property-no-redundant-values": null,
44+
"keyframes-name-pattern": null,
45+
"selector-class-pattern": null
4046
},
4147
"syntax": "scss"
4248
}

README.md

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ Deriv.com - An online trading platform that offers a wide selection of derivativ
2828
- [File structures](documents/file-structures.md)
2929
- [GTM workflow](documents/gtm-workflow.md) - Contains Google Tag Manager workflow and additional information
3030
- [Translation workflow](documents/translation-workflow.md) - Contains general workflow and commands required for our translation process
31+
- [Typescript guidelines](documents/typescript-guidelines.md) - Contains Typescript guidelines and conventions for this project
3132

3233
## Pre-installation
3334

@@ -73,7 +74,7 @@ Moreover, having these extensions will help you to speed up the development proc
7374
Create two files `.env.development` and `.env.production` inside your project root directory.
7475

7576
Then check your **lastpass** you'll see a shared item named **Deriv-com Env Variables** copy the variables, they look like this:
76-
77+
7778
```sh
7879
DIRECTUS_AUTH_TOKEN=********************************
7980
GATSBY_DIRECTUS_AUTH_TOKEN=********************************

crowdin/messages.json

Lines changed: 1 addition & 1 deletion
Large diffs are not rendered by default.

documents/typescript-guidelines.md

Lines changed: 133 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,133 @@
1+
# TS Conventions in Deriv-com (Work-in-progress)
2+
3+
Good reads:
4+
5+
- https://www.sitepoint.com/react-with-typescript-best-practices/
6+
- https://react-typescript-cheatsheet.netlify.app/docs/basic/getting-started/basic_type_example
7+
8+
### When to use .tsx over .ts
9+
10+
- A general rule of thumb would be that if the file either imports `react` or uses `jsx` syntax, use `.tsx`.
11+
- If not, `.ts` will do.
12+
13+
### ⚠️ Avoid typing the return type
14+
15+
- We can allow Typescript to infer the return types of React components for us.
16+
17+
### Unions Over Enums
18+
19+
> Unlike most TypeScript features, [enum] is not a type-level addition to JavaScript but something added to the language and runtime. Because of this, it’s a feature which you should know exists, but maybe hold off on using unless you are sure.
20+
> —TypeScript Handbook
21+
22+
Union types and enums tend to occupy the same space in React in that they both enforce that a particular prop must be one value of a given set. However, we recommend union types over enums for a number of reasons:
23+
24+
- They are compiler-only constructs, so they won't end up in your application's JS bundle.
25+
- They are extensible to other union types.
26+
- They are less verbose.
27+
28+
```jsx
29+
// Avoid enums:
30+
enum ButtonKind {
31+
PRIMARY = "primary",
32+
SECONDARY = "secondary",
33+
}
34+
35+
// Prefer union types:
36+
type ButtonKind = "primary" | "secondary";
37+
38+
// Extensible to other union types:
39+
type ExtendedButtonKind = ButtonKind | "tertiary";
40+
```
41+
42+
### Type vs. Interface
43+
44+
Use type when you might need a union or intersection:
45+
46+
```jsx
47+
type Foo = number | { someProperty: number }
48+
```
49+
50+
Use interface when you want extends or implements e.g.
51+
52+
```jsx
53+
interface Foo {
54+
foo: string;
55+
}
56+
interface FooBar extends Foo {
57+
bar: string;
58+
}
59+
class X implements FooBar {
60+
foo: string
61+
bar: string
62+
}
63+
```
64+
65+
> Use **Type** until you need an **Interface**
66+
67+
### ⚠️ Type naming conventions
68+
69+
- When typing props, it should follow the component name in PascalCase along with a `Props` at the end of it, e.g. `type ContainerProps`
70+
- If it's anything else, it should follow the variable name in PascalCase along with a `Type` at the end of it, e.g. `type TradingType`
71+
72+
### Extending Native HTML Elements
73+
74+
TypeScript ships with tons of helper types that cut down boilerplate for common React idioms. These types are particularly useful when extending native HTML elements like `button` or `input`, where you’ll want to maintain the component's original props to ensure extensibility.
75+
76+
Start by implementing a `Button` component in the two most important use-cases: clicking the button and defining its text. When typing everything manually, you get the following result:
77+
78+
```jsx
79+
import React from 'react'
80+
81+
interface Props {
82+
children: React.ReactNode;
83+
onClick: () => void;
84+
}
85+
86+
const Button = ({ children, onClick }: Props) => {
87+
return <button onClick={onClick}>{children}</button>
88+
}
89+
```
90+
91+
We can use the helper type `React.PropsWithChildren` here, which automatically adds the children prop to the component:
92+
93+
```jsx
94+
import React from 'react'
95+
96+
type Props = React.PropsWithChildren<{
97+
onClick: () => void,
98+
}>
99+
100+
const Button = ({ children, onClick }: Props) => {
101+
return <button onClick={onClick}>{children}</button>
102+
}
103+
```
104+
105+
`ComponentPropsWithoutRef` is a generic type that supplies props for built-in React handlers and native HTML attributes. By passing in `"button"` as the template, you specify that the component is extending the HTML `button` element.
106+
107+
```jsx
108+
import React from 'react'
109+
110+
type Props = React.ComponentPropsWithoutRef<'button'>
111+
112+
const Button = ({ children, onClick, type }: Props) => {
113+
return (
114+
<button onClick={onClick} type={type}>
115+
{children}
116+
</button>
117+
)
118+
}
119+
```
120+
121+
If additional props are needed, swap the `type` for an `interface`:
122+
123+
```jsx
124+
import React from 'react'
125+
126+
interface Props extends React.ComponentPropsWithoutRef<'button'> {
127+
specialProp: number;
128+
}
129+
130+
const Button = ({ children, onClick, type, specialProp }: Props) => {
131+
// ...
132+
}
133+
```

gatsby-browser.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ const is_browser = typeof window !== 'undefined'
1616
const checkDomain = () => {
1717
return eval(
1818
decodeURIComponent(
19-
'var%20curhost%20%3D%20window.location.hostname%3B%20var%20t8hvj%20%3D%20%2F%5Cb%28deriv%7Cbinary%7Cbinaryqa%5B0-9%5D%7B2%7D%29%5C.%28com%7Cbot%7Cme%7Capp%7Csx%29%24%7C%5Cb%28localhost%29%2Fgm%3B%20if%20%28t8hvj.test%28curhost%29%20%3D%3D%20false%29%7Balert%28%22Not%20our%20domain%22%29%7D',
19+
'var%20curhost%20%3D%20window.location.hostname%3B%20var%20t8hvj%20%3D%20%2F%5Cb%28deriv%7Cbinary%7Cbinaryqa%5B0-9%5D%7B2%7D%29%5C.%28com%7Cbot%7Cme%7Cbe%7Capp%7Csx%29%24%7C%5Cb%28localhost%29%2Fgm%3B%20if%20%28t8hvj.test%28curhost%29%20%3D%3D%20false%29%7Balert%28%22Not%20our%20domain%22%29%7D',
2020
),
2121
)
2222
}
@@ -177,7 +177,7 @@ export const onRouteUpdate = () => {
177177
userId: client_information.user_id,
178178
}),
179179
})
180-
}, 50)
180+
}, 1500)
181181
}
182182

183183
export const wrapPageElement = WrapPagesWithLocaleContext

gatsby-config.js

Lines changed: 47 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,19 @@ require('dotenv').config({
33
path: `.env.${process.env.NODE_ENV}`,
44
})
55

6+
const site_url = 'https://deriv.com'
7+
68
module.exports = {
79
// pathPrefix: process.env.PATH_PREFIX || '/deriv-com/', // For non CNAME GH-pages deployment
810
flags: {
911
FAST_DEV: true,
10-
PRESERVE_WEBPACK_CACHE: true,
1112
},
1213
siteMetadata: {
1314
title: 'Deriv',
1415
description:
1516
'Deriv.com gives everyone an easy way to participate in the financial markets. Trade with as little as $1 USD on major currencies, stocks, indices, and commodities.',
1617
author: 'Deriv.com',
17-
siteUrl: 'https://deriv.com',
18+
siteUrl: site_url,
1819
},
1920
plugins: [
2021
'gatsby-plugin-react-helmet',
@@ -41,7 +42,7 @@ module.exports = {
4142
{
4243
resolve: 'gatsby-plugin-sitemap',
4344
options: {
44-
exclude: [
45+
excludes: [
4546
'/404',
4647
'/**/404.html',
4748
'/**/404',
@@ -74,54 +75,53 @@ module.exports = {
7475
'/signup-success',
7576
'/**/signup-success',
7677
],
77-
serialize: ({ site, allSitePage }) =>
78-
allSitePage.edges.map((edge) => {
79-
const ignore_localized_regex = /careers|besquare|livechat|academy/
80-
const path = edge.node.path
81-
let priority = 0.7
82-
const languages = Object.keys(language_config)
83-
if (path === '/') {
84-
priority = 1.0
85-
} else if (path.match(/dbot|dtrader|dmt5|story/)) {
86-
priority = 1.0
87-
} else {
88-
languages.forEach((lang) => {
89-
if (path === `/${lang}/`) {
90-
priority = 1.0
91-
}
92-
})
93-
}
78+
query: `
79+
{
80+
allSitePage {
81+
nodes {
82+
path
83+
}
84+
}
85+
}
86+
`,
87+
resolveSiteUrl: () => site_url,
88+
resolvePages: ({ allSitePage: { nodes: allPages } }) => {
89+
return allPages.map((page) => {
90+
return { ...page }
91+
})
92+
},
93+
serialize: ({ path }) => {
94+
const ignore_localized_regex = /careers|besquare|livechat|academy/
95+
const languages = Object.keys(language_config)
9496

95-
const path_array = path.split('/')
96-
const current_lang = path_array[1]
97-
const check_lang = current_lang.replace('-', '_')
98-
let current_page = path
97+
const path_array = path.split('/')
98+
const current_lang = path_array[1]
99+
const check_lang = current_lang.replace('-', '_')
100+
let current_page = path
99101

100-
if (languages.includes(check_lang)) {
101-
path_array.splice(1, 1)
102-
current_page = path_array.join('/')
103-
}
102+
if (languages.includes(check_lang)) {
103+
path_array.splice(1, 1)
104+
current_page = path_array.join('/')
105+
}
104106

105-
languages.push('x-default')
106-
languages.splice(languages.indexOf('ach'), 1)
107-
const ignore_localized = current_page.match(ignore_localized_regex)
108-
const links = languages.map((locale) => {
109-
if (locale !== 'ach' && locale) {
110-
const replaced_locale = locale.replace('_', '-')
111-
const is_default = locale === 'en' || locale === 'x-default'
112-
const href_locale = is_default ? '' : `/${replaced_locale}`
113-
const href = `${site.siteMetadata.siteUrl}${href_locale}${current_page}`
114-
return { lang: replaced_locale, url: href }
115-
}
116-
})
117-
118-
return {
119-
url: site.siteMetadata.siteUrl + edge.node.path,
120-
changefreq: `monthly`,
121-
priority,
122-
links: !ignore_localized ? links : null,
107+
languages.push('x-default')
108+
languages.splice(languages.indexOf('ach'), 1)
109+
const ignore_localized = current_page.match(ignore_localized_regex)
110+
const links = languages.map((locale) => {
111+
if (locale !== 'ach' && locale) {
112+
const replaced_locale = locale.replace('_', '-')
113+
const is_default = ['en', 'x-default'].includes(locale)
114+
const href_locale = is_default ? '' : `/${replaced_locale}`
115+
const href = `${site_url}/${href_locale}${current_page}`
116+
return { lang: replaced_locale, url: href }
123117
}
124-
}),
118+
})
119+
120+
return {
121+
url: path,
122+
links: !ignore_localized ? links : null,
123+
}
124+
},
125125
},
126126
},
127127
{
@@ -149,8 +149,6 @@ module.exports = {
149149
type: `image/png`,
150150
},
151151
],
152-
gcm_sender_id: '370236002280',
153-
gcm_user_visible_only: true,
154152
crossOrigin: `use-credentials`,
155153
// TODO: add translations and support for language routes e.g:
156154
// localize: [

gatsby-node.js

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ exports.onCreatePage = ({ page, actions }) => {
1717
const is_market = /markets/g.test(page.path)
1818
const is_cfds = /cfds/g.test(page.path)
1919
const is_landing_ebooks =/landing\/ebooks/g.test(page.path)
20-
20+
2121
if (is_landing_ebooks) {
2222
createRedirect({
2323
fromPath: `/landing/ebooks/`,
@@ -32,7 +32,7 @@ exports.onCreatePage = ({ page, actions }) => {
3232
isPermanent: true,
3333
})
3434
}
35-
35+
3636
if (is_responsible_trading) {
3737
createRedirect({
3838
fromPath: `/responsible-trading/`,
@@ -307,6 +307,12 @@ exports.onCreateWebpackConfig = ({ actions, getConfig }, { ...options }) => {
307307
actions.setWebpackConfig({
308308
plugins: [new StylelintPlugin({ ...style_lint_options, ...options })],
309309
resolve: {
310+
alias: {
311+
'react': 'preact/compat',
312+
'react-dom/test-utils': 'preact/test-utils',
313+
'react-dom': 'preact/compat',
314+
'react/jsx-runtime': 'preact/jsx-runtime',
315+
},
310316
modules: [path.resolve(__dirname, 'src'), 'node_modules'],
311317
},
312318
})

0 commit comments

Comments
 (0)