feat: Add OIDC debug mode

client/src/actions/login.js

@@ -54,6 +54,13 @@ authenticateWithOidc.failure = (error, terms) => ({
   },
 });
 
+authenticateWithOidc.debug = (logs) => ({
+  type: ActionTypes.WITH_OIDC_AUTHENTICATE__DEBUG,
+  payload: {
+    logs,
+  },
+});
+
 const clearAuthenticateError = () => ({
   type: ActionTypes.AUTHENTICATE_ERROR_CLEAR,
   payload: {},

client/src/api/access-tokens.js

@@ -13,6 +13,8 @@ const createAccessToken = (data, headers) =>
 const exchangeForAccessTokenWithOidc = (data, headers) =>
   http.post('/access-tokens/exchange-with-oidc?withHttpOnlyToken=true', data, headers);
 
+const debugOidc = (data, headers) => http.post('/access-tokens/debug-oidc', data, headers);
+
 // TODO: rename?
 const acceptTerms = (data, headers) => http.post('/access-tokens/accept-terms', data, headers);
 
@@ -24,6 +26,7 @@ const deleteCurrentAccessToken = (headers) => http.delete('/access-tokens/me', u
 export default {
   createAccessToken,
   exchangeForAccessTokenWithOidc,
+  debugOidc,
   acceptTerms,
   revokePendingToken,
   deleteCurrentAccessToken,

client/src/components/common/Login/Content.jsx

@@ -8,7 +8,8 @@ import React, { useCallback, useEffect, useMemo } from 'react';
 import classNames from 'classnames';
 import { useDispatch, useSelector } from 'react-redux';
 import { useTranslation, Trans } from 'react-i18next';
-import { Button, Divider, Form, Grid, Header, Message } from 'semantic-ui-react';
+import TextareaAutosize from 'react-textarea-autosize';
+import { Button, Divider, Form, Grid, Header, Message, TextArea } from 'semantic-ui-react';
 import { useDidUpdate, usePrevious, useToggle } from '../../../lib/hooks';
 import { Input } from '../../../lib/custom-ui';
 
@@ -23,7 +24,7 @@ import logo from '../../../assets/images/logo.png';
 
 import styles from './Content.module.scss';
 
-const createMessage = (error) => {
+const createMessage = (error, isDebug) => {
   if (!error) {
     return error;
   }
@@ -82,7 +83,7 @@ const createMessage = (error) => {
     default:
       return {
         type: 'warning',
-        content: 'common.unknownError',
+        content: isDebug ? error.message : 'common.unknownError',
       };
   }
 };
@@ -95,6 +96,7 @@ const Content = React.memo(() => {
     isSubmitting,
     isSubmittingWithOidc,
     error,
+    debugLogs,
     step,
   } = useSelector(selectors.selectAuthenticateForm);
 
@@ -124,7 +126,11 @@ const Content = React.memo(() => {
     return initialData;
   });
 
-  const message = useMemo(() => createMessage(error), [error]);
+  const withOidc = !!bootstrap.oidc;
+  const isOidcEnforced = withOidc && bootstrap.oidc.isEnforced;
+  const isOidcDebug = withOidc && bootstrap.oidc.debug;
+
+  const message = useMemo(() => createMessage(error, isOidcDebug), [error, isOidcDebug]);
   const [focusPasswordFieldState, focusPasswordField] = useToggle();
 
   const [emailOrUsernameFieldRef, handleEmailOrUsernameFieldRef] = useNestedRef('inputRef');
@@ -157,14 +163,11 @@ const Content = React.memo(() => {
     dispatch(entryActions.clearAuthenticateError());
   }, [dispatch]);
 
-  const withOidc = !!bootstrap.oidc;
-  const isOidcEnforced = withOidc && bootstrap.oidc.isEnforced;
-
   useEffect(() => {
     if (!isOidcEnforced) {
       emailOrUsernameFieldRef.current.focus();
     }
-  }, [emailOrUsernameFieldRef, isOidcEnforced]);
+  }, [isOidcEnforced, emailOrUsernameFieldRef]);
 
   useDidUpdate(() => {
     if (wasSubmitting && !isSubmitting && error) {
@@ -269,16 +272,27 @@ const Content = React.memo(() => {
                 </>
               )}
               {withOidc && (
-                <Button
-                  fluid
-                  primary={isOidcEnforced}
-                  icon={isOidcEnforced ? 'right arrow' : undefined}
-                  labelPosition={isOidcEnforced ? 'right' : undefined}
-                  content={t('action.logInWithSso')}
-                  loading={isSubmittingWithOidc}
-                  disabled={isSubmitting || isSubmittingWithOidc}
-                  onClick={handleAuthenticateWithOidcClick}
-                />
+                <>
+                  <Button
+                    fluid
+                    primary={isOidcDebug ? undefined : isOidcEnforced}
+                    color={isOidcDebug ? 'orange' : undefined}
+                    icon={isOidcEnforced ? 'right arrow' : undefined}
+                    labelPosition={isOidcEnforced ? 'right' : undefined}
+                    content={isOidcDebug ? t('action.debugSso') : t('action.logInWithSso')}
+                    loading={isSubmittingWithOidc}
+                    disabled={isSubmitting || isSubmittingWithOidc}
+                    onClick={handleAuthenticateWithOidcClick}
+                  />
+                  {debugLogs && (
+                    <TextArea
+                      readOnly
+                      as={TextareaAutosize}
+                      value={debugLogs.join('\n')}
+                      className={styles.debugLog}
+                    />
+                  )}
+                </>
               )}
             </div>
             <div className={styles.poweredBy}>

client/src/components/common/Login/Content.module.scss

@@ -19,6 +19,16 @@
     width: 100%;
   }
 
+  .debugLog {
+    border: 1px solid rgba(9, 30, 66, 0.13);
+    border-radius: 3px;
+    color: #333;
+    line-height: 1.4;
+    margin-top: 16px;
+    padding: 8px 12px;
+    width: 100%;
+  }
+
   .divider {
     font-weight: normal;
   }

client/src/constants/ActionTypes.js

@@ -29,6 +29,7 @@ export default {
   WITH_OIDC_AUTHENTICATE: 'WITH_OIDC_AUTHENTICATE',
   WITH_OIDC_AUTHENTICATE__SUCCESS: 'WITH_OIDC_AUTHENTICATE__SUCCESS',
   WITH_OIDC_AUTHENTICATE__FAILURE: 'WITH_OIDC_AUTHENTICATE__FAILURE',
+  WITH_OIDC_AUTHENTICATE__DEBUG: 'WITH_OIDC_AUTHENTICATE__DEBUG',
   AUTHENTICATE_ERROR_CLEAR: 'AUTHENTICATE_ERROR_CLEAR',
   TERMS_ACCEPT: 'TERMS_ACCEPT',
   TERMS_ACCEPT__SUCCESS: 'TERMS_ACCEPT__SUCCESS',

client/src/locales/ar-YE/login.js

@@ -25,6 +25,7 @@ export default {
     action: {
       cancelAndClose: 'إلغاء وإغلاق',
       continue: 'متابعة',
+      debugSso: 'تصحيح أخطاء تسجيل الدخول الموحد',
       goBack: 'العودة',
       goHome: 'الذهاب للرئيسية',
       logIn: 'تسجيل الدخول',

client/src/locales/bg-BG/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Отказ и затваряне',
       continue: 'Продължи',
+      debugSso: 'Дебъгване на SSO',
       goBack: 'Назад',
       goHome: 'Към началото',
       logIn: 'Вход',

client/src/locales/ca-ES/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Cancel·lar i tancar',
       continue: 'Continuar',
+      debugSso: 'Depurar SSO',
       goBack: 'Tornar',
       goHome: "Anar a l'inici",
       logIn: 'Iniciar sessió',

client/src/locales/cs-CZ/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Zrušit a zavřít',
       continue: 'Pokračovat',
+      debugSso: 'Ladit SSO',
       goBack: 'Zpět',
       goHome: 'Domů',
       logIn: 'Přihlásit se',

client/src/locales/da-DK/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Annuller og luk',
       continue: 'Fortsæt',
+      debugSso: 'Fejlfind SSO',
       goBack: 'Gå tilbage',
       goHome: 'Gå hjem',
       logIn: 'Log på',

client/src/locales/de-DE/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Abbrechen und schließen',
       continue: 'Fortfahren',
+      debugSso: 'SSO debuggen',
       goBack: 'Zurück gehen',
       goHome: 'Zur Startseite',
       logIn: 'Einloggen',

client/src/locales/el-GR/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Ακύρωση και κλείσιμο',
       continue: 'Συνέχεια',
+      debugSso: 'Αποσφαλμάτωση SSO',
       goBack: 'Επιστροφή',
       goHome: 'Αρχική σελίδα',
       logIn: 'Σύνδεση',

client/src/locales/en-GB/login.js

@@ -25,6 +25,7 @@ export default {
     action: {
       cancelAndClose: 'Cancel and close',
       continue: 'Continue',
+      debugSso: 'Debug SSO',
       goBack: 'Go back',
       goHome: 'Go home',
       logIn: 'Log in',

client/src/locales/en-US/login.js

@@ -25,6 +25,7 @@ export default {
     action: {
       cancelAndClose: 'Cancel and close',
       continue: 'Continue',
+      debugSso: 'Debug SSO',
       goBack: 'Go back',
       goHome: 'Go home',
       logIn: 'Log in',

client/src/locales/es-ES/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Cancelar y cerrar',
       continue: 'Continuar',
+      debugSso: 'Depurar SSO',
       goBack: 'Volver',
       goHome: 'Ir al inicio',
       logIn: 'Iniciar sesión',

client/src/locales/et-EE/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Tühista ja sulge',
       continue: 'Jätka',
+      debugSso: 'Siluda SSO',
       goBack: 'Tagasi',
       goHome: 'Koju',
       logIn: 'Logi sisse',

client/src/locales/fa-IR/login.js

@@ -25,6 +25,7 @@ export default {
     action: {
       cancelAndClose: 'لغو و بستن',
       continue: 'ادامه',
+      debugSso: 'اشکال‌زدایی SSO',
       goBack: 'بازگشت',
       goHome: 'رفتن به خانه',
       logIn: 'ورود',

client/src/locales/fi-FI/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Peruuta ja sulje',
       continue: 'Jatka',
+      debugSso: 'Korjaa SSO-virheitä',
       goBack: 'Takaisin',
       goHome: 'Kotiin',
       logIn: 'Kirjaudu sisään',

client/src/locales/fr-FR/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Annuler et fermer',
       continue: 'Continuer',
+      debugSso: 'Déboguer le SSO',
       goBack: 'Retour',
       goHome: "Aller à l'accueil",
       logIn: 'Se connecter',

client/src/locales/hu-HU/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Mégse és bezárás',
       continue: 'Folytatás',
+      debugSso: 'SSO hibakeresése',
       goBack: 'Vissza',
       goHome: 'Kezdőlapra',
       logIn: 'Belépés',

client/src/locales/id-ID/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Batal dan tutup',
       continue: 'Lanjutkan',
+      debugSso: 'Debug SSO',
       goBack: 'Kembali',
       goHome: 'Ke beranda',
       logIn: 'Masuk',

client/src/locales/it-IT/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Annulla e chiudi',
       continue: 'Continua',
+      debugSso: 'Debug SSO',
       goBack: 'Torna indietro',
       goHome: 'Vai alla home',
       logIn: 'Accedi',

client/src/locales/ja-JP/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'キャンセルして閉じる',
       continue: '続行',
+      debugSso: 'SSOをデバッグ',
       goBack: '戻る',
       goHome: 'ホームへ',
       logIn: 'ログイン',

client/src/locales/ko-KR/login.js

@@ -25,6 +25,7 @@ export default {
     action: {
       cancelAndClose: '취소 후 닫기',
       continue: '계속',
+      debugSso: 'SSO 디버그',
       goBack: '뒤로 가기',
       goHome: '홈으로 가기',
       logIn: '로그인',

client/src/locales/nl-NL/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Annuleren en sluiten',
       continue: 'Doorgaan',
+      debugSso: 'SSO debuggen',
       goBack: 'Terug gaan',
       goHome: 'Naar startpagina',
       logIn: 'Inloggen',

client/src/locales/pl-PL/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Anuluj i zamknij',
       continue: 'Kontynuuj',
+      debugSso: 'Debuguj SSO',
       goBack: 'Wróć',
       goHome: 'Idź do domu',
       logIn: 'Zaloguj',

client/src/locales/pt-BR/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Cancelar e fechar',
       continue: 'Continuar',
+      debugSso: 'Depurar SSO',
       goBack: 'Voltar',
       goHome: 'Ir para início',
       logIn: 'Entrar',

client/src/locales/pt-PT/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Cancelar e fechar',
       continue: 'Continuar',
+      debugSso: 'Depurar SSO',
       goBack: 'Voltar',
       goHome: 'Ir para início',
       logIn: 'Iniciar sessão',

client/src/locales/ro-RO/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Anulează și închide',
       continue: 'Continuă',
+      debugSso: 'Depanează SSO',
       goBack: 'Înapoi',
       goHome: 'Acasă',
       logIn: 'Autentificarea',

client/src/locales/ru-RU/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Отменить и закрыть',
       continue: 'Продолжить',
+      debugSso: 'Отладить SSO',
       goBack: 'Назад',
       goHome: 'На главную',
       logIn: 'Войти',

client/src/locales/sk-SK/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Zrušiť a zavrieť',
       continue: 'Pokračovať',
+      debugSso: 'Ladiť SSO',
       goBack: 'Ísť späť',
       goHome: 'Ísť domov',
       logIn: 'Prihlásiť sa',

client/src/locales/sr-Cyrl-RS/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Откажи и затвори',
       continue: 'Настави',
+      debugSso: 'Дебагуј SSO',
       goBack: 'Назад',
       goHome: 'Иди кући',
       logIn: 'Пријава',

client/src/locales/sr-Latn-RS/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Otkaži i zatvori',
       continue: 'Nastavi',
+      debugSso: 'Debaguj SSO',
       goBack: 'Nazad',
       goHome: 'Idi kući',
       logIn: 'Prijava',

client/src/locales/sv-SE/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Avbryt och stäng',
       continue: 'Fortsätt',
+      debugSso: 'Felsök SSO',
       goBack: 'Gå tillbaka',
       goHome: 'Gå hem',
       logIn: 'Logga in',

client/src/locales/tr-TR/login.js

@@ -25,6 +25,7 @@ export default {
     action: {
       cancelAndClose: 'İptal et ve kapat',
       continue: 'Devam et',
+      debugSso: 'SSO hatalarını ayıkla',
       goBack: 'Geri dön',
       goHome: 'Ana sayfaya git',
       logIn: 'Giriş yap',

client/src/locales/uk-UA/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Скасувати та закрити',
       continue: 'Продовжити',
+      debugSso: 'Відлагодити SSO',
       goBack: 'Назад',
       goHome: 'На головну',
       logIn: 'Увійти',

client/src/locales/uz-UZ/login.js

@@ -26,6 +26,7 @@ export default {
     action: {
       cancelAndClose: 'Bekor qilish va yopish',
       continue: 'Davom etish',
+      debugSso: 'SSO ni tuzatish',
       goBack: 'Orqaga',
       goHome: 'Bosh sahifaga',
       logIn: 'Kirish',

client/src/locales/vi-VN/login.js

@@ -25,6 +25,7 @@ export default {
     action: {
       cancelAndClose: 'Hủy và đóng',
       continue: 'Tiếp tục',
+      debugSso: 'Gỡ lỗi SSO',
       goBack: 'Quay lại',
       goHome: 'Về trang chủ',
       logIn: 'Đăng nhập',

client/src/locales/zh-CN/login.js

@@ -25,6 +25,7 @@ export default {
     action: {
       cancelAndClose: '取消并关闭',
       continue: '继续',
+      debugSso: '调试SSO',
       goBack: '返回',
       goHome: '回到首页',
       logIn: '登录',

client/src/locales/zh-TW/login.js

@@ -25,6 +25,7 @@ export default {
     action: {
       cancelAndClose: '取消並關閉',
       continue: '繼續',
+      debugSso: '偵錯SSO',
       goBack: '返回',
       goHome: '回到首頁',
       logIn: '登入',

client/src/reducers/ui/authenticate-form.js

@@ -16,6 +16,7 @@ const initialState = {
   isSubmitting: false,
   isSubmittingWithOidc: false,
   error: null,
+  debugLogs: null,
   pendingToken: null,
   step: null,
   termsForm: {
@@ -91,6 +92,12 @@ export default (state = initialState, { type, payload }) => {
         isSubmittingWithOidc: false,
         error: payload.error,
       };
+    case ActionTypes.WITH_OIDC_AUTHENTICATE__DEBUG:
+      return {
+        ...state,
+        isSubmittingWithOidc: false,
+        debugLogs: payload.logs,
+      };
     case ActionTypes.AUTHENTICATE_ERROR_CLEAR:
       return {
         ...state,

client/src/sagas/login/services/login.js

@@ -106,6 +106,20 @@ export function* authenticateWithOidcCallback() {
     return;
   }
 
+  const oidcBootstrap = yield select(selectors.selectOidcBootstrap);
+
+  if (oidcBootstrap?.debug) {
+    const {
+      included: { logs },
+    } = yield call(api.debugOidc, {
+      code,
+      nonce,
+    });
+
+    yield put(actions.authenticateWithOidc.debug(logs));
+    return;
+  }
+
   let accessToken;
   try {
     ({ item: accessToken } = yield call(api.exchangeForAccessTokenWithOidc, {