diff --git a/config/dev.webpack.config.js b/config/dev.webpack.config.js index 189385dd..aaf7355b 100644 --- a/config/dev.webpack.config.js +++ b/config/dev.webpack.config.js @@ -1,13 +1,24 @@ - const { resolve } = require('path'); const config = require('@redhat-cloud-services/frontend-components-config'); const { config: webpackConfig, plugins } = config({ rootFolder: resolve(__dirname, '../'), debug: true, - https: false, port: 8002, + useFileHash: false, + skipChrome2: true, }); +plugins.push( + require('@redhat-cloud-services/frontend-components-config/federated-modules')({ + root: resolve(__dirname, '../'), + useFileHash: false, + moduleName: 'image_builder', + exposes: { + './RootApp': resolve(__dirname, '../src/AppEntry.js'), + }, + }) +); + module.exports = { ...webpackConfig, plugins diff --git a/config/prod.webpack.config.js b/config/prod.webpack.config.js index dca4e2d8..1bd9007e 100644 --- a/config/prod.webpack.config.js +++ b/config/prod.webpack.config.js @@ -1,10 +1,20 @@ - const { resolve } = require('path'); const config = require('@redhat-cloud-services/frontend-components-config'); const { config: webpackConfig, plugins } = config({ - rootFolder: resolve(__dirname, '../') + rootFolder: resolve(__dirname, '../'), + skipChrome2: false, }); +plugins.push( + require('@redhat-cloud-services/frontend-components-config/federated-modules')({ + root: resolve(__dirname, '../'), + moduleName: 'image_builder', + exposes: { + './RootApp': resolve(__dirname, '../src/AppEntry.js'), + }, + }) +); + module.exports = { ...webpackConfig, plugins diff --git a/config/test.webpack.config.js b/config/test.webpack.config.js index dca4e2d8..355b0e90 100644 --- a/config/test.webpack.config.js +++ b/config/test.webpack.config.js @@ -1,10 +1,26 @@ - const { resolve } = require('path'); const config = require('@redhat-cloud-services/frontend-components-config'); const { config: webpackConfig, plugins } = config({ - rootFolder: resolve(__dirname, '../') + rootFolder: resolve(__dirname, '../'), + debug: true, + port: 8002, + useFileHash: false, + skipChrome2: false, }); +console.log('CONFIG', config); + +plugins.push( + require('@redhat-cloud-services/frontend-components-config/federated-modules')({ + root: resolve(__dirname, '../'), + useFileHash: false, + moduleName: 'image_builder', + exposes: { + './RootApp': resolve(__dirname, '../src/AppEntry.js'), + }, + }) +); + module.exports = { ...webpackConfig, plugins diff --git a/package.json b/package.json index 522b0348..962e21c6 100644 --- a/package.json +++ b/package.json @@ -7,9 +7,9 @@ "@patternfly/patternfly": "4.102.2", "@patternfly/react-core": "4.115.2", "@patternfly/react-table": "4.26.7", - "@redhat-cloud-services/frontend-components": "2.5.10", + "@redhat-cloud-services/frontend-components": "3.0.3", "@redhat-cloud-services/frontend-components-notifications": "3.1.0", - "@redhat-cloud-services/frontend-components-utilities": "2.2.9", + "@redhat-cloud-services/frontend-components-utilities": "3.1.2", "classnames": "2.3.1", "react": "16.14.0", "react-dom": "16.14.0", @@ -43,7 +43,7 @@ "@babel/preset-env": "7.8.7", "@babel/preset-flow": "7.8.3", "@babel/preset-react": "7.8.3", - "@redhat-cloud-services/frontend-components-config": "2.1.9", + "@redhat-cloud-services/frontend-components-config": "4.0.28", "@testing-library/react": "11.0.4", "@testing-library/jest-dom": "5.10.1", "@testing-library/user-event": "12.2.2", @@ -52,7 +52,7 @@ "babel-jest": "26.1.0", "babel-plugin-dual-import": "1.2.1", "babel-plugin-lodash": "3.3.4", - "css-loader": "3.4.2", + "css-loader": "5.2.4", "eslint": "6.8.0", "eslint-config-prettier": "6.10.0", "eslint-loader": "3.0.3", @@ -67,9 +67,9 @@ "stylelint": "13.1.0", "stylelint-config-recommended-scss": "4.2.0", "stylelint-scss": "3.14.2", - "webpack": "4.41.6", - "webpack-bundle-analyzer": "3.6.0", - "webpack-cli": "3.3.11" + "webpack": "5.33.2", + "webpack-bundle-analyzer": "4.4.0", + "webpack-cli": "4.6.0" }, "scripts": { "build": "webpack --config config/prod.webpack.config.js", @@ -78,9 +78,9 @@ "lint:js:fix": "eslint config src --fix", "lint:sass": "stylelint 'src/**/*.scss' --config .stylelintrc.json", "nightly": "npm run travis:verify", - "prod": "NODE_ENV=production webpack-dev-server --config config/dev.webpack.config.js", + "prod": "NODE_ENV=production webpack serve --config config/dev.webpack.config.js", "server:ctr": "node src/server/generateServerKey.js", - "start": "NODE_ENV=development webpack-dev-server --config config/dev.webpack.config.js", + "start": "NODE_ENV=development webpack serve --config config/dev.webpack.config.js", "test": "jest --verbose", "test:single": "jest --verbose -w 1", "travis:build": "NODE_ENV=production webpack --config config/prod.webpack.config.js", diff --git a/profiles/local-frontend-and-api-with-identity.js b/profiles/local-frontend-and-api-with-identity.js index 09090bc8..c61ffe9d 100644 --- a/profiles/local-frontend-and-api-with-identity.js +++ b/profiles/local-frontend-and-api-with-identity.js @@ -4,7 +4,7 @@ const cookie = require('cookie'); const fs = require('fs'); const base64 = require('base-64'); -const SECTION = 'apps'; +const SECTION = 'insights'; const APP_ID = 'image-builder'; const FRONTEND_PORT = 8002; const API_PORT = 8086; @@ -113,6 +113,8 @@ routes[`/apps/${APP_ID}`] = { host: `http://localhost:${FRONTEND_PORT routes[`/api/${APP_ID}`] = { host: `http://localhost:${API_PORT}` }; routes['/apps/chrome'] = { host: PORTAL_BACKEND_MARKER }; routes['/apps/beta/chrome'] = { host: PORTAL_BACKEND_MARKER }; +routes[`/beta/config`] = { host: `http://localhost:8889` }; +routes[`/config`] = { host: `http://localhost:8889` }; module.exports = { bs: { diff --git a/profiles/local-frontend-and-api.js b/profiles/local-frontend-and-api.js index 4d813213..5dc9afc2 100644 --- a/profiles/local-frontend-and-api.js +++ b/profiles/local-frontend-and-api.js @@ -1,6 +1,6 @@ /*global module*/ -const SECTION = 'apps'; +const SECTION = 'insights'; const APP_ID = 'image-builder'; const FRONTEND_PORT = 8002; const API_PORT = 8086; diff --git a/profiles/local-frontend.js b/profiles/local-frontend.js index 62edaed1..f7d2f4b7 100644 --- a/profiles/local-frontend.js +++ b/profiles/local-frontend.js @@ -1,6 +1,6 @@ /*global module*/ -const SECTION = 'apps'; +const SECTION = 'insights'; const APP_ID = 'image-builder'; const FRONTEND_PORT = 8002; const routes = {}; diff --git a/src/App.scss b/src/App.scss index 8f3c4c44..d00fd2c0 100644 --- a/src/App.scss +++ b/src/App.scss @@ -1,3 +1,3 @@ // Importing Global Variables -@import "~@redhat-cloud-services/frontend-components-utilities/files/Utilities/_all"; +@import "~@redhat-cloud-services/frontend-components-utilities/styles/_all"; @import "~@redhat-cloud-services/frontend-components/index.css"; diff --git a/src/AppEntry.js b/src/AppEntry.js new file mode 100644 index 00000000..cbcd9596 --- /dev/null +++ b/src/AppEntry.js @@ -0,0 +1,23 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import { BrowserRouter as Router } from 'react-router-dom'; +import { Provider } from 'react-redux'; +import { init } from './store'; +import App from './App'; + +import { getBaseName } from '@redhat-cloud-services/frontend-components-utilities/helpers'; +// import getBaseName from './Utilities/getBaseName'; + +const ImageBuilder = ({ logger }) => ( + + + + + +); + +ImageBuilder.propTypes = { + logger: PropTypes.any +}; + +export default ImageBuilder; diff --git a/src/Components/CreateImageWizard/CreateImageWizard.js b/src/Components/CreateImageWizard/CreateImageWizard.js index 41a8722a..78e7d3d4 100644 --- a/src/Components/CreateImageWizard/CreateImageWizard.js +++ b/src/Components/CreateImageWizard/CreateImageWizard.js @@ -293,6 +293,7 @@ class CreateImageWizard extends Component { return ( Create a RHEL image and push it to cloud providers. diff --git a/src/Routes.js b/src/Routes.js index a4fb9c16..fb5f6a6a 100644 --- a/src/Routes.js +++ b/src/Routes.js @@ -19,8 +19,8 @@ InsightsRoute.propTypes = { export const Routes = () => { return ( - - + + ); diff --git a/src/Utilities.scss b/src/Utilities.scss deleted file mode 100644 index 37b37624..00000000 --- a/src/Utilities.scss +++ /dev/null @@ -1,3 +0,0 @@ -// Sass Imports - -@import "~@redhat-cloud-services/frontend-components-utilities/files/Utilities/_all"; diff --git a/src/bootstrap-dev.js b/src/bootstrap-dev.js new file mode 100644 index 00000000..90f48d1a --- /dev/null +++ b/src/bootstrap-dev.js @@ -0,0 +1,6 @@ +import React from 'react'; +import ReactDOM from 'react-dom'; +import logger from 'redux-logger'; +import ImageBuilder from './AppEntry'; + +ReactDOM.render(, document.getElementById('root')); diff --git a/src/bootstrap.js b/src/bootstrap.js new file mode 100644 index 00000000..0bbc790a --- /dev/null +++ b/src/bootstrap.js @@ -0,0 +1,5 @@ +import React from 'react'; +import ReactDOM from 'react-dom'; +import ImageBuilder from './AppEntry'; + +ReactDOM.render(, document.getElementById('root')); diff --git a/src/entry-dev.js b/src/entry-dev.js index 1598192e..9d41bdf8 100644 --- a/src/entry-dev.js +++ b/src/entry-dev.js @@ -1,18 +1 @@ -import React from 'react'; -import ReactDOM from 'react-dom'; -import { BrowserRouter as Router } from 'react-router-dom'; -import { Provider } from 'react-redux'; -import { init } from './store'; -import App from './App'; -import logger from 'redux-logger'; -import getBaseName from './Utilities/getBaseName'; - -ReactDOM.render( - - - - - , - - document.getElementById('root') -); +import('./bootstrap-dev'); diff --git a/src/entry.js b/src/entry.js index 334599b6..b93c7a02 100644 --- a/src/entry.js +++ b/src/entry.js @@ -1,17 +1 @@ -import React from 'react'; -import ReactDOM from 'react-dom'; -import { BrowserRouter as Router } from 'react-router-dom'; -import { Provider } from 'react-redux'; -import { init } from './store'; -import App from './App'; -import getBaseName from './Utilities/getBaseName'; - -ReactDOM.render( - - - - - , - - document.getElementById('root') -); +import('./bootstrap'); diff --git a/src/store/index.js b/src/store/index.js index 71f3c77a..78d026ba 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -1,4 +1,4 @@ -import ReducerRegistry from '@redhat-cloud-services/frontend-components-utilities/files/ReducerRegistry'; +import { ReducerRegistry } from '@redhat-cloud-services/frontend-components-utilities/ReducerRegistry'; import promiseMiddleware from 'redux-promise-middleware'; import thunk from 'redux-thunk'; import { notificationsReducer } from '@redhat-cloud-services/frontend-components-notifications/redux';