Merge pull request #2182 from RedisInsight/build/feature/RI-4567_Refactoring_main_dev

Author: egor-zalenski

.eslintrc.js

@@ -1,17 +1,63 @@
 module.exports = {
   root: true,
+  env: {
+    node: true,
+  },
   extends: ['airbnb-typescript'],
   plugins: ['@typescript-eslint'],
   parser: '@typescript-eslint/parser',
   rules: {
-    'max-len': ['warn', 120],
+    semi: ['error', 'never'],
+    quotes: [2, 'single', { avoidEscape: true }],
+    'max-len': ['error', { ignoreComments: true, ignoreStrings: true, ignoreRegExpLiterals: true, code: 120 }],
     'class-methods-use-this': 'off',
     'import/no-extraneous-dependencies': 'off', // temporary disabled
+    '@typescript-eslint/semi': ['error', 'never'],
+    'object-curly-newline': 'off',
+    'import/prefer-default-export': 'off',
+    '@typescript-eslint/comma-dangle': 'off',
+    'implicit-arrow-linebreak': 'off',
+    'import/order': [
+      1,
+      {
+        groups: [
+          'external',
+          'builtin',
+          'internal',
+          'sibling',
+          'parent',
+          'index',
+        ],
+        pathGroups: [
+          {
+            pattern: 'desktopSrc/**',
+            group: 'internal',
+            position: 'after'
+          },
+          {
+            pattern: 'uiSrc/**',
+            group: 'internal',
+            position: 'after'
+          },
+          {
+            pattern: 'apiSrc/**',
+            group: 'internal',
+            position: 'after'
+          },
+        ],
+        warnOnUnassignedImports: true,
+        pathGroupsExcludedImportTypes: ['builtin']
+      },
+    ],
   },
   parserOptions: {
     project: './tsconfig.json',
+    ecmaVersion: 2020,
+    sourceType: 'module',
+    createDefaultProgram: true,
   },
   ignorePatterns: [
     'redisinsight/ui',
+    'redisinsight/api',
   ],
-};
+}

.gitignore

@@ -36,7 +36,6 @@ lerna-debug.log*
 .vscode
 
 # App packaged
-redisinsight/electron/preload.js
 release
 main.prod.js
 main.prod.js.map

configs/webpack.config.base.ts

@@ -35,11 +35,6 @@ const configuration: webpack.Configuration =  {
     extensions: ['.js', '.jsx', '.json', '.ts', '.tsx', '.scss'],
     modules: [webpackPaths.apiPath, 'node_modules'],
     plugins: [new TsconfigPathsPlugins()],
-    alias: {
-      src: webpackPaths.apiSrcPath,
-      apiSrc: webpackPaths.apiSrcPath,
-      uiSrc: webpackPaths.uiSrcPath,
-    },
   },
 
   plugins: [

configs/webpack.config.main.prod.ts

@@ -1,6 +1,7 @@
 import path from 'path';
 import webpack from 'webpack';
 import { merge } from 'webpack-merge';
+import { toString } from 'lodash';
 import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
 import baseConfig from './webpack.config.base';
 import DeleteSourceMaps from '../scripts/DeleteSourceMaps';
@@ -24,16 +25,8 @@ export default merge(baseConfig, {
   target: 'electron-main',
 
   entry: {
-    main: path.join(webpackPaths.electronPath, 'main.dev.ts'),
-    preload: path.join(webpackPaths.electronPath, 'preload.ts'),
-  },
-
-  resolve: {
-    alias: {
-      ['apiSrc']: webpackPaths.apiSrcPath,
-      ['src']: webpackPaths.apiSrcPath,
-    },
-    extensions: ['.tsx', '.ts', '.js', '.jsx'],
+    main: path.join(webpackPaths.desktopPath, 'index.ts'),
+    preload: path.join(webpackPaths.desktopPath, 'preload.ts'),
   },
 
   output: {
@@ -73,6 +66,9 @@ export default merge(baseConfig, {
       APP_VERSION: version,
       AWS_BUCKET_NAME: 'AWS_BUCKET_NAME' in process.env ? process.env.AWS_BUCKET_NAME : '',
       SEGMENT_WRITE_KEY: 'SEGMENT_WRITE_KEY' in process.env ? process.env.SEGMENT_WRITE_KEY : 'SOURCE_WRITE_KEY',
+      CONNECTIONS_TIMEOUT_DEFAULT: 'CONNECTIONS_TIMEOUT_DEFAULT' in process.env
+        ? process.env.CONNECTIONS_TIMEOUT_DEFAULT
+        : toString(30 * 1000), // 30 sec
     }),
 
     new webpack.DefinePlugin({

configs/webpack.config.main.stage.ts

@@ -1,5 +1,6 @@
 import webpack from 'webpack';
 import { merge } from 'webpack-merge';
+import { toString } from 'lodash';
 import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
 import mainProdConfig from './webpack.config.main.prod';
 import DeleteSourceMaps from '../scripts/DeleteSourceMaps';
@@ -30,6 +31,9 @@ export default merge(mainProdConfig, {
       APP_VERSION: version,
       AWS_BUCKET_NAME: 'AWS_BUCKET_NAME' in process.env ? process.env.AWS_BUCKET_NAME : '',
       SEGMENT_WRITE_KEY: 'SEGMENT_WRITE_KEY' in process.env ? process.env.SEGMENT_WRITE_KEY : 'SOURCE_WRITE_KEY',
+      CONNECTIONS_TIMEOUT_DEFAULT: 'CONNECTIONS_TIMEOUT_DEFAULT' in process.env
+        ? process.env.CONNECTIONS_TIMEOUT_DEFAULT
+        : toString(30 * 1000), // 30 sec
     }),
   ],
 });

configs/webpack.config.preload.dev.ts

@@ -12,7 +12,7 @@ const configuration: webpack.Configuration = {
 
   target: 'electron-preload',
 
-  entry: path.join(webpackPaths.electronPath, 'preload.ts'),
+  entry: path.join(webpackPaths.desktopPath, 'preload.ts'),
 
   output: {
     path: webpackPaths.dllPath,

configs/webpack.config.renderer.dev.dll.ts

@@ -54,7 +54,7 @@ export default merge(baseConfig, {
     new webpack.LoaderOptionsPlugin({
       debug: true,
       options: {
-        context: webpackPaths.electronPath,
+        context: webpackPaths.desktopPath,
         output: {
           path: webpackPaths.dllPath,
         },

configs/webpack.config.renderer.dev.ts

@@ -18,6 +18,7 @@ const skipDLLs =
   module.parent?.filename.includes('webpack.config.renderer.dev.dll') ||
   module.parent?.filename.includes('webpack.config.eslint');
 
+const htmlPagesNames = ['splash.ejs', 'index.ejs']
 /**
  * Warn if the DLL is not built
  */
@@ -51,22 +52,14 @@ const configuration: webpack.Configuration = {
   ],
 
   output: {
-    path: webpackPaths.electronPath,
+    path: webpackPaths.desktopPath,
     publicPath: '/',
     filename: 'renderer.dev.js',
     library: {
       type: 'umd',
     },
   },
 
-  resolve: {
-    alias: {
-      src: webpackPaths.apiSrcPath,
-      apiSrc: webpackPaths.apiSrcPath,
-      uiSrc: webpackPaths.uiSrcPath,
-    },
-  },
-
   module: {
     rules: [
       {
@@ -241,19 +234,21 @@ const configuration: webpack.Configuration = {
 
     new MonacoWebpackPlugin({ languages: ['json'], features: ['!rename'] }),
 
-    new HtmlWebpackPlugin({
-      filename: path.join('index.html'),
-      template: path.join(webpackPaths.electronPath, 'index.ejs'),
-      minify: {
-        collapseWhitespace: true,
-        removeAttributeQuotes: true,
-        removeComments: true,
-      },
-      isBrowser: false,
-      env: process.env.NODE_ENV,
-      isDevelopment: process.env.NODE_ENV !== 'production',
-      nodeModules: webpackPaths.appNodeModulesPath,
-    }),
+    ...htmlPagesNames.map((htmlPageName) => (
+      new HtmlWebpackPlugin({
+        filename: path.join(`${htmlPageName.split('.')?.[0]}.html`),
+        template: path.join(webpackPaths.desktopPath, htmlPageName),
+        minify: {
+          collapseWhitespace: true,
+          removeAttributeQuotes: true,
+          removeComments: true,
+        },
+        isBrowser: false,
+        env: process.env.NODE_ENV,
+        isDevelopment: process.env.NODE_ENV !== 'production',
+        nodeModules: webpackPaths.appNodeModulesPath,
+      })
+    )),
 
     new webpack.DefinePlugin({
       'process.env.NODE_ENV': JSON.stringify('development'),

configs/webpack.config.renderer.prod.ts

@@ -11,6 +11,8 @@ import { version } from '../redisinsight/package.json';
 
 DeleteSourceMaps();
 
+const htmlPagesNames = ['splash.ejs', 'index.ejs']
+
 const devtoolsConfig =
   process.env.DEBUG_PROD === 'true'
     ? {
@@ -187,12 +189,14 @@ const configuration: webpack.Configuration = {
       filename: 'style.css',
     }),
 
-    new HtmlWebpackPlugin({
-      filename: 'index.html',
-      template: path.join(webpackPaths.electronPath, 'index.ejs'),
-      isBrowser: false,
-      isDevelopment: false,
-    }),
+    ...htmlPagesNames.map((htmlPageName) => (
+      new HtmlWebpackPlugin({
+        filename: path.join(`${htmlPageName.split('.')?.[0]}.html`),
+        template: path.join(webpackPaths.desktopPath, htmlPageName),
+        isBrowser: false,
+        isDevelopment: false,
+      })
+    )),
 
     new webpack.DefinePlugin({
       'process.type': '"renderer"',

configs/webpack.config.web.common.ts

@@ -6,6 +6,7 @@ import webpack from 'webpack';
 import HtmlWebpackPlugin from 'html-webpack-plugin';
 import TsconfigPathsPlugin from 'tsconfig-paths-webpack-plugin';
 import MonacoWebpackPlugin from 'monaco-editor-webpack-plugin';
+import webpackPaths from './webpack.paths';
 import { dependencies as externals } from '../redisinsight/package.json';
 import { dependencies as externalsApi } from '../redisinsight/api/package.json';
 
@@ -18,12 +19,11 @@ export default {
     rules: [
       {
         test: /\.(js|jsx|ts|tsx)?$/,
-        // exclude: /node_modules/,
-        include: [path.resolve(__dirname, '../redisinsight/ui')],
+        include: [webpackPaths.uiPath],
         exclude: [
           /node_modules/,
-          path.resolve(__dirname, '../redisinsight/api'),
-          path.resolve(__dirname, '../redisinsight/electron'),
+          webpackPaths.apiPath,
+          webpackPaths.desktopPath,
         ],
         use: {
           loader: 'babel-loader',
@@ -44,8 +44,7 @@ export default {
     ],
   },
 
-  // context: path.resolve(__dirname, '../redisinsight/api/src'),
-  context: path.resolve(__dirname, '../redisinsight/ui'),
+  context: webpackPaths.uiPath,
 
   /**
    * Determine the array of extensions that should be used to resolve modules.
@@ -66,7 +65,7 @@ export default {
 
   plugins: [
     new webpack.DefinePlugin({
-      'window.ENV_VARS.API_PORT': JSON.stringify('5000'),
+      'window.app.config.apiPort': JSON.stringify('5000'),
     }),
 
     new HtmlWebpackPlugin({ template: 'index.html.ejs' }),