removing zxcvvbn for now

This commit is contained in:
2025-10-15 15:44:29 -05:00
parent a3675c2585
commit 3781646b7f
9 changed files with 6206 additions and 6215 deletions

File diff suppressed because it is too large Load Diff

View File

@@ -6,7 +6,7 @@
"scripts": { "scripts": {
"dev": "vite", "dev": "vite",
"build": "tsc && vite build", "build": "tsc && vite build",
"build:beta": "tsc && vite build --mode beta", "build:beta": "vite build --mode beta",
"build:prod": "tsc && vite build --mode production", "build:prod": "tsc && vite build --mode production",
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0", "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
"preview": "vite preview", "preview": "vite preview",
@@ -38,8 +38,7 @@
"react": "^18.2.0", "react": "^18.2.0",
"react-dom": "^18.2.0", "react-dom": "^18.2.0",
"react-router-dom": "^6.22.3", "react-router-dom": "^6.22.3",
"simplebar-react": "^3.2.5", "simplebar-react": "^3.2.5"
"zxcvbn": "^4.4.2"
}, },
"devDependencies": { "devDependencies": {
"@iconify/react": "^4.1.1", "@iconify/react": "^4.1.1",

View File

@@ -1,6 +1,5 @@
import React from 'react'; import React from 'react';
import zxcvbn from 'zxcvbn'; //import zxcvbn from '@zxcvbn-ts/core';
import { Box, LinearProgress, Typography } from '@mui/material'; import { Box, LinearProgress, Typography } from '@mui/material';
interface PasswordStrengthCheckerProps { interface PasswordStrengthCheckerProps {
@@ -8,7 +7,7 @@ interface PasswordStrengthCheckerProps {
} }
const PasswordStrengthChecker: React.FC<PasswordStrengthCheckerProps> = ({ password }) => { const PasswordStrengthChecker: React.FC<PasswordStrengthCheckerProps> = ({ password }) => {
const strength = password ? zxcvbn(password).score : 0; //const strength = password ? zxcvbn(password).score : 0;
const getStrengthLabel = () => { const getStrengthLabel = () => {
switch (strength) { switch (strength) {

View File

@@ -113,9 +113,9 @@ const AttorneyProfile = ({ account }: ProfileProps): ReactElement => {
onSave={handleSaveAttorneyProfile} onSave={handleSaveAttorneyProfile}
/> />
<Box sx={{ mt: 4 }}> {/*<Box sx={{ mt: 4 }}>
<ChangePasswordCard /> <ChangePasswordCard />
</Box> </Box>*/}
</Container> </Container>
); );
}; };

View File

@@ -1,151 +1,151 @@
import { // import {
Alert, // Alert,
Box, // Box,
Button, // Button,
Card, // Card,
CardContent, // CardContent,
CardHeader, // CardHeader,
Divider, // Divider,
Grid, // Grid,
LinearProgress, // LinearProgress,
TextField, // TextField,
Typography, // Typography,
} from '@mui/material'; // } from '@mui/material';
import { axiosInstance } from 'axiosApi'; // import { axiosInstance } from 'axiosApi';
import { useState } from 'react'; // import { useState } from 'react';
import zxcvbn from 'zxcvbn'; // import zxcvbn from '@zxcvbn-ts/core';
const ChangePasswordCard = () => { // const ChangePasswordCard = () => {
const [currentPassword, setCurrentPassword] = useState(''); // const [currentPassword, setCurrentPassword] = useState('');
const [newPassword, setNewPassword] = useState(''); // const [newPassword, setNewPassword] = useState('');
const [confirmPassword, setConfirmPassword] = useState(''); // const [confirmPassword, setConfirmPassword] = useState('');
const [passwordStrength, setPasswordStrength] = useState(0); // const [passwordStrength, setPasswordStrength] = useState(0);
const [message, setMessage] = useState<{ type: 'success' | 'error'; text: string } | null>(null); // const [message, setMessage] = useState<{ type: 'success' | 'error'; text: string } | null>(null);
const [errors, setErrors] = useState<{ [key: string]: string }>({}); // const [errors, setErrors] = useState<{ [key: string]: string }>({});
const handlePasswordChange = (e: React.ChangeEvent<HTMLInputElement>) => { // const handlePasswordChange = (e: React.ChangeEvent<HTMLInputElement>) => {
const password = e.target.value; // const password = e.target.value;
setNewPassword(password); // setNewPassword(password);
const strength = zxcvbn(password).score; // const strength = zxcvbn(password).score;
setPasswordStrength(strength); // setPasswordStrength(strength);
}; // };
const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => { // const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
e.preventDefault(); // e.preventDefault();
setErrors({}); // setErrors({});
setMessage(null); // setMessage(null);
if (newPassword !== confirmPassword) { // if (newPassword !== confirmPassword) {
setErrors({ confirmPassword: 'Passwords do not match' }); // setErrors({ confirmPassword: 'Passwords do not match' });
return; // return;
} // }
if (passwordStrength < 2) { // if (passwordStrength < 2) {
setErrors({ newPassword: 'Password is too weak' }); // setErrors({ newPassword: 'Password is too weak' });
return; // return;
} // }
try { // try {
await axiosInstance.post('/auth/password/change/', { // await axiosInstance.post('/auth/password/change/', {
old_password: currentPassword, // old_password: currentPassword,
new_password: newPassword, // new_password: newPassword,
}); // });
setMessage({ type: 'success', text: 'Password updated successfully!' }); // setMessage({ type: 'success', text: 'Password updated successfully!' });
setCurrentPassword(''); // setCurrentPassword('');
setNewPassword(''); // setNewPassword('');
setConfirmPassword(''); // setConfirmPassword('');
setPasswordStrength(0); // setPasswordStrength(0);
} catch (error: any) { // } catch (error: any) {
setMessage({ type: 'error', text: 'Error updating password.' }); // setMessage({ type: 'error', text: 'Error updating password.' });
if (error.response && error.response.data) { // if (error.response && error.response.data) {
setErrors(error.response.data); // setErrors(error.response.data);
} // }
} // }
}; // };
const passwordStrengthColor = () => { // const passwordStrengthColor = () => {
switch (passwordStrength) { // switch (passwordStrength) {
case 0: // case 0:
case 1: // case 1:
return 'error'; // return 'error';
case 2: // case 2:
return 'warning'; // return 'warning';
case 3: // case 3:
case 4: // case 4:
return 'success'; // return 'success';
default: // default:
return 'grey'; // return 'grey';
} // }
}; // };
return ( // return (
<Card> // <Card>
<CardHeader title="Change Password" /> // <CardHeader title="Change Password" />
<Divider /> // <Divider />
<CardContent> // <CardContent>
<form onSubmit={handleSubmit}> // <form onSubmit={handleSubmit}>
<Grid container spacing={2}> // <Grid container spacing={2}>
{message && ( // {message && (
<Grid item xs={12}> // <Grid item xs={12}>
<Alert severity={message.type}>{message.text}</Alert> // <Alert severity={message.type}>{message.text}</Alert>
</Grid> // </Grid>
)} // )}
<Grid item xs={12}> // <Grid item xs={12}>
<TextField // <TextField
fullWidth // fullWidth
label="Current Password" // label="Current Password"
type="password" // type="password"
value={currentPassword} // value={currentPassword}
onChange={(e) => setCurrentPassword(e.target.value)} // onChange={(e) => setCurrentPassword(e.target.value)}
error={!!errors.old_password} // error={!!errors.old_password}
helperText={errors.old_password} // helperText={errors.old_password}
required // required
/> // />
</Grid> // </Grid>
<Grid item xs={12}> // <Grid item xs={12}>
<TextField // <TextField
fullWidth // fullWidth
label="New Password" // label="New Password"
type="password" // type="password"
value={newPassword} // value={newPassword}
onChange={handlePasswordChange} // onChange={handlePasswordChange}
error={!!errors.new_password} // error={!!errors.new_password}
helperText={errors.new_password} // helperText={errors.new_password}
required // required
/> // />
<Box sx={{ width: '100%', mt: 1 }}> // <Box sx={{ width: '100%', mt: 1 }}>
<LinearProgress // <LinearProgress
variant="determinate" // variant="determinate"
value={(passwordStrength / 4) * 100} // value={(passwordStrength / 4) * 100}
color={passwordStrengthColor()} // color={passwordStrengthColor()}
/> // />
<Typography variant="caption" color="textSecondary"> // <Typography variant="caption" color="textSecondary">
{['Very Weak', 'Weak', 'Fair', 'Good', 'Strong'][passwordStrength]} // {['Very Weak', 'Weak', 'Fair', 'Good', 'Strong'][passwordStrength]}
</Typography> // </Typography>
</Box> // </Box>
</Grid> // </Grid>
<Grid item xs={12}> // <Grid item xs={12}>
<TextField // <TextField
fullWidth // fullWidth
label="Confirm New Password" // label="Confirm New Password"
type="password" // type="password"
value={confirmPassword} // value={confirmPassword}
onChange={(e) => setConfirmPassword(e.target.value)} // onChange={(e) => setConfirmPassword(e.target.value)}
error={!!errors.confirmPassword} // error={!!errors.confirmPassword}
helperText={errors.confirmPassword} // helperText={errors.confirmPassword}
required // required
/> // />
</Grid> // </Grid>
<Grid item xs={12}> // <Grid item xs={12}>
<Button type="submit" variant="contained" color="primary"> // <Button type="submit" variant="contained" color="primary">
Change Password // Change Password
</Button> // </Button>
</Grid> // </Grid>
</Grid> // </Grid>
</form> // </form>
</CardContent> // </CardContent>
</Card> // </Card>
); // );
}; // };
export default ChangePasswordCard; // export default ChangePasswordCard;

View File

@@ -236,9 +236,9 @@ const PropertyOwnerProfile = ({ account }: ProfileProps): ReactElement => {
setMessage={setMessage} setMessage={setMessage}
/> />
<Box sx={{ mt: 4 }}> {/*<Box sx={{ mt: 4 }}>
<ChangePasswordCard /> <ChangePasswordCard />
</Box> </Box>*/}
<Divider sx={{ my: 4 }} /> <Divider sx={{ my: 4 }} />

View File

@@ -166,9 +166,9 @@ const VendorProfile = ({ account }: ProfileProps): ReactElement => {
onSave={handleSaveVendorProfile} onSave={handleSaveVendorProfile}
/> />
<Box sx={{ mt: 4 }}> {/*<Box sx={{ mt: 4 }}>
<ChangePasswordCard /> <ChangePasswordCard />
</Box> </Box>*/}
<Divider sx={{ my: 4 }} /> <Divider sx={{ my: 4 }} />

View File

@@ -89,7 +89,7 @@ const ResetPassword = (): ReactElement => {
), ),
}} }}
/> />
<PasswordStrengthChecker password={password} /> {/*<PasswordStrengthChecker password={password} />*/}
</FormControl> </FormControl>
<FormControl variant="standard" fullWidth> <FormControl variant="standard" fullWidth>
<InputLabel shrink htmlFor="confirm-password"> <InputLabel shrink htmlFor="confirm-password">

View File

@@ -246,7 +246,7 @@ const SignUp = (): ReactElement => {
), ),
}} }}
/> />
<PasswordStrengthChecker password={password} /> {/*<PasswordStrengthChecker password={password} />*/}
</FormControl> </FormControl>
<FormControl variant="standard" fullWidth> <FormControl variant="standard" fullWidth>
<InputLabel shrink htmlFor="password"> <InputLabel shrink htmlFor="password">