From 133c46c3489ba44e4eea85f7d556ba1ac892d0a2 Mon Sep 17 00:00:00 2001 From: asefubeierl Date: Tue, 19 Nov 2024 15:55:36 +0100 Subject: [PATCH 1/5] feat: adds reroute link from error page to login --- src/bootstrap.tsx | 25 +++++++--- src/components/RerouteToLogin/index.tsx | 65 +++++++++++++++++++++++++ src/i18n/translations.ts | 6 ++- src/index.less | 6 +++ 4 files changed, 93 insertions(+), 9 deletions(-) create mode 100644 src/components/RerouteToLogin/index.tsx diff --git a/src/bootstrap.tsx b/src/bootstrap.tsx index d5a7afb0a..a5d2867a9 100644 --- a/src/bootstrap.tsx +++ b/src/bootstrap.tsx @@ -68,6 +68,7 @@ import { SHOGunAPIClient } from '@terrestris/shogun-util/dist/service/SHOGunAPIC const App = React.lazy(() => import('./App')); +import RerouteToLogin from './components/RerouteToLogin'; import { PluginProvider } from './context/PluginContext'; @@ -811,6 +812,7 @@ const renderApp = async () => { } let type: AlertProps['type'] = 'warning'; + let action: React.ReactNode; let errorDescription = i18n.t('Index.errorDescription'); if ((error as Error)?.message === LoadingErrorCode.APP_ID_NOT_SET) { @@ -820,6 +822,10 @@ const renderApp = async () => { if ((error as Error)?.message === LoadingErrorCode.APP_UNAUTHORIZED) { errorDescription = i18n.t('Index.permissionDeniedUnauthorized'); type = 'error'; + action = + ; } if ((error as Error)?.message === LoadingErrorCode.APP_CONFIG_NOT_FOUND) { @@ -836,13 +842,18 @@ const renderApp = async () => { root.render( - + + <> + + + ); } diff --git a/src/components/RerouteToLogin/index.tsx b/src/components/RerouteToLogin/index.tsx new file mode 100644 index 000000000..6fa8c2793 --- /dev/null +++ b/src/components/RerouteToLogin/index.tsx @@ -0,0 +1,65 @@ +import React, { + useEffect, + useState +} from 'react'; + +import { + DoubleLeftOutlined +} from '@ant-design/icons'; + +import { + Button, + Tooltip, + Flex +} from 'antd'; + +import useSHOGunAPIClient from '../../hooks/useSHOGunAPIClient'; + +export interface RerouteToLoginProps { + rerouteMsg: string; +} + +const RerouteToLogin: React.FC = ({ + rerouteMsg +}) => { + + const [loginUrl, setLoginUrl] = useState(); + + const client = useSHOGunAPIClient(); + const keycloak = client?.getKeycloak(); + + useEffect(() => { + const getLoginUrl = async () => { + const url = await keycloak?.createLoginUrl(); + setLoginUrl(url); + }; + + getLoginUrl(); + }, [keycloak]); + + const onLoginLinkClick = () => { + if (keycloak) { + window.open(loginUrl, '_self'); + } + }; + + return ( + + + + + {rerouteMsg} + + ); +}; + +export default RerouteToLogin; diff --git a/src/i18n/translations.ts b/src/i18n/translations.ts index 9ed5c6301..c6e81eb8b 100644 --- a/src/i18n/translations.ts +++ b/src/i18n/translations.ts @@ -162,7 +162,8 @@ export default { errorDescriptionAppIdNotSet: 'Keine Applikations-ID angegeben. Bitte geben Sie die ID als Abfrageparameter an, z.B. ?applicationId=1909', errorDescriptionAppConfigNotFound: 'Die Applikation mit der ID {{applicationId}} konnte nicht geladen werden.', errorDescriptionAppConfigStaticNotFound: 'Die Konfiguration der Applikation konnte nicht geladen werden.', - permissionDeniedUnauthorized: 'Dies ist keine öffentliche Applikation. Anmeldung erforderlich.' + permissionDeniedUnauthorized: 'Dies ist keine öffentliche Applikation. Anmeldung erforderlich.', + rerouteToLoginPage: 'Zurück zur Anmeldeseite.' }, Nominatim: { placeholder: 'Ortsname, Straßenname, Stadtteilname, POI usw.' @@ -453,7 +454,8 @@ export default { errorDescriptionAppIdNotSet: 'No application ID given. Please provide the ID as query parameter, e.g. ?applicationId=1909', errorDescriptionAppConfigNotFound: 'The application with ID {{applicationId}} could not be loaded correctly.', errorDescriptionAppConfigStaticNotFound: 'The configuration of the application could not be loaded correctly.', - permissionDeniedUnauthorized: 'This application is not public. Authentication required.' + permissionDeniedUnauthorized: 'This application is not public. Authentication required.', + rerouteToLoginPage: 'Return to login page.' }, Nominatim: { placeholder: 'Place name, street name, district name, POI, etc.' diff --git a/src/index.less b/src/index.less index ea3a56bdb..ca5f272fd 100644 --- a/src/index.less +++ b/src/index.less @@ -33,9 +33,15 @@ body, .error-boundary { min-width: 400px; + min-height: 125px; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); + + .ant-alert-action{ + position: absolute; + top: 70%; + } } From a06b8ee710f819cbb97d41d17f05e27f5dccbcc3 Mon Sep 17 00:00:00 2001 From: asefubeierl Date: Thu, 21 Nov 2024 13:51:02 +0100 Subject: [PATCH 2/5] fix: remove empty element and add check --- src/bootstrap.tsx | 24 +++++++++++------------- src/components/RerouteToLogin/index.tsx | 4 +++- 2 files changed, 14 insertions(+), 14 deletions(-) diff --git a/src/bootstrap.tsx b/src/bootstrap.tsx index a5d2867a9..8d94cbb6a 100644 --- a/src/bootstrap.tsx +++ b/src/bootstrap.tsx @@ -823,9 +823,9 @@ const renderApp = async () => { errorDescription = i18n.t('Index.permissionDeniedUnauthorized'); type = 'error'; action = - ; + ; } if ((error as Error)?.message === LoadingErrorCode.APP_CONFIG_NOT_FOUND) { @@ -843,16 +843,14 @@ const renderApp = async () => { root.render( - <> - - + ); diff --git a/src/components/RerouteToLogin/index.tsx b/src/components/RerouteToLogin/index.tsx index 6fa8c2793..937fa831c 100644 --- a/src/components/RerouteToLogin/index.tsx +++ b/src/components/RerouteToLogin/index.tsx @@ -31,7 +31,9 @@ const RerouteToLogin: React.FC = ({ useEffect(() => { const getLoginUrl = async () => { const url = await keycloak?.createLoginUrl(); - setLoginUrl(url); + if (url) { + setLoginUrl(url); + } }; getLoginUrl(); From 080d5827293cd25d9b0101bf7020eef076209e09 Mon Sep 17 00:00:00 2001 From: Amanda Sefu-Beierl <130636985+AmandaTamanda@users.noreply.github.com> Date: Fri, 22 Nov 2024 10:11:57 +0100 Subject: [PATCH 3/5] fix: white space Co-authored-by: Daniel Koch --- src/index.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/index.less b/src/index.less index ca5f272fd..df7af80c5 100644 --- a/src/index.less +++ b/src/index.less @@ -40,7 +40,7 @@ body, -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); - .ant-alert-action{ + .ant-alert-action { position: absolute; top: 70%; } From f76cf9580c18ec374fd6ef12ebd2786385c9ecae Mon Sep 17 00:00:00 2001 From: asefubeierl Date: Fri, 22 Nov 2024 10:19:29 +0100 Subject: [PATCH 4/5] fix: rewording of translation text --- src/i18n/translations.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/i18n/translations.ts b/src/i18n/translations.ts index c6e81eb8b..fe8b1cc7e 100644 --- a/src/i18n/translations.ts +++ b/src/i18n/translations.ts @@ -163,7 +163,7 @@ export default { errorDescriptionAppConfigNotFound: 'Die Applikation mit der ID {{applicationId}} konnte nicht geladen werden.', errorDescriptionAppConfigStaticNotFound: 'Die Konfiguration der Applikation konnte nicht geladen werden.', permissionDeniedUnauthorized: 'Dies ist keine öffentliche Applikation. Anmeldung erforderlich.', - rerouteToLoginPage: 'Zurück zur Anmeldeseite.' + rerouteToLoginPage: 'Zur Anmeldeseite.' }, Nominatim: { placeholder: 'Ortsname, Straßenname, Stadtteilname, POI usw.' @@ -455,7 +455,7 @@ export default { errorDescriptionAppConfigNotFound: 'The application with ID {{applicationId}} could not be loaded correctly.', errorDescriptionAppConfigStaticNotFound: 'The configuration of the application could not be loaded correctly.', permissionDeniedUnauthorized: 'This application is not public. Authentication required.', - rerouteToLoginPage: 'Return to login page.' + rerouteToLoginPage: 'To login page.' }, Nominatim: { placeholder: 'Place name, street name, district name, POI, etc.' From 553d51202a49124339fa0e76e022ce66446b607e Mon Sep 17 00:00:00 2001 From: asefubeierl Date: Tue, 26 Nov 2024 13:23:14 +0100 Subject: [PATCH 5/5] fix: styling --- src/index.less | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/index.less b/src/index.less index df7af80c5..38b597c3a 100644 --- a/src/index.less +++ b/src/index.less @@ -33,7 +33,6 @@ body, .error-boundary { min-width: 400px; - min-height: 125px; position: absolute; left: 50%; top: 50%; @@ -42,6 +41,8 @@ body, .ant-alert-action { position: absolute; + padding-top: 6px; top: 70%; + left: 10%; } }