From 40c126b828b042dc9d50cd158f5659d7999357c9 Mon Sep 17 00:00:00 2001 From: petrKavulok Date: Fri, 7 Jul 2023 11:29:07 +0200 Subject: [PATCH 01/13] bootstrap v4->v5 update --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 8059359..16ecb76 100644 --- a/package.json +++ b/package.json @@ -47,7 +47,7 @@ "dependencies": { "@coreui/icons": "^1.0.1", "axios": "^0.21.1", - "bootstrap": "4.6.0", + "bootstrap": "^5", "core-js": "3", "date-fns": "^2.28.0", "i18next": "^19.7.0", From 0bed38ecc83b5580c5af996e481a9d02f6c099a4 Mon Sep 17 00:00:00 2001 From: petrKavulok Date: Wed, 12 Jul 2023 14:20:37 +0200 Subject: [PATCH 02/13] layout refactorization --- src/modules/auth/otp/TOTPScreen.js | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/src/modules/auth/otp/TOTPScreen.js b/src/modules/auth/otp/TOTPScreen.js index 9f11987..ac7eb7f 100644 --- a/src/modules/auth/otp/TOTPScreen.js +++ b/src/modules/auth/otp/TOTPScreen.js @@ -222,8 +222,8 @@ function ActivateTOTP(props) { {props.secret} - - + + + /> {props.errors.otp ? - {props.errors.otp.message} + {props.errors.otp.message} : - {t('TOTPScreen|Enter the code from authenticator app')} + {t('TOTPScreen|Enter the code from authenticator app')} } - - + + ) From 2e4b8987be75d666749d02b552fc7e4e68e88d2b Mon Sep 17 00:00:00 2001 From: petrKavulok Date: Wed, 12 Jul 2023 14:32:14 +0200 Subject: [PATCH 03/13] obsolete components import removal --- src/modules/auth/otp/TOTPScreen.js | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/src/modules/auth/otp/TOTPScreen.js b/src/modules/auth/otp/TOTPScreen.js index ac7eb7f..c6afb6d 100644 --- a/src/modules/auth/otp/TOTPScreen.js +++ b/src/modules/auth/otp/TOTPScreen.js @@ -8,7 +8,7 @@ import QRCode from "react-qr-code"; import { Container, Row, Col, Card, CardHeader, CardTitle, CardSubtitle, CardBody, CardFooter, - Form, FormGroup, FormText, Label, Input, Button, FormFeedback + Form, FormText, Input, Button, FormFeedback } from 'reactstrap'; import { factorChaining } from "../utils/factorChaining"; @@ -223,7 +223,7 @@ function ActivateTOTP(props) { - + {props.errors.otp ? {props.errors.otp.message} @@ -247,6 +248,7 @@ function ActivateTOTP(props) { className="justify-content-center my-2" color="primary" type="submit" + disabled={props.isSubmitting} > {t("TOTPScreen|Activate OTP")} @@ -271,18 +273,18 @@ function DeactivateTOTP(props) { - - + + - + ) From 0977febb20d5705bf3947fee69d926b4de2a844b Mon Sep 17 00:00:00 2001 From: petrKavulok Date: Thu, 13 Jul 2023 12:59:31 +0200 Subject: [PATCH 04/13] reactstrap layout update to match bootstrap v5 --- src/modules/auth/email/EmailScreen.js | 53 +++--- src/modules/auth/number/PhoneNumberScreen.js | 51 +++--- src/modules/auth/passwd/ChangePwdScreen.js | 180 +++++++++---------- src/modules/auth/passwd/ForgetPwdScreen.js | 15 +- src/modules/auth/webauthn/WebAuthnScreen.js | 3 +- 5 files changed, 146 insertions(+), 156 deletions(-) diff --git a/src/modules/auth/email/EmailScreen.js b/src/modules/auth/email/EmailScreen.js index 25c0dd7..21882fa 100644 --- a/src/modules/auth/email/EmailScreen.js +++ b/src/modules/auth/email/EmailScreen.js @@ -7,7 +7,7 @@ import { Link, useHistory, useLocation } from "react-router-dom"; import { Container, Row, Col, Card, CardHeader, CardTitle, CardSubtitle, CardBody, CardFooter, - Form, FormGroup, FormFeedback, Input, Button + Form, FormFeedback, Input, Button } from 'reactstrap'; import { factorChaining } from "../utils/factorChaining"; @@ -162,33 +162,30 @@ function ManageEmail(props) { - - - {props.errors.email && {props.errors.email.message}} - - - - - + + {props.errors.email && {props.errors.email.message}} + + ) diff --git a/src/modules/auth/number/PhoneNumberScreen.js b/src/modules/auth/number/PhoneNumberScreen.js index a6e6157..e71a178 100644 --- a/src/modules/auth/number/PhoneNumberScreen.js +++ b/src/modules/auth/number/PhoneNumberScreen.js @@ -175,33 +175,30 @@ function ChangeNumber(props) { - - - {props.errors.phone && {props.errors.phone.message}} - - - - - + + {props.errors.phone && {props.errors.phone.message}} + + ) diff --git a/src/modules/auth/passwd/ChangePwdScreen.js b/src/modules/auth/passwd/ChangePwdScreen.js index 7d732f7..d6e07eb 100644 --- a/src/modules/auth/passwd/ChangePwdScreen.js +++ b/src/modules/auth/passwd/ChangePwdScreen.js @@ -88,7 +88,7 @@ function ChangePwdCard(props) { return ( - {t('ChangePwdScreen|CompletedChangePwdCard|Password changed')} + {t('ChangePwdScreen|CompletedChangePwdCard|Password changed')} - - - - {!redirect_uri && - - - - } + +
+ +
+ + +
+ +
+ + {errors.newpassword && {errors.newpassword.message}} + +
+ +
+ + {errors.newpassword2 ? + {errors.newpassword2.message} + : + + {t('ChangePwdScreen|Enter new password a second time to verify it')} + + } + + + + + {!redirect_uri && + + + + } ); diff --git a/src/modules/auth/passwd/ForgetPwdScreen.js b/src/modules/auth/passwd/ForgetPwdScreen.js index c64530b..7a05f7b 100644 --- a/src/modules/auth/passwd/ForgetPwdScreen.js +++ b/src/modules/auth/passwd/ForgetPwdScreen.js @@ -1,4 +1,4 @@ -import React, { useState, useEffect } from 'react'; +import React, { useState } from 'react'; import { useTranslation } from 'react-i18next'; import { useForm } from 'react-hook-form'; import { useHistory } from "react-router-dom"; @@ -6,7 +6,7 @@ import { useHistory } from "react-router-dom"; import { Container, Row, Col, Card, CardHeader, CardTitle, CardSubtitle, CardBody, CardFooter, - Form, FormText, FormGroup, Label, Input, Button + Form, FormText, Label, Input, Button } from 'reactstrap'; import { getParams } from '../utils/paramsActions'; @@ -145,7 +145,7 @@ function ForgetPwdCard(props) { {/* ident */} - +