shell-ui: Move bundles to sub folders

shell-ui/index.alerts.js

@@ -0,0 +1,11 @@
+import ReactDOM from 'react-dom';
+import "@fortawesome/fontawesome-free/js/all.js";
+
+import NavbarMdx from './src/navbar/index.mdx';
+
+import AlertsMdx from './src/alerts/index.mdx';
+
+ReactDOM.render(<>
+    <NavbarMdx />
+    <AlertsMdx />
+</>, document.getElementById('app'));

shell-ui/index.navbar.js

@@ -0,0 +1,8 @@
+import ReactDOM from 'react-dom';
+import "@fortawesome/fontawesome-free/js/all.js";
+
+import NavbarMdx from './src/navbar/index.mdx';
+
+ReactDOM.render(<>
+    <NavbarMdx />
+</>, document.getElementById('app'));

shell-ui/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "solution-ui-navbar",
+  "name": "shell-ui",
   "version": "1.0.0",
   "main": "index.js",
   "scripts": {

shell-ui/src/alerts/index.js

@@ -0,0 +1 @@
+import "./library";

shell-ui/src/alerts/library.js

@@ -0,0 +1,10 @@
+import { version } from '../../package.json';
+
+window.shellUIAlerts = {
+    ///spread shellUI to keep all versions libraries
+    ...window.shellUIAlerts,
+    [version]: {
+      //todo
+    },
+  };
+

shell-ui/src/index.js → shell-ui/src/navbar/index.js

@@ -15,7 +15,7 @@ import { defaultTheme } from '@scality/core-ui/dist/style/theme';
 import { LanguageProvider } from './lang';
 import { ThemeProvider, useThemeName } from './theme';
 import { useFavicon } from './favicon';
-import { version } from '../package.json';
+import { version } from '../../package.json';
 import "./library";
 
 export type PathDescription = {

shell-ui/src/library.js → shell-ui/src/navbar/library.js

@@ -3,7 +3,7 @@ import {
   LANGUAGE_CHANGED_EVENT,
   THEME_CHANGED_EVENT,
 } from './events';
-import { version } from '../package.json';
+import { version } from '../../package.json';
 
 window.shellUINavbar = {
   ///spread shellUI to keep all versions libraries

shell-ui/webpack.config.dev.js

@@ -1,14 +1,17 @@
-const HtmlWebPackPlugin = require("html-webpack-plugin");
-const path = require("path");
-const {name, version} = require("./package.json");
-const {DefinePlugin} = require("webpack")
+const HtmlWebPackPlugin = require('html-webpack-plugin');
+const path = require('path');
+const { version } = require('./package.json');
+const { DefinePlugin } = require('webpack');
 module.exports = {
-  mode: "development",
-  devtool: "source-map",
-  entry: "./index.js",
+  mode: 'development',
+  devtool: 'source-map',
+  entry: {
+    'solution-ui-navbar': './index.navbar.js',
+    alerts: './index.alerts.js',
+  },
   output: {
-    path: path.resolve(__dirname, "build"),
-    filename: `shell/${name}.${version}.js`,
+    path: path.resolve(__dirname, 'build'),
+    filename: `shell/[name].${version}.js`,
   },
   module: {
     // ...
@@ -17,28 +20,28 @@ module.exports = {
         test: /\.(js|jsx)$/,
         exclude: /node_modules/,
         use: {
-          loader: "babel-loader",
+          loader: 'babel-loader',
         },
       },
       {
         test: /\.mdx?$/,
-        use: ["babel-loader", "@mdx-js/loader"],
-      }
+        use: ['babel-loader', '@mdx-js/loader'],
+      },
     ],
   },
   devServer: {
-        port: process.env.PORT || 8082,
-        historyApiFallback: true,
-        contentBase: 'public'
-      },
+    port: process.env.PORT || 8082,
+    historyApiFallback: true,
+    contentBase: 'public',
+  },
   plugins: [
     new DefinePlugin({
       'process.env': {
-        NODE_ENV: JSON.stringify('development')
-      }
+        NODE_ENV: JSON.stringify('development'),
+      },
     }),
     new HtmlWebPackPlugin({
-      template: "./index-template.html",
-    })
+      template: './index-template.html',
+    }),
   ],
 };

shell-ui/webpack.config.prd.js

@@ -1,13 +1,16 @@
-const path = require("path");
-const {name, version} = require("./package.json");
-const {DefinePlugin} = require("webpack");
+const path = require('path');
+const { version } = require('./package.json');
+const { DefinePlugin } = require('webpack');
 module.exports = {
-  mode: "production",
+  mode: 'production',
   devtool: false,
-  entry: "./src/index.js",
+  entry: {
+    'solution-ui-navbar': './src/navbar/index.js',
+    alerts: './src/alerts/index.js',
+  },
   output: {
-    path: path.resolve(__dirname, "build"),
-    filename: `${name}.${version}.js`,
+    path: path.resolve(__dirname, 'build'),
+    filename: `[name].${version}.js`,
   },
   module: {
     // ...
@@ -16,16 +19,16 @@ module.exports = {
         test: /\.(js|jsx)$/,
         exclude: /node_modules/,
         use: {
-          loader: "babel-loader",
+          loader: 'babel-loader',
         },
-      }
+      },
     ],
   },
   plugins: [
     new DefinePlugin({
       'process.env': {
-        NODE_ENV: JSON.stringify('production')
-      }
+        NODE_ENV: JSON.stringify('production'),
+      },
     }),
-  ]
+  ],
 };