From 0d8be4597030512267a1dea4703b9a3374a70a7f Mon Sep 17 00:00:00 2001 From: Gordon Grund <80682839+ggrund-tsi@users.noreply.github.com> Date: Wed, 20 Apr 2022 15:57:30 +0200 Subject: [PATCH] feat: display environment infotext (#299) * add environment info text * inserted new line in environment text * changed sie to Sie * role for poc-nat-admin * fix build * remove any workaround * Update routing.component.tsx Co-authored-by: fOppenheimer --- package.json | 21 ++++++--- src/assets/SCSS/custom.scss | 47 +++++++++++++++---- src/assets/i18n/de/translation.json | 4 +- .../modals/group-modal.component.tsx | 2 +- src/components/modules/header.component.tsx | 42 +++++++++++++++-- src/i18n.tsx | 2 +- src/routing.component.tsx | 2 +- 7 files changed, 94 insertions(+), 26 deletions(-) diff --git a/package.json b/package.json index bbddeff..4dde904 100644 --- a/package.json +++ b/package.json @@ -5,6 +5,7 @@ "dependencies": { "@fortawesome/fontawesome-free": "^5.15.3", "@react-keycloak/web": "^3.4.0", + "@testing-library/dom": "^8.13.0", "@testing-library/jest-dom": "^5.11.4", "@testing-library/react": "^11.1.0", "@testing-library/user-event": "^12.1.10", @@ -12,12 +13,12 @@ "@types/file-saver": "^2.0.2", "@types/jest": "^26.0.15", "@types/node": "^12.0.0", - "@types/qrcode.react": "^1.0.1", "@types/react": "^17.0.0", "@types/react-datepicker": "^4.3.4", "@types/react-dom": "^17.0.0", "@types/react-pdf": "^5.0.2", - "@types/react-router-dom": "^5.1.7", + "@types/react-router-dom": "^5.3.3", + "@types/qrcode.react": "^1.0.1", "@types/uuid": "^8.3.0", "axios": "^0.21.1", "bootstrap": "^4.6.0", @@ -27,26 +28,32 @@ "husky": "^5.1.3", "i18next": "^19.9.2", "i18next-resource-store-loader": "^0.1.2", + "jquery": "1.9.1", "keycloak-js": "^12.0.4", "lint-staged": "^10.5.4", "moment": "^2.29.1", + "popper.js": "1.16.1", "prettier": "^2.2.1", - "qrcode.react": "^1.0.1", - "react": "^17.0.1", + "prop-types": "15.7.0", + "qrcode.react": "^1.0.0", + "react": "^17.0.0", "react-bootstrap": "^1.5.2", "react-datepicker": "^4.6.0", - "react-dom": "^17.0.1", + "react-dom": "^17.0.0", "react-i18next": "^11.8.10", "react-moment": "^1.1.1", "react-pdf": "^5.2.0", "react-qr-reader": "^2.2.1", - "react-router-dom": "^5.2.0", + "react-router-dom": "^5.3.1", "react-scripts": "4.0.3", "sass": "^1.43.4", "typescript": "^4.1.2", "uuid": "^8.3.2", "web-vitals": "^1.0.1" }, + "resolutions": { + "@types/react": "17.0.43" + }, "lint-staged": { "src/**/*.{js,jsx,ts,tsx,json,css,scss,md}": [ "prettier --write" @@ -88,4 +95,4 @@ "http-proxy-middleware": "^1.1.1", "https-proxy-agent": "^5.0.0" } -} +} \ No newline at end of file diff --git a/src/assets/SCSS/custom.scss b/src/assets/SCSS/custom.scss index d40a070..4b1cbba 100644 --- a/src/assets/SCSS/custom.scss +++ b/src/assets/SCSS/custom.scss @@ -61,8 +61,16 @@ hr { #qt-header { margin: 0; - padding: 1rem; - height: 84px; + padding: 1rem 1rem 0rem 1rem; + // height: 84px; + width: 100%; + text-align: center; + justify-content: center; +} + +#qt-environment { + margin: 0; + padding: 0; width: 100%; text-align: center; justify-content: center; @@ -211,11 +219,25 @@ hr { color: #757575; } +#c19-logo { + width: 54px; + height: 54px; +} + .header-font { font-family: "TeleNeo"; font-weight: bold; font-size: 26px; color: black; + white-space: pre-line; + line-height: 24px; +} +.environment-font { + font-family: "TeleNeo"; + font-weight: bold; + font-size: 22px; + color: red; + white-space: pre-line; } // @media screen and (max-device-width: 480px) { @@ -358,14 +380,14 @@ hr { position: inherit; width: 20px; height: 20px; - margin-top: 0.1rem;; + margin-top: 0.1rem; } .rdb-label { height: 20px; align-self: center; padding-left: 0.5rem; } -.toast-container{ +.toast-container { display: flex; position: absolute; justify-content: center; @@ -388,7 +410,6 @@ hr { background: #d4edda; padding: 0%; color: #155724; - } .qt-notification-text { @@ -493,12 +514,18 @@ td { text-decoration: underline !important; font-weight: bolder; } -.disclaimer-text{ +.disclaimer-text { text-align: justify; white-space: pre-line; margin: 0%; } -.speech-bubble{ +.environment-info-text { + width:100%; + text-align: center; + white-space: pre-line; + margin: 0%; +} +.speech-bubble { display: flex; align-self: baseline; margin-left: 0.1rem; @@ -544,6 +571,6 @@ td { .btn-add-statistic-icon { padding: 0px; border: 0px; - width:24px; - height:24px; -} \ No newline at end of file + width: 24px; + height: 24px; +} diff --git a/src/assets/i18n/de/translation.json b/src/assets/i18n/de/translation.json index b52b0f7..1d60f1f 100644 --- a/src/assets/i18n/de/translation.json +++ b/src/assets/i18n/de/translation.json @@ -154,5 +154,7 @@ "enablePcr": "PoC-NAA-Test erlauben", "LP217198-3": "Antigen-Schnelltest", "LP6464-4": "PoC-NAA-Test", - "test-type": "Testtyp" + "test-type": "Testtyp", + "environment-info1": "Hinweis: Dies ist ein Schulungssystem.\nFür die Erfassung echter Patientendaten darf nur das Produktivsystem genutzt werden.\n Das Produktivsystem erreichen Sie unter ", + "environment-info-link": "https://schnelltestportal.de/qt" } \ No newline at end of file diff --git a/src/components/modals/group-modal.component.tsx b/src/components/modals/group-modal.component.tsx index 60a020a..23fd80d 100644 --- a/src/components/modals/group-modal.component.tsx +++ b/src/components/modals/group-modal.component.tsx @@ -353,7 +353,7 @@ const GroupModal = (props: any) => { maxLength={300} /> - {utils.hasRole(keycloak, 'c19_quick_test_counter') + {utils.hasRole(keycloak, 'c19_quick_test_poc_nat_admin') ? { const navigation = useNavigation(); + const history = useHistory(); const { t } = useTranslation(); const { keycloak } = useKeycloak(); @@ -68,11 +70,41 @@ const Header = (props: any) => { {/* user icon and user name */} - - - {t('translation:title')}{environmentName ? ' - ' + environmentName : ''} + + + {t('translation:title')} + {!environmentName + ? <> + : + {'\n' + environmentName} + + } + {!(environmentName && history.location.pathname === navigation?.routes.root) + ? <> + : < span className='environment-info-text py-3'> + + {t('translation:environment-info1')} + { + {t('translation:environment-info-link')} + } + {'.'} + + + } + + {/* {!environmentName + ? <> + : + + {environmentName} + + + } */} { - + ) } diff --git a/src/i18n.tsx b/src/i18n.tsx index 91e4ef4..b03d080 100644 --- a/src/i18n.tsx +++ b/src/i18n.tsx @@ -29,7 +29,7 @@ i18n.use(initReactI18next).init({ lng: 'de', resources: resBundle, fallbackLng: 'en', - debug: true, + debug: false, /* can have multiple namespace, in case you want to divide a huge translation into smaller pieces and load them on demand */ ns: ['translations'], defaultNS: 'translations', diff --git a/src/routing.component.tsx b/src/routing.component.tsx index 1bfba15..a5d7509 100644 --- a/src/routing.component.tsx +++ b/src/routing.component.tsx @@ -201,4 +201,4 @@ const Routing = () => { ) } -export default Routing; \ No newline at end of file +export default Routing;