sync upstream and add roles support for apps menu

Author: kkartunov

.circleci/config.yml

@@ -28,15 +28,15 @@ builddeploy_steps: &builddeploy_steps
   - setup_remote_docker
   - run: *install_dependency
   - run: *install_deploysuite
-  - run: 
+  - run:
       command: |
         ./awsconfiguration.sh $DEPLOY_ENV
         source awsenvconf
         ./buildenv.sh -e $DEPLOY_ENV -b ${LOGICAL_ENV}-${APPNAME}-buildvar
-  - run: 
+  - run:
       command: |
         source buildenvvar
-        ./build.sh ${APPNAME} 
+        ./build.sh ${APPNAME}
   - deploy:
       name: Running MasterScript.
       command: |

README.md

@@ -59,6 +59,7 @@ Make sure you have [Heroky CLI](https://devcenter.heroku.com/articles/heroku-cli
 ### Cross microfrontend imports
 
 This app exports functions to be imported by other microapps.
+
 - `login` - redirects to login page
 - `logout` - clears session storage and redirects to logout page
 - `setAppMenu` - sets sidebar menu for the app by app's `path`
@@ -83,6 +84,7 @@ When we want to use methods exported in the navbar microapp in other apps we hav
 For example see https://github.com/topcoder-platform/micro-frontends-react-app
 
 1. Add `@topcoder/micro-frontends-navbar-app` to `externals` in webpack config:
+
    ```js
    externals: {
       "@topcoder/micro-frontends-navbar-app": "@topcoder/micro-frontends-navbar-app",
@@ -92,13 +94,13 @@ For example see https://github.com/topcoder-platform/micro-frontends-react-app
 2. As `importmaps` only work in browser and don't work in unit test, we have to mock this module in unit tests. For example by creating a file `src/__mocks__/@topcoder/micro-frontends-navbar-app.js` with the content like:
    ```js
    module.exports = {
-      login: () => {},
-      logout: () => {},
-      setAppMenu: () => {},
-      getAuthUserTokens: () => new Promise(() => {}),
-      getAuthUserProfile: () => new Promise(() => {}),
-      disableSidebarForRoute: () => {},
-      enableSidebarForRoute: () => {},
+     login: () => {},
+     logout: () => {},
+     setAppMenu: () => {},
+     getAuthUserTokens: () => new Promise(() => {}),
+     getAuthUserProfile: () => new Promise(() => {}),
+     disableSidebarForRoute: () => {},
+     enableSidebarForRoute: () => {},
    };
    ```
 
@@ -107,13 +109,15 @@ For example see https://github.com/topcoder-platform/micro-frontends-react-app
 For example see https://github.com/topcoder-platform/micro-frontends-angular-app
 
 1. Add `@topcoder/micro-frontends-navbar-app` to `externals` in webpack config:
+
    ```js
    externals: {
       "@topcoder/micro-frontends-navbar-app": "@topcoder/micro-frontends-navbar-app",
     },
    ```
 
 2. Add type definition in `src/typings.d.ts`:
+
    ```js
    declare module '@topcoder/micro-frontends-navbar-app' {
      export const login: any;
@@ -123,7 +127,7 @@ For example see https://github.com/topcoder-platform/micro-frontends-angular-app
      export const getAuthUserProfile: any;
      export const disableSidebarForRoute: any;
      export const enableSidebarForRoute: any;
-  }
+   }
    ```
 
 3. TODO: How to make e2e tests work for Angular? So far they fail with error `Module not found: Error: Can't resolve '@topcoder/micro-frontends-navbar-app'`

babel.config.js

@@ -1,59 +1,57 @@
 let cssLocalIdent;
-if (process.env.APPMODE == 'development') {
-  cssLocalIdent = 'navbar_[path][name]___[local]___[hash:base64:6]';
+if (process.env.APPMODE == "development") {
+  cssLocalIdent = "navbar_[path][name]___[local]___[hash:base64:6]";
 } else {
-  cssLocalIdent = '[hash:base64:6]';
+  cssLocalIdent = "[hash:base64:6]";
 }
 
 const config = {
-  presets: ['@babel/preset-env', '@babel/preset-react'],
+  presets: ["@babel/preset-env", "@babel/preset-react"],
   plugins: [
     [
-      '@babel/plugin-transform-runtime',
+      "@babel/plugin-transform-runtime",
       {
         useESModules: true,
-        regenerator: false
-      }
+        regenerator: false,
+      },
     ],
     [
-      'module-resolver',
+      "module-resolver",
       {
-        extensions: ['.js', '.jsx'],
-        root: [
-          './src'
-        ]
-      }
+        extensions: [".js", ".jsx"],
+        root: ["./src"],
+      },
     ],
     [
-      'inline-react-svg',
+      "inline-react-svg",
       {
-        ignorePattern: '[/\/]assets[/\/]images'
-      }
+        ignorePattern: "[//]assets[//]images",
+      },
     ],
     [
-      'react-css-modules',
+      "react-css-modules",
       {
         filetypes: {
-          '.scss': {
-            syntax: 'postcss-scss'
-          }
+          ".scss": {
+            syntax: "postcss-scss",
+          },
         },
-        generateScopedName: cssLocalIdent
-      }
-    ]
+        generateScopedName: cssLocalIdent,
+      },
+    ],
   ],
   env: {
     test: {
       presets: [
         [
-          '@babel/preset-env',
+          "@babel/preset-env",
           {
-            targets: 'current node'
-          }
-        ]
-      ]
-    }
-  }
-}
+            targets: "current node",
+          },
+        ],
+      ],
+    },
+  },
+};
 
 module.exports = config;

config/dev.js

@@ -2,9 +2,9 @@ module.exports = {
   URL: {
     ACCOUNTS_APP_CONNECTOR: "https://accounts-auth0.topcoder-dev.com", // "http://localhost:5000"
     AUTH: "https://accounts-auth0.topcoder-dev.com", // "http://localhost:5000"
-    TC_NOTIFICATION_URL: 'https://api.topcoder-dev.com/v5/notifications',
-    CONNECT_DOMAIN: 'https://connect.topcoder-dev.com',
-    COMMUNITY_DOMAIN: 'https://www.topcoder-dev.com',
+    TC_NOTIFICATION_URL: "https://api.topcoder-dev.com/v5/notifications",
+    CONNECT_DOMAIN: "https://connect.topcoder-dev.com",
+    COMMUNITY_DOMAIN: "https://www.topcoder-dev.com",
   },
   API: {
     V3: "https://api.topcoder-dev.com/v3",

config/prod.js

@@ -2,9 +2,9 @@ module.exports = {
   URL: {
     ACCOUNTS_APP_CONNECTOR: "https://accounts-auth0.topcoder.com",
     AUTH: "https://accounts-auth0.topcoder.com",
-    TC_NOTIFICATION_URL: 'https://api.topcoder.com/v5/notifications',
-    CONNECT_DOMAIN: 'https://connect.topcoder.com',
-    COMMUNITY_DOMAIN: 'https://www.topcoder.com',
+    TC_NOTIFICATION_URL: "https://api.topcoder.com/v5/notifications",
+    CONNECT_DOMAIN: "https://connect.topcoder.com",
+    COMMUNITY_DOMAIN: "https://www.topcoder.com",
   },
   API: {
     V3: "https://api.topcoder.com/v3",

docker/docker-compose.yml

@@ -1,4 +1,4 @@
-version: '3'
+version: "3"
 services:
   micro-frontends-navbar-app:
     image: micro-frontends-navbar-app:latest