Merge pull request #55 from tesler-platform/fix/tesler-ui-sourcemaps

Add tesler-ui source maps for local launch, fix local launch, axios and location typings

Author: Dergash

ui/craco.config.js

@@ -0,0 +1,29 @@
+module.exports = {
+    webpack: {
+        configure: {
+            module: {
+                rules: [
+                    /**
+                     * Fix source map of external dependencies (including @tesler-ui/core)
+                     *
+                     * TODO: Remove when https://github.com/facebook/create-react-app/pull/8227 released
+                     */
+                    {
+                        test: /\.(js|css)$/,
+                        use: ['source-map-loader'],
+                        enforce: 'pre'
+                    }
+                ]
+            },
+            /**
+             * Only relevant when applying some dependecies (e.g. @tesler-ui/core) via symlinks,
+             * so if you are not working on fixing @tesler-ui/core it can safely be removed
+             *
+             * TODO: Revise after https://github.com/facebook/create-react-app/pull/7993
+             */
+            resolve: {
+                symlinks: false
+            }
+        }
+    }
+}

ui/package-lock.json

@@ -3,7 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "start": "react-scripts start",
+    "start": "craco start",
     "build": "react-scripts build && npm run rename",
     "test": "react-scripts test",
     "eject": "react-scripts eject",
@@ -12,7 +12,7 @@
     "rename": "node -e \"require('fs').rename('build/index.html', 'build/index.ftl', function(err) { if (err) console.log(err); console.log('index.ftl formed') })\""
   },
   "dependencies": {
-    "@tesler-ui/core": "1.30.3",
+    "@tesler-ui/core": "1.33.1",
     "@testing-library/jest-dom": "^5.14.1",
     "@testing-library/react": "^10.4.9",
     "@testing-library/user-event": "^10.4.1",
@@ -22,7 +22,7 @@
     "@types/react-dom": "^16.9.13",
     "@types/react-redux": "^7.1.16",
     "antd": "^3.26.20",
-    "axios": "^0.19.2",
+    "axios": "0.19.0",
     "classnames": "^2.3.1",
     "keycloak-js": "^14.0.0",
     "react": "^17.0.2",
@@ -61,9 +61,11 @@
   },
   "homepage": ".",
   "devDependencies": {
+    "craco": "0.0.3",
     "eslint-config-prettier": "^8.3.0",
     "eslint-plugin-prettier": "^3.4.0",
     "http-proxy-middleware": "^2.0.1",
-    "prettier": "^2.3.2"
+    "prettier": "^2.3.2",
+    "source-map-loader": "0.2.4"
   }
 }

ui/package.json

@@ -34,7 +34,7 @@ export default function dataReducer(
  *
  * @param loc
  */
-export function keycloakAwareParseLocation(loc: Location): Route {
+export function keycloakAwareParseLocation(loc: typeof historyObj.location): Route {
     let path: string = loc.pathname
     if (path.startsWith('/')) {
         path = path.substring(1)

ui/src/reducers/router.ts

@@ -1,10 +1,10 @@
-const { createProxyMiddleware } = require('http-proxy-middleware');
+const { createProxyMiddleware } = require('http-proxy-middleware')
 
-module.exports = function(app) {
-  app.use(
-      '/api/v1',
-      createProxyMiddleware({
-        target: 'http://localhost:8080'
-      })
-  );
-};
+module.exports = function (app) {
+    app.use(
+        '/api/v1',
+        createProxyMiddleware({
+            target: 'http://localhost:8080'
+        })
+    )
+}