Skip to content

Commit

Permalink
[account-v2]/likhith/chore: initial setup (binary-com#12315)
Browse files Browse the repository at this point in the history
* chore: initial setup

* chore: initial setup

* chore: configured webpack

* fix: changed lint rules

* chore: incorporated build config

* chore: added stylelint file

* chore: updated stylelint

* refactor: incorporated review comments

* fix: reverted webpack types

* fix: build issue

* chore: added libs

* Likhith webpack to ts (#62)

* chore: added sonarlint rules

* chore: added a test component

* chore: webpack config refactor

* fix: removed test component

* chore: copied tailwind from tradershub

* fix: dependency version mismatch

* fix: added feaure-flag to guard route

* chore: fix type of build

* feat: added quill icons lib

---------

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>

* fix: removed unused external

* fix: sonarlint issues

* fix: build issue

---------

Co-authored-by: “yauheni-kryzhyk-deriv” <“yauheni@deriv.me”>
Co-authored-by: yauheni-deriv <103182683+yauheni-deriv@users.noreply.github.com>
  • Loading branch information
3 people committed Dec 29, 2023
1 parent 2ce67f8 commit 37c8084
Show file tree
Hide file tree
Showing 38 changed files with 852 additions and 79 deletions.
6 changes: 6 additions & 0 deletions .github/workflows/test.yml
Original file line number Diff line number Diff line change
Expand Up @@ -33,12 +33,18 @@ jobs:
run: npx tsc --project packages/wallets/tsconfig.json -noEmit
- name: Check TypeScript for @deriv/tradershub
run: npx tsc --project packages/tradershub/tsconfig.json -noEmit
- name: Check TypeScript for @deriv/account-v2
run: npx tsc --project packages/account-v2/tsconfig.json -noEmit
- name: Check ESLint for @deriv/wallets
run: npx eslint --fix --ignore-path packages/wallets/.eslintignore --config packages/wallets/.eslintrc.js packages/wallets
- name: Check ESLint for @deriv/tradershub
run: npx eslint --fix --ignore-path packages/tradershub/.eslintignore --config packages/tradershub/.eslintrc.js packages/tradershub
- name: Check ESLint for @deriv/account-v2
run: npx eslint --fix --ignore-path packages/account-v2/.eslintignore --config packages/account-v2/.eslintrc.js packages/account-v2
- name: Check Stylelint for @deriv/wallets
run: npx stylelint packages/wallets/**/*.scss
- name: Check Stylelint for @deriv/account-v2
run: npx stylelint packages/account-v2/**/*.scss
- name: Check tests for @deriv/hooks
run: bash ./scripts/check-tests.sh packages/hooks/src
- name: Check tests for @deriv/utils
Expand Down
362 changes: 286 additions & 76 deletions package-lock.json

Large diffs are not rendered by default.

2 changes: 2 additions & 0 deletions packages/account-v2/.eslintignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
dist/*.js
*.config.*
81 changes: 81 additions & 0 deletions packages/account-v2/.eslintrc.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,81 @@
module.exports = {
env: { browser: true, es6: true, jest: true },
extends: [
'../../.eslintrc.js',
'eslint:recommended',
'plugin:react/recommended',
'plugin:react-hooks/recommended',
'plugin:sonarjs/recommended',
],
overrides: [
{
files: ['*.ts', '*.mts', '*.cts', '*.tsx'],
rules: {
'no-undef': 'off',
},
},
],
parser: '@typescript-eslint/parser',
parserOptions: { sourceType: 'module' },
plugins: [
'eslint-plugin-local-rules',
'sonarjs',
'simple-import-sort',
'sort-destructure-keys',
'typescript-sort-keys',
],
root: true,
ignorePatterns: ['**/node_modules/**', '**/dist/**', '**/*.js', '**/*.config.*'],
rules: {
'@typescript-eslint/array-type': 'error',
'@typescript-eslint/no-explicit-any': 'error',
'@typescript-eslint/no-unused-vars': 'error',
'@typescript-eslint/sort-type-constituents': 'error',
camelcase: 'error',
'import/first': 'error',
'import/newline-after-import': 'error',
'import/no-duplicates': 'error',
'import/no-extraneous-dependencies': ['off', { devDependencies: ['**/*.spec.*', '**/*.test.*', '**/*.d.ts*'] }],
'lines-around-comment': ['error', { allowObjectStart: true }],
'local-rules/no-react-namespace': 'error',
'no-unneeded-ternary': 'error',
'no-useless-return': 'error',
'object-shorthand': 'error',
'prefer-const': 'error',
'react/jsx-pascal-case': 'error',
'react/jsx-sort-props': 'error',
'simple-import-sort/exports': 'error',
'simple-import-sort/imports': [
'error',
{
groups: [
[
'public-path',
// `react` first, then packages starting with a character
'^react$',
'^[a-z]',
// Packages starting with `@`
'^@',
// Imports starting with `../`
'^\\.\\.(?!/?$)',
'^\\.\\./?$',
// Imports starting with `./`
'^\\./(?=.*/)(?!/?$)',
'^\\.(?!/?$)',
'^\\./?$',
// Style imports
'^.+\\.s?css$',
// Side effect imports
'^\\u0000',
// Delete the empty line copied as the next line of the last import
'\\s*',
],
],
},
],
'sort-destructure-keys/sort-destructure-keys': 'error',
'sort-keys': 'error',
'typescript-sort-keys/interface': 'error',
'typescript-sort-keys/string-enum': 'error',
},
};
16 changes: 16 additions & 0 deletions packages/account-v2/.stylelintrc.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
module.exports = {
extends: ['../../.stylelintrc.js'],
rules: {
'declaration-block-no-redundant-longhand-properties': true,
'declaration-no-important': true,
'color-no-hex': true,
'color-named': 'never',
'max-nesting-depth': 3,
'selector-class-pattern': [
'^[A-Za-z]+((-){0,2}(_){0,2}[A-Za-z]+)*[A-Za-z]$',
{
message: 'Expected selector to match BEM CSS pattern',
},
],
},
};
16 changes: 16 additions & 0 deletions packages/account-v2/babel.config.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
{
"presets": ["@babel/preset-env", "@babel/preset-react", "@babel/preset-typescript"],
"plugins": [
["@babel/plugin-proposal-decorators", { "legacy": true }],
["@babel/plugin-proposal-class-properties", { "loose": true }],
["@babel/plugin-proposal-private-methods", { "loose": true }],
["@babel/plugin-proposal-private-property-in-object", { "loose": true }],
"@babel/plugin-proposal-export-default-from",
"@babel/plugin-proposal-object-rest-spread",
"@babel/plugin-proposal-export-namespace-from",
"@babel/plugin-syntax-dynamic-import",
["@babel/plugin-proposal-unicode-property-regex", { "useUnicodeFlag": false }],
"@babel/plugin-proposal-optional-chaining",
"@babel/plugin-proposal-nullish-coalescing-operator"
]
}
121 changes: 121 additions & 0 deletions packages/account-v2/build/build-loaders.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,121 @@
import { RuleSetRule } from 'webpack';
import { TBuildOptions } from './types/build-types';

export const buildLoaders = (options: TBuildOptions): RuleSetRule[] => {
const svgLoaders = [
{
loader: 'babel-loader',
options: {
cacheDirectory: true,
rootMode: 'upward',
},
},
{
loader: 'react-svg-loader',
options: {
jsx: true,
svgo: {
floatPrecision: 3,
plugins: [
{ removeTitle: false },
{ removeUselessStrokeAndFill: false },
{ removeUnknownsAndDefaults: false },
{ removeViewBox: false },
],
},
},
},
];
const babelLoader = {
exclude: /node_modules/,
test: /\.(js|jsx|ts|tsx)$/,
use: [
{
loader: 'babel-loader',
options: {
cacheDirectory: true,
rootMode: 'upward',
},
},
],
};
const styleLoader = {
test: /\.(sc|sa|c)ss$/,
use: [
'style-loader',
{
loader: 'css-loader',
options: {
modules: {
auto: (path: string) => path.includes('.module.'),
localIdentName: options.isRelease ? '[hash:base64]' : '[path][name]__[local]',
},
url: true,
},
},
{
loader: 'postcss-loader',
options: {
postcssOptions: {
config: options.paths.root,
},
},
},
{
loader: 'resolve-url-loader',
options: {
keepQuery: true,
sourceMap: true,
},
},
'sass-loader',
{
loader: 'sass-resources-loader',
options: {
// Provide path to the file with resources
resources: [
// eslint-disable-next-line global-require, import/no-dynamic-require
...require('../../shared/src/styles/index.js'),
],
},
},
],
};
const sourceMapLoader = {
loader: 'source-map-loader',
test: (input: string) => options.isRelease && /\.js$/.test(input),
};

return [
{
// https://github.com/webpack/webpack/issues/11467
include: /node_modules/,
resolve: {
fullySpecified: false,
},
test: /\.m?js/,
},
babelLoader,
//TODO: Uncomment this line when type script migrations on all packages done
// plugins: [new CleanWebpackPlugin(), new ForkTsCheckerWebpackPlugin()],
sourceMapLoader,
styleLoader,
{
exclude: /node_modules/,
generator: {
filename: 'account-v2/public/[name].[contenthash][ext]',
},
include: /public\//,
issuer: /\/packages\/account-v2\/[^/]*\.scss/,
test: /\.svg$/,
type: 'asset/resource',
},
{
exclude: /node_modules/,
include: /public\//,
issuer: /\/packages\/account-v2\/[^/]*\.tsx/,
test: /\.svg$/,
use: svgLoaders,
},
];
};
45 changes: 45 additions & 0 deletions packages/account-v2/build/build-optimization.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
import CssMinimizerPlugin from 'css-minimizer-webpack-plugin';
import TerserPlugin from 'terser-webpack-plugin';
import { Configuration } from 'webpack';
import { TBuildOptions } from './types/build-types';

export const buildOptimization = (options: TBuildOptions): Configuration['optimization'] => ({
minimize: options.isRelease,
minimizer: options.isRelease
? [
new TerserPlugin({
parallel: 2,
test: /\.js$/,
}),
new CssMinimizerPlugin(),
]
: [],
splitChunks: {
automaticNameDelimiter: '~',
cacheGroups: {
default: {
minChunks: 2,
minSize: 102400,
priority: -20,
reuseExistingChunk: true,
},
defaultVendors: {
idHint: 'vendors',
priority: -10,
test: /[\\/]node_modules[\\/]/,
},
shared: {
chunks: 'all',
name: 'shared',
test: /[\\/]shared[\\/]/,
},
},
chunks: 'all',
enforceSizeThreshold: 500000,
maxAsyncRequests: 30,
maxInitialRequests: 3,
minChunks: 1,
minSize: 102400,
minSizeReduction: 102400,
},
});
5 changes: 5 additions & 0 deletions packages/account-v2/build/build-resolvers.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
import { ResolveOptions } from 'webpack';

export const buildResolvers = (): ResolveOptions => ({
extensions: ['.js', '.jsx', '.ts', '.tsx'],
});
36 changes: 36 additions & 0 deletions packages/account-v2/build/build-webpack-config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
import { Configuration } from 'webpack';
import { TBuildOptions } from './types/build-types';
import { buildLoaders } from './build-loaders';
import { buildOptimization } from './build-optimization';
import { buildResolvers } from './build-resolvers';

export const buildWebpackConfig = (options: TBuildOptions): Configuration => ({
devtool: options.isRelease ? 'source-map' : 'eval-cheap-module-source-map',
entry: {
index: options.paths.entry,
},
externals: [
{
'@deriv/api': true,
react: true,
'react-dom': true,
'react-router-dom': true,
},
],
mode: options.isRelease ? 'production' : 'development',
module: {
rules: buildLoaders(options),
},
optimization: buildOptimization(options),
output: {
chunkFilename: 'account-v2/js/account-v2.[name].[contenthash].js',
filename: 'account-v2/js/[name].js',
library: '@deriv/account-v2',
libraryExport: 'default',
libraryTarget: 'umd',
path: options.paths.output,
publicPath: options.base,
},

resolve: buildResolvers(),
});
15 changes: 15 additions & 0 deletions packages/account-v2/build/types/build-types.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
export interface TBuildPaths {
entry: string;
output: string;
root: string;
}

export interface TBuildEnv {
base?: boolean | string;
}

export interface TBuildOptions {
base: string;
isRelease: boolean;
paths: TBuildPaths;
}
9 changes: 9 additions & 0 deletions packages/account-v2/jest.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
import baseConfigForPackages from '../../jest.config.base';

export default {
...baseConfigForPackages,
moduleNameMapper: {
'\\.s(c|a)ss$': '<rootDir>/../../__mocks__/styleMock.js',
'^.+\\.svg$': '<rootDir>/../../__mocks__/fileMock.js',
},
};
Loading

0 comments on commit 37c8084

Please sign in to comment.