From a20f775f63e4d080ddee9cc51bd723f8cafc6ca3 Mon Sep 17 00:00:00 2001 From: Jeff Go Date: Thu, 16 Apr 2020 22:14:56 +0800 Subject: [PATCH] ENG-233 amended page /debug --- config/env.js | 1 + sass/entblue-viewpage/EntBlueViewPage.scss | 56 ++++++++++++++++++++++ sass/index.scss | 1 + sass/patternfly.scss | 1 + src/app-init/router.js | 1 + src/auth/default/DefaultAuthProvider.js | 7 ++- src/ui/app/App.js | 7 ++- src/ui/debug-info/DebugInfo.js | 19 ++++++++ 8 files changed, 90 insertions(+), 3 deletions(-) create mode 100644 sass/entblue-viewpage/EntBlueViewPage.scss create mode 100644 src/ui/debug-info/DebugInfo.js diff --git a/config/env.js b/config/env.js index 3efb1ac9f..22328a00c 100644 --- a/config/env.js +++ b/config/env.js @@ -81,6 +81,7 @@ function getClientEnvironment(publicUrl) { DIGITAL_EXCHANGE_UI_ENABLED: process.env.DIGITAL_EXCHANGE_UI_ENABLED === 'true', KEYCLOAK_ENABLED: process.env.KEYCLOAK_ENABLED === 'true', KEYCLOAK_JSON: process.env.KEYCLOAK_JSON || `${(process.env.DOMAIN || '')}/keycloak.json`, + APP_BUILDER_VERSION: process.env.npm_package_version, }, ); diff --git a/sass/entblue-viewpage/EntBlueViewPage.scss b/sass/entblue-viewpage/EntBlueViewPage.scss new file mode 100644 index 000000000..d6bdecd86 --- /dev/null +++ b/sass/entblue-viewpage/EntBlueViewPage.scss @@ -0,0 +1,56 @@ +.EntBlueViewPage { + display: grid; + width: 100vw; + height: 100%; + background-repeat: no-repeat; + background-position: center; + background-size: cover; + grid-template-columns: 1fr minmax(auto, 653px) 1fr; + grid-template-rows: minmax(auto, 233px) 534px 1fr; + + &__center-box { + display: grid; + max-width: 1140px; + background-color: $color-white; + font-family: "Roboto"; + grid-row: 2/3; + grid-column: 2/3; + grid-template-columns: 1fr; + grid-template-rows: 1fr 2fr 1fr; + } + + &__brand { + display: grid; + align-content: center; + align-items: center; + justify-content: center; + justify-items: center; + grid-template-columns: 1fr; + grid-template-rows: 1fr 60px; + } + + &__logo { + align-self: flex-start; + width: 223px; + height: 58px; + margin-top: 50px; + background-repeat: no-repeat; + } + + &__description { + align-self: flex-start; + margin-top: 16px; + color: $e6-blue; + font-size: 18px; + font-weight: 400; + letter-spacing: -.17px; + line-height: 30px; + text-align: center; + opacity: 90%; + } + + &__values { + padding: 30px 50px; + font-size: 14px; + } +} \ No newline at end of file diff --git a/sass/index.scss b/sass/index.scss index 58c151127..e1979bda5 100644 --- a/sass/index.scss +++ b/sass/index.scss @@ -99,3 +99,4 @@ @import "digital-exchange/components/ComponentListViewModeSwitcher"; @import "digital-exchange/settings/SettingsList"; @import "ddtable/DDTable"; +@import "entblue-viewpage/EntBlueViewPage"; diff --git a/sass/patternfly.scss b/sass/patternfly.scss index 1541cd574..624b83ca8 100644 --- a/sass/patternfly.scss +++ b/sass/patternfly.scss @@ -30,6 +30,7 @@ $color-de-component-failed-button: #c45500; $color-de-list-icon-active: #363636; $color-de-list-icon: #BBBBBB; $color-de-component-border: #C3C3C3; +$e6-blue: #002F87; //FontAwesome icons $fa-check: "\f00c"; diff --git a/src/app-init/router.js b/src/app-init/router.js index 6b41f490f..703fc99d4 100644 --- a/src/app-init/router.js +++ b/src/app-init/router.js @@ -99,3 +99,4 @@ export const ROUTE_ATTRIBUTE_MONOLIST_ADD = '/datatype/attribute/:entityCode/Mon export const ROUTE_ATTRIBUTE_MONOLIST_PROFILE_ADD = '/profiletype/attribute/:entityCode/MonolistAdd/:attributeCode'; export const ROUTE_RELOAD_CONFIG = '/reloadConfiguration'; export const ROUTE_RELOAD_CONFIRM = '/reloadConfiguration/confirm'; +export const ROUTE_DEBUG_INFO = '/debug'; diff --git a/src/auth/default/DefaultAuthProvider.js b/src/auth/default/DefaultAuthProvider.js index 88ea45c92..32a27a35f 100644 --- a/src/auth/default/DefaultAuthProvider.js +++ b/src/auth/default/DefaultAuthProvider.js @@ -1,13 +1,18 @@ import React from 'react'; import PropTypes from 'prop-types'; import DefaultAuthContext from 'auth/default/DefaultAuthContext'; -import { history, ROUTE_HOME, ROUTE_DASHBOARD } from 'app-init/router'; +import { history, ROUTE_HOME, ROUTE_DASHBOARD, ROUTE_DEBUG_INFO } from 'app-init/router'; const DefaultAuthProvider = ({ children }) => { const auth = { enabled: false, authenticated: false, logout: (status) => { + const publicRoutes = [ROUTE_DEBUG_INFO]; + if (publicRoutes.indexOf(status.pathname) !== -1) { + return; + } + const redirException = [ROUTE_HOME, ROUTE_DASHBOARD]; const addredirect = status && diff --git a/src/ui/app/App.js b/src/ui/app/App.js index cb5bc1617..d7adfa1b1 100644 --- a/src/ui/app/App.js +++ b/src/ui/app/App.js @@ -88,6 +88,7 @@ import { ROUTE_DE_CONFIG_EDIT, ROUTE_DE_CONFIG_ADD, ROUTE_PLUGINS, + ROUTE_DEBUG_INFO, } from 'app-init/router'; import LoginFormContainer from 'ui/login/LoginFormContainer'; @@ -147,6 +148,7 @@ import EditDataTypesPage from 'ui/data-types/edit/EditDataTypesPage'; import AddDataTypeAttributePage from 'ui/data-types/attributes/AddDataTypeAttributePage'; import EditDataTypeAttributePage from 'ui/data-types/attributes/EditDataTypeAttributePage'; import MonolistPageContainer from 'ui/data-types/attributes/monolist/MonolistPageContainer'; +import DebugInfo from 'ui/debug-info/DebugInfo'; // component repository import ComponentListPage from 'ui/digital-exchange/components/list/ComponentListPage'; import ComponentListPageDisabled from 'ui/digital-exchange/components/list/ComponentListPageDisabled'; @@ -318,6 +320,7 @@ const getRouteComponent = () => ( + { /* app routes */ } {appsRoutes} {/* 404 */} @@ -337,11 +340,11 @@ class App extends Component { isReady, username, } = this.props; - if (!username && currentRoute !== ROUTE_HOME) { + if (!username && [ROUTE_HOME, ROUTE_DEBUG_INFO].indexOf(currentRoute) === -1) { return ; } - const readyDisplay = !auth.enabled || auth.authenticated + const readyDisplay = !auth.enabled || auth.authenticated || currentRoute === ROUTE_DEBUG_INFO ? getRouteComponent() : ; diff --git a/src/ui/debug-info/DebugInfo.js b/src/ui/debug-info/DebugInfo.js new file mode 100644 index 000000000..4e1dfb508 --- /dev/null +++ b/src/ui/debug-info/DebugInfo.js @@ -0,0 +1,19 @@ +import React from 'react'; + +const DebugInfo = () => ( +
+
+
+
+
Debug Information
+
+
+

App Builder version: {process.env.APP_BUILDER_VERSION}

+

Browser Info: {window.navigator.userAgent}

+

OS Info: {window.navigator.platform}

+
+
+
+); + +export default DebugInfo;