mirror of
https://github.com/OpenSignLabs/OpenSign.git
synced 2026-08-21 15:12:34 +02:00
fix: password validation issue
This commit is contained in:
@@ -253,7 +253,7 @@ const AddAdmin = () => {
|
||||
/[A-Z]/.test(newPassword) &&
|
||||
/\d/.test(newPassword)
|
||||
);
|
||||
setSpecialCharValid(/[!@#$%^&*()\-_=+{};:,<.>]/.test(newPassword));
|
||||
setSpecialCharValid(/[!@#$%^&*()\-_=+{};:,<.>?]/.test(newPassword));
|
||||
};
|
||||
const subscribeNewsletter = async () => {
|
||||
try {
|
||||
|
||||
@@ -4,6 +4,18 @@ import { Navigate } from "react-router";
|
||||
import { useTranslation } from "react-i18next";
|
||||
|
||||
function ChangePassword() {
|
||||
const [lengthValid, setLengthValid] = useState(false);
|
||||
const [caseDigitValid, setCaseDigitValid] = useState(false);
|
||||
const [specialCharValid, setSpecialCharValid] = useState(false);
|
||||
const handlePasswordChange = (e) => {
|
||||
const value = e.target.value;
|
||||
setnewpassword(value);
|
||||
setLengthValid(value.length >= 8);
|
||||
setCaseDigitValid(
|
||||
/[a-z]/.test(value) && /[A-Z]/.test(value) && /\d/.test(value)
|
||||
);
|
||||
setSpecialCharValid(/[!@#$%^&*()\-_=+{};:,<.>?]/.test(value));
|
||||
};
|
||||
const { t } = useTranslation();
|
||||
const [currentpassword, setCurrentPassword] = useState("");
|
||||
const [newpassword, setnewpassword] = useState("");
|
||||
@@ -84,13 +96,26 @@ function ChangePassword() {
|
||||
type="password"
|
||||
name="newpassword"
|
||||
value={newpassword}
|
||||
onChange={(e) => setnewpassword(e.target.value)}
|
||||
onChange={handlePasswordChange}
|
||||
className="op-input op-input-bordered op-input-sm text-xs w-full"
|
||||
placeholder={t("new-password")}
|
||||
onInvalid={(e) => e.target.setCustomValidity(t("input-required"))}
|
||||
onInput={(e) => e.target.setCustomValidity("")}
|
||||
required
|
||||
/>
|
||||
{newpassword.length > 0 && (
|
||||
<div className="mt-1 text-[11px]">
|
||||
<p className={lengthValid ? "text-green-600" : "text-red-600"}>
|
||||
{lengthValid ? "✓" : "✗"} Password length ≥ 8
|
||||
</p>
|
||||
<p className={caseDigitValid ? "text-green-600" : "text-red-600"}>
|
||||
{caseDigitValid ? "✓" : "✗"} Uppercase, lowercase, and number
|
||||
</p>
|
||||
<p className={specialCharValid ? "text-green-600" : "text-red-600"}>
|
||||
{specialCharValid ? "✓" : "✗"} Special character
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div>
|
||||
<label htmlFor="newpassword" className="text-xs block ml-1">
|
||||
|
||||
@@ -13,6 +13,18 @@ import { useTranslation } from "react-i18next";
|
||||
import Loader from "../primitives/Loader";
|
||||
|
||||
function ForgotPassword() {
|
||||
const [lengthValid, setLengthValid] = useState(false);
|
||||
const [caseDigitValid, setCaseDigitValid] = useState(false);
|
||||
const [specialCharValid, setSpecialCharValid] = useState(false);
|
||||
const handlePasswordChange = (event) => {
|
||||
let value = event.target.value;
|
||||
setState({ ...state, password: value });
|
||||
setLengthValid(value.length >= 8);
|
||||
setCaseDigitValid(
|
||||
/[a-z]/.test(value) && /[A-Z]/.test(value) && /\d/.test(value)
|
||||
);
|
||||
setSpecialCharValid(/[!@#$%^&*()\-_=+{};:,<.>?]/.test(value));
|
||||
};
|
||||
const { t } = useTranslation();
|
||||
const dispatch = useDispatch();
|
||||
const navigate = useNavigate();
|
||||
@@ -124,6 +136,28 @@ function ForgotPassword() {
|
||||
</div>
|
||||
</div>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-2 text-center text-xs font-bold">
|
||||
<input
|
||||
type="password"
|
||||
name="password"
|
||||
className="op-input op-input-bordered op-input-sm w-full mt-2"
|
||||
value={state.password}
|
||||
onChange={handlePasswordChange}
|
||||
placeholder="New password"
|
||||
required
|
||||
/>
|
||||
{state.password.length > 0 && (
|
||||
<div className="mt-1 text-[11px]">
|
||||
<p className={lengthValid ? "text-green-600" : "text-red-600"}>
|
||||
{lengthValid ? "✓" : "✗"} Password length ≥ 8
|
||||
</p>
|
||||
<p className={caseDigitValid ? "text-green-600" : "text-red-600"}>
|
||||
{caseDigitValid ? "✓" : "✗"} Uppercase, lowercase, and number
|
||||
</p>
|
||||
<p className={specialCharValid ? "text-green-600" : "text-red-600"}>
|
||||
{specialCharValid ? "✓" : "✗"} Special character
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
<button type="submit" className="op-btn op-btn-primary">
|
||||
{t("submit")}
|
||||
</button>
|
||||
|
||||
@@ -23,6 +23,18 @@ import { useTranslation } from "react-i18next";
|
||||
import SelectLanguage from "../components/pdf/SelectLanguage";
|
||||
|
||||
function Login() {
|
||||
const [lengthValid, setLengthValid] = useState(false);
|
||||
const [caseDigitValid, setCaseDigitValid] = useState(false);
|
||||
const [specialCharValid, setSpecialCharValid] = useState(false);
|
||||
const handlePasswordChange = (event) => {
|
||||
let value = event.target.value;
|
||||
setState({ ...state, password: value });
|
||||
setLengthValid(value.length >= 8);
|
||||
setCaseDigitValid(
|
||||
/[a-z]/.test(value) && /[A-Z]/.test(value) && /\d/.test(value)
|
||||
);
|
||||
setSpecialCharValid(/[!@#$%^&*()\-_=+{};:,<.>?]/.test(value));
|
||||
};
|
||||
const appName =
|
||||
"OpenSign™";
|
||||
const { t, i18n } = useTranslation();
|
||||
@@ -474,7 +486,7 @@ function Login() {
|
||||
name="password"
|
||||
value={state.password}
|
||||
autoComplete="current-password"
|
||||
onChange={handleChange}
|
||||
onChange={handlePasswordChange}
|
||||
onInvalid={(e) =>
|
||||
e.target.setCustomValidity(
|
||||
t("input-required")
|
||||
@@ -495,6 +507,19 @@ function Login() {
|
||||
</span>
|
||||
</div>
|
||||
<div className="relative mt-1">
|
||||
{state.password.length > 0 && (
|
||||
<div className="mt-1 text-[11px]">
|
||||
<p className={lengthValid ? "text-green-600" : "text-red-600"}>
|
||||
{lengthValid ? "✓" : "✗"} Password length ≥ 8
|
||||
</p>
|
||||
<p className={caseDigitValid ? "text-green-600" : "text-red-600"}>
|
||||
{caseDigitValid ? "✓" : "✗"} Uppercase, lowercase, and number
|
||||
</p>
|
||||
<p className={specialCharValid ? "text-green-600" : "text-red-600"}>
|
||||
{specialCharValid ? "✓" : "✗"} Special character
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
<NavLink
|
||||
to="/forgetpassword"
|
||||
className="text-[13px] op-link op-link-primary underline-offset-1 focus:outline-none ml-1"
|
||||
|
||||
Reference in New Issue
Block a user