@centreon/js-config 22.10.0

package/eslint/base.eslintrc.js

@@ -0,0 +1,38 @@
+module.exports = {
+  extends: ['plugin:prettier/recommended'],
+  globals: {
+    Atomics: 'readonly',
+    SharedArrayBuffer: 'readonly',
+  },
+  parserOptions: {
+    ecmaVersion: 2022,
+    sourceType: 'module',
+  },
+  plugins: ['prefer-arrow-functions', 'sort-keys-fix'],
+  root: true,
+  rules: {
+    camelcase: ['error', { ignoreDestructuring: true, properties: 'never' }],
+    'import/extensions': [
+      'error',
+      'ignorePackages',
+      {
+        js: 'never',
+      },
+    ],
+    'import/no-extraneous-dependencies': ['error', { devDependencies: true }],
+    'import/prefer-default-export': 'off',
+    'newline-before-return': ['error'],
+    'no-promise-executor-return': 'off',
+    'prefer-arrow-functions/prefer-arrow-functions': ['error'],
+    'prettier/prettier': [
+      'error',
+      {
+        arrowParens: 'always',
+        endOfLine: 'auto',
+        singleQuote: true,
+        trailingComma: 'all',
+      },
+    ],
+    'sort-keys-fix/sort-keys-fix': ['error', 'asc', { natural: true }],
+  },
+};

package/eslint/base.typescript.eslintrc.js

@@ -0,0 +1,88 @@
+module.exports = {
+  overrides: [
+    {
+      extends: [
+        'plugin:@typescript-eslint/recommended',
+        'plugin:typescript-sort-keys/recommended',
+      ],
+      files: ['*.ts', '*.tsx'],
+      parser: '@typescript-eslint/parser',
+      plugins: ['@typescript-eslint', 'typescript-sort-keys'],
+      rules: {
+        '@typescript-eslint/array-type': [
+          'error',
+          {
+            default: 'generic',
+            readonly: 'generic',
+          },
+        ],
+        '@typescript-eslint/camelcase': 'off',
+        '@typescript-eslint/consistent-type-definitions': [
+          'error',
+          'interface',
+        ],
+        '@typescript-eslint/explicit-function-return-type': ['error'],
+        '@typescript-eslint/explicit-member-accessibility': [
+          'error',
+          {
+            accessibility: 'explicit',
+            overrides: {
+              accessors: 'explicit',
+              constructors: 'explicit',
+              methods: 'explicit',
+              parameterProperties: 'explicit',
+              properties: 'explicit',
+            },
+          },
+        ],
+        '@typescript-eslint/method-signature-style': ['error'],
+        '@typescript-eslint/naming-convention': [
+          'error',
+          {
+            format: ['camelCase', 'PascalCase'],
+            selector: 'variable',
+          },
+          {
+            filter: {
+              match: false,
+              regex: '((__esModule|.+-.+)|^_$|^(/|&))',
+            },
+            format: ['snake_case', 'camelCase', 'PascalCase'],
+            selector: 'property',
+          },
+          {
+            filter: {
+              match: false,
+              regex: '^_$|^(/|&)',
+            },
+            format: ['snake_case', 'camelCase', 'PascalCase'],
+            selector: 'parameter',
+          },
+        ],
+        '@typescript-eslint/no-shadow': ['error'],
+        '@typescript-eslint/no-unused-expressions': ['error'],
+        '@typescript-eslint/no-unused-vars': ['error'],
+        '@typescript-eslint/prefer-function-type': 'error',
+        '@typescript-eslint/type-annotation-spacing': [
+          'error',
+          {
+            after: true,
+            before: false,
+            overrides: { arrow: { after: true, before: true } },
+          },
+        ],
+        camelcase: 'off',
+        'no-shadow': 'off',
+        'no-unused-expressions': 'off',
+      },
+      settings: {
+        'import/resolver': {
+          alias: {
+            extensions: ['.ts', '.tsx', '.js', '.jsx'],
+          },
+        },
+      },
+    },
+  ],
+  root: true,
+};

package/eslint/node/index.eslintrc.js

@@ -0,0 +1,16 @@
+module.exports = {
+  extends: ['airbnb-base', '../base.eslintrc.js'],
+
+  env: {
+    es6: true,
+    node: true,
+  },
+
+  root: true,
+  rules: {
+    'global-require': 0,
+    'import/no-dynamic-require':0
+  }
+    
+  
+};

package/eslint/node/typescript.eslintrc.js

@@ -0,0 +1,13 @@
+module.exports = {
+  env: {
+    es6: true,
+    node: true,
+  },
+
+  extends: ['./index.eslintrc.js', '../base.typescript.eslintrc.js'],
+
+  rules: {
+    'global-require': 0,
+    'import/no-dynamic-require': 0,
+  },
+};

package/eslint/react/index.eslintrc.js

@@ -0,0 +1,99 @@
+module.exports = {
+  env: {
+    browser: true,
+    es6: true,
+    jest: true,
+  },
+  extends: ['airbnb', '../base.eslintrc.js'],
+  parserOptions: {
+    ecmaFeatures: {
+      jsx: true,
+    },
+    ecmaVersion: 2018,
+    sourceType: 'module',
+  },
+
+  plugins: ['react', 'hooks', 'react-hooks'],
+  root: true,
+  rules: {
+    camelcase: ['error', { ignoreDestructuring: true, properties: 'never' }],
+    'hooks/sort': [
+      2,
+      {
+        groups: [
+          'useStyles',
+          'useTranslation',
+          'useState',
+          'useRequest',
+          'useUserContext',
+          'useAtom',
+          'useAtomValue',
+          'useUpdateAtom',
+          'useCallback',
+          'useEffect',
+        ],
+      },
+    ],
+    'import/extensions': [
+      'error',
+      'ignorePackages',
+      {
+        js: 'never',
+        jsx: 'never',
+        ts: 'never',
+        tsx: 'never',
+      },
+    ],
+    'import/no-extraneous-dependencies': 'off',
+    'import/order': [
+      'error',
+      {
+        'newlines-between': 'always',
+        pathGroups: [
+          {
+            group: 'builtin',
+            pattern: 'react',
+            position: 'before',
+          },
+          {
+            group: 'external',
+            pattern: '@mui/**',
+            position: 'after',
+          },
+          {
+            group: 'parent',
+            pattern: '@centreon/**',
+            position: 'before',
+          },
+        ],
+        pathGroupsExcludedImportTypes: ['builtin'],
+      },
+    ],
+    'no-use-before-define': 'off',
+    'prefer-arrow-functions/prefer-arrow-functions': ['error'],
+    'react/function-component-definition': [
+      'error',
+      {
+        namedComponents: 'arrow-function',
+        unnamedComponents: 'arrow-function',
+      },
+    ],
+    'react/jsx-filename-extension': ['error', { extensions: ['.jsx'] }],
+    'react/jsx-key': 'error',
+    'react/jsx-no-duplicate-props': ['error', { ignoreCase: false }],
+    'react/jsx-props-no-spreading': 'off',
+    'react/jsx-sort-props': [
+      'error',
+      {
+        callbacksLast: true,
+        shorthandFirst: true,
+      },
+    ],
+    'react/jsx-uses-react': 'off',
+    'react/jsx-wrap-multilines': ['error', { prop: false }],
+    'react/react-in-jsx-scope': 'off',
+    'react/state-in-constructor': 'off',
+    'react-hooks/exhaustive-deps': 'off',
+    'react-hooks/rules-of-hooks': 'error',
+  },
+};

package/eslint/react/typescript.eslintrc.js

@@ -0,0 +1,25 @@
+module.exports = {
+  extends: ['./index.eslintrc.js', '../base.typescript.eslintrc.js'],
+  overrides: [
+    {
+      extends: [
+        'plugin:@typescript-eslint/recommended',
+        'plugin:typescript-sort-keys/recommended',
+      ],
+      files: ['*.ts', '*.tsx'],
+      parser: '@typescript-eslint/parser',
+      plugins: ['@typescript-eslint', 'typescript-sort-keys'],
+      rules: {
+        '@typescript-eslint/naming-convention': [
+          'error',
+          { format: null, selector: 'objectLiteralProperty' },
+        ],
+        'react/jsx-filename-extension': [
+          'error',
+          { extensions: ['.jsx', '.tsx'] },
+        ],
+        'react/require-default-props': 'off',
+      },
+    },
+  ],
+};

package/jest/index.js

@@ -0,0 +1,28 @@
+module.exports = {
+  moduleNameMapper: {
+    '@centreon/ui': '<rootDir>/packages/ui',
+    '@centreon/ui-context': '<rootDir>/packages/ui-context',
+    '\\.(s?css|png|svg|jpg)$': 'identity-obj-proxy',
+    '^react($|/.+)': '<rootDir>/node_modules/react$1',
+  },
+  setupFilesAfterEnv: ['@testing-library/jest-dom/extend-expect'],
+  testEnvironment: 'jsdom',
+  testPathIgnorePatterns: ['/node_modules/'],
+  transform: {
+    '^.+\\.[jt]sx?$': [
+      '@swc/jest',
+      {
+        jsc: {
+          transform: {
+            react: {
+              runtime: 'automatic',
+            },
+          },
+        },
+      },
+    ],
+  },
+  transformIgnorePatterns: [
+    '/node_modules/(?!centreon-frontend/packages/(centreon-ui|ui-context)).+\\.jsx?$',
+  ],
+};

package/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "@centreon/js-config",
+  "description": "Centreon Frontend shared build configuration",
+  "version": "22.10.0",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/centreon/centreon-frontend.git"
+  },
+  "keywords": [
+    "centreon",
+    "eslint"
+  ],
+  "author": "centreon@centreon.com",
+  "license": "GPL-2.0",
+  "bugs": {
+    "url": "https://github.com/centreon/centreon-frontend/issues"
+  },
+  "devDependencies": {
+    "eslint": "^8.17.0",
+    "eslint-config-airbnb": "19.0.4",
+    "eslint-config-prettier": "^8.5.0",
+    "eslint-import-resolver-alias": "^1.1.2",
+    "eslint-plugin-babel": "^5.3.1",
+    "eslint-plugin-hooks": "^0.4.3",
+    "eslint-plugin-import": "^2.26.0",
+    "eslint-plugin-jest": "^26.1.5",
+    "eslint-plugin-jsx-a11y": "^6.5.1",
+    "eslint-plugin-node": "^11.1.0",
+    "eslint-plugin-prefer-arrow-functions": "^3.1.4",
+    "eslint-plugin-prettier": "^4.0.0",
+    "eslint-plugin-react": "^7.29.4",
+    "eslint-plugin-react-hooks": "^4.5.0",
+    "eslint-plugin-sort-keys-fix": "^1.1.2",
+    "eslint-plugin-typescript-sort-keys": "^2.1.0"
+  },
+  "homepage": "https://github.com/centreon/centreon-frontend#readme"
+}

package/tsconfig/index.json

@@ -0,0 +1,13 @@
+{
+  "compilerOptions": {
+    "moduleResolution": "node",
+    "downlevelIteration": true,
+    "module": "es6",
+    "target": "es6",
+    "jsx": "react-jsx",
+    "strict": true,
+    "noImplicitAny": false,
+    "skipLibCheck": true,
+    "esModuleInterop": true
+  }
+}

package/webpack/base/index.js

@@ -0,0 +1,130 @@
+const path = require('path');
+
+const { CleanWebpackPlugin } = require('clean-webpack-plugin');
+const { ModuleFederationPlugin } = require('webpack').container;
+
+const excludeNodeModulesExceptCentreonUi = /node_modules(\\|\/)(?!(@centreon))/;
+
+const getBaseConfiguration = ({
+  moduleName,
+  moduleFederationConfig,
+  jscTransformConfiguration,
+}) => ({
+  cache: false,
+  module: {
+    rules: [
+      {
+        parser: { system: false },
+        test: /\.[cm]?(j|t)sx?$/,
+      },
+      {
+        exclude: excludeNodeModulesExceptCentreonUi,
+        test: /\.[jt]sx?$/,
+        use: {
+          loader: 'swc-loader',
+          options: {
+            jsc: {
+              parser: {
+                syntax: 'typescript',
+                tsx: true,
+              },
+              transform: jscTransformConfiguration,
+            },
+          },
+        },
+      },
+      {
+        test: /\.icon.svg$/,
+        use: ['@svgr/webpack'],
+      },
+      {
+        exclude: excludeNodeModulesExceptCentreonUi,
+        test: /\.(bmp|png|jpg|jpeg|gif|svg)$/,
+        use: [
+          {
+            loader: 'url-loader',
+            options: {
+              limit: 10000,
+              name: '[name].[hash:8].[ext]',
+            },
+          },
+        ],
+      },
+    ],
+  },
+  optimization: {
+    splitChunks: {
+      chunks: 'all',
+      maxSize: 400 * 1024,
+    },
+  },
+  output: {
+    chunkFilename: '[name].[chunkhash:8].chunk.js',
+    filename: '[name].[chunkhash:8].js',
+    libraryTarget: 'umd',
+    umdNamedDefine: true,
+  },
+  plugins: [
+    new CleanWebpackPlugin(),
+    new ModuleFederationPlugin({
+      filename: 'remoteEntry.[chunkhash:8].js',
+      library: { name: moduleName, type: 'var' },
+      name: moduleName,
+      shared: [
+        {
+          '@centreon/ui-context': {
+            requiredVersion: '22.10.0',
+            singleton: true,
+          },
+        },
+        {
+          jotai: {
+            requiredVersion: '1.x',
+            singleton: true,
+          },
+        },
+        {
+          'jotai-suspense': {
+            requiredVersion: '0.1.x',
+            singleton: true,
+          },
+        },
+        {
+          react: {
+            requiredVersion: '18.x',
+            singleton: true,
+          },
+        },
+        {
+          'react-dom': {
+            requiredVersion: '18.x',
+            singleton: true,
+          },
+        },
+        {
+          'react-i18next': {
+            requiredVersion: '11.x',
+            singleton: true,
+          },
+        },
+        {
+          'react-router-dom': {
+            requiredVersion: '6.x',
+            singleton: true,
+          },
+        },
+      ],
+      ...moduleFederationConfig,
+    }),
+  ],
+  resolve: {
+    alias: {
+      '@centreon/ui': path.resolve('packages', 'ui'),
+      '@centreon/ui-context': path.resolve('packages', 'ui-context'),
+      react: path.resolve('./node_modules/react'),
+    },
+    extensions: ['.js', '.jsx', '.ts', '.tsx'],
+  },
+});
+
+module.exports = getBaseConfiguration;

package/webpack/patch/dev.js

@@ -0,0 +1,24 @@
+module.exports = {
+  devJscTransformConfiguration: {
+    react: {
+      development: true,
+      refresh: false,
+    },
+  },
+  devRefreshJscTransformConfiguration: {
+    react: {
+      development: true,
+      refresh: true,
+    },
+  },
+  getDevConfiguration: () => ({
+    cache: true,
+    devtool: 'eval-cheap-module-source-map',
+    optimization: {
+      splitChunks: false,
+    },
+    output: {
+      filename: '[name].js',
+    },
+  }),
+};

package/webpack/patch/module.js

@@ -0,0 +1,46 @@
+const fs = require('fs');
+const { CleanWebpackPlugin } = require('clean-webpack-plugin');
+
+class CentreonModulePlugin {
+  constructor(federatedComponentConfiguration) {
+    this.federatedComponentConfiguration = federatedComponentConfiguration;
+  }
+
+  apply(compiler) {
+    compiler.hooks.done.tap('CentreonModulePlugin', (stats) => {
+      const newFederatedComponentConfiguration = {
+        ...this.federatedComponentConfiguration,
+        remoteEntry: Object.keys(stats.compilation.assets).find((assetName) =>
+          assetName.match(/(^remoteEntry)\S+.js$/),
+        ),
+      };
+
+      if (!fs.existsSync(compiler.options.output.path)) {
+        fs.mkdirSync(compiler.options.output.path, { recursive: true });
+      }
+
+      fs.writeFileSync(
+        `${compiler.options.output.path}/moduleFederation.json`,
+        JSON.stringify(newFederatedComponentConfiguration, null, 2),
+      );
+    });
+  }
+}
+
+module.exports = ({
+  outputPath,
+  federatedComponentConfiguration,
+}) => ({
+  output: {
+    library: '[chunkhash:8]',
+    path: outputPath,
+  },
+  plugins: [
+    new CleanWebpackPlugin({
+      cleanOnceBeforeBuildPatterns: [`${outputPath}/**/*.js`],
+      dangerouslyAllowCleanPatternsOutsideProject: true,
+      dry: false,
+    }),
+    new CentreonModulePlugin(federatedComponentConfiguration),
+  ],
+});