Skip to content

Commit e66f4af

Browse files
BeliochandoBeliochando
authored
Merge pull request #68 from FSDSTR0225/dev
Dev
2 parents 8e53457 + 7db6cd5 commit e66f4af

File tree

2 files changed

+63
-59
lines changed

2 files changed

+63
-59
lines changed

‎src/components/home/NumbersSection.jsx‎

Lines changed: 29 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -4,16 +4,17 @@ import { getOffers } from "../../services/offersServices";
44
import { getAllDevelopers } from "../../services/devService";
55
import { getAllRecruiters } from "../../services/profileService";
66

7+
// Spinner de carga
8+
const Spinner = () => (
9+
<div className="loading loading-spinner loading-md text-primary-50"></div>
10+
);
11+
712
export const NumbersSection = () => {
813
const [offers, setOffers] = useState([]);
914
const [devs, setDevs] = useState([]);
1015
const [companies, setCompanies] = useState([]);
1116
const [acceptedApplications, setAcceptedApplications] = useState(0);
12-
13-
const devsCount = useCounter(devs.length * 100);
14-
const companiesCount = useCounter(companies.length * 100);
15-
const offersCount = useCounter(offers.length * 100);
16-
const hiresCount = useCounter(acceptedApplications * 100);
17+
const [dataLoaded, setDataLoaded] = useState(false);
1718

1819
useEffect(() => {
1920
const fetchData = async () => {
@@ -37,6 +38,7 @@ export const NumbersSection = () => {
3738
});
3839
});
3940
setAcceptedApplications(accepted);
41+
setDataLoaded(true); // ✅ Marcar como cargado
4042
} catch (error) {
4143
console.error("Error fetching data:", error);
4244
}
@@ -45,38 +47,44 @@ export const NumbersSection = () => {
4547
fetchData();
4648
}, []);
4749

50+
const devsCount = useCounter(devs.length * 100, 800, dataLoaded);
51+
const companiesCount = useCounter(companies.length * 100, 800, dataLoaded);
52+
const offersCount = useCounter(offers.length * 100, 800, dataLoaded);
53+
const hiresCount = useCounter(acceptedApplications * 100, 800, dataLoaded);
54+
55+
const renderCount = (count) =>
56+
dataLoaded ? (
57+
<span className="text-3xl sm:text-4xl md:text-5xl font-bold mb-2 block">
58+
+{count}
59+
</span>
60+
) : (
61+
<Spinner />
62+
);
63+
4864
return (
4965
<div className="flex justify-center items-center w-full mt-8 px-2">
5066
<div className="w-full max-w-6xl bg-neutral-80 border border-neutral-60 rounded-3xl py-8 px-2 sm:py-12 sm:px-6 md:py-16 md:px-16">
5167
<div className="grid grid-cols-2 lg:grid-cols-4 gap-6 md:gap-8 text-center">
52-
<div className="flex flex-col items-center">
53-
<span className="text-3xl sm:text-4xl md:text-5xl font-bold text-primary-50 mb-2 block">
54-
+{devsCount}
55-
</span>
68+
<div className="flex flex-col items-center text-primary-50">
69+
{renderCount(devsCount)}
5670
<span className="text-neutral-20 text-sm md:text-base block">
5771
Developers
5872
</span>
5973
</div>
60-
<div className="flex flex-col items-center">
61-
<span className="text-3xl sm:text-4xl md:text-5xl font-bold text-secondary-50 mb-2 block">
62-
+{companiesCount}
63-
</span>
74+
<div className="flex flex-col items-center text-secondary-50">
75+
{renderCount(companiesCount)}
6476
<span className="text-neutral-20 text-sm md:text-base block">
6577
Companies
6678
</span>
6779
</div>
68-
<div className="flex flex-col items-center">
69-
<span className="text-3xl sm:text-4xl md:text-5xl font-bold text-primary-50 mb-2 block">
70-
+{offersCount}
71-
</span>
80+
<div className="flex flex-col items-center text-primary-50">
81+
{renderCount(offersCount)}
7282
<span className="text-neutral-20 text-sm md:text-base block">
7383
Active Offers
7484
</span>
7585
</div>
76-
<div className="flex flex-col items-center">
77-
<span className="text-3xl sm:text-4xl md:text-5xl font-bold text-secondary-50 mb-2 block">
78-
+{hiresCount}
79-
</span>
86+
<div className="flex flex-col items-center text-secondary-50">
87+
{renderCount(hiresCount)}
8088
<span className="text-neutral-20 text-sm md:text-base block">
8189
Total hires
8290
</span>

‎src/components/settings/ChangePasswordModal.jsx‎

Lines changed: 34 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -7,26 +7,17 @@ export default function ChangePasswordModal({ open, setOpen, profileData, onProf
77
handleSubmit,
88
reset,
99
watch,
10-
formState: { isSubmitting }
10+
formState: { isSubmitting, errors }
1111
} = useForm();
1212

13-
// Observar las contraseñas para validar que coincidan
1413
const newPassword = watch("newPassword");
1514

1615
useEffect(() => {
17-
if (profileData) {
18-
reset({
19-
oldPassword: "",
20-
newPassword: "",
21-
confirmPassword: "",
22-
});
23-
} else {
24-
reset({
25-
oldPassword: "",
26-
newPassword: "",
27-
confirmPassword: "",
28-
});
29-
}
16+
reset({
17+
oldPassword: "",
18+
newPassword: "",
19+
confirmPassword: "",
20+
});
3021
}, [profileData, reset]);
3122

3223
const handleClose = () => {
@@ -36,11 +27,6 @@ export default function ChangePasswordModal({ open, setOpen, profileData, onProf
3627

3728
const handlePassSubmit = async (data) => {
3829
try {
39-
if (data.newPassword !== data.confirmPassword) {
40-
alert("Your new passwords don't match");
41-
return;
42-
}
43-
4430
if (onSubmit) {
4531
await onSubmit(data);
4632
}
@@ -50,7 +36,6 @@ export default function ChangePasswordModal({ open, setOpen, profileData, onProf
5036
}
5137

5238
handleClose();
53-
5439
} catch (error) {
5540
console.error("Error when you tried change the password: ",error);
5641
}
@@ -61,66 +46,77 @@ export default function ChangePasswordModal({ open, setOpen, profileData, onProf
6146
return (
6247
<div className="modal modal-open fixed inset-0 flex justify-center items-center z-50">
6348
<div className="modal-box max-w-3xl bg-neutral-80 border border-neutral-70 rounded-lg p-6 relative">
64-
<form onSubmit={handleSubmit(handlePassSubmit)} className="flex flex-col gap-4">
49+
<div className="flex flex-col gap-4">
6550
<h2 className="text-2xl font-bold text-center">Change your password</h2>
6651

67-
68-
{/* Password Viejo*/}
52+
{/* Current Password */}
6953
<div className="form-control">
7054
<label className="block text-sm text-neutral-20 mb-1">
7155
<span className="label-text font-semibold">Current password</span>
7256
</label>
7357
<input
7458
type="password"
7559
{...register("oldPassword", {
76-
required: "Your current password is requiered"
60+
required: "Current password is required"
7761
})}
7862
placeholder="Enter your current password"
79-
className="input input-bordered bg-neutral-90 text-neutral-0 border-neutral-60 w-full placeholder-neutral-40 placeholder:italic"
63+
className="input input-bordered bg-neutral-90 text-neutral-0 border-neutral-60 w-full placeholder-neutral-40 placeholder:italic"
8064
/>
65+
{errors.oldPassword && (
66+
<span className="text-red-500 text-sm mt-1">{errors.oldPassword.message}</span>
67+
)}
8168
</div>
8269

83-
{/* Password nuevo */}
70+
{/* New Password */}
8471
<div className="form-control">
8572
<label className="block text-sm text-neutral-20 mb-1">
8673
<span className="label-text font-semibold">New password</span>
8774
</label>
8875
<input
8976
type="password"
9077
{...register("newPassword", {
91-
required: "Your new password is requiered"
78+
required: "New password is required",
79+
minLength: {
80+
value: 6,
81+
message: "Password must be at least 6 characters"
82+
}
9283
})}
9384
placeholder="Enter your new password"
94-
className="input input-bordered bg-neutral-90 text-neutral-0 border-neutral-60 w-full placeholder-neutral-40 placeholder:italic"
85+
className="input input-bordered bg-neutral-90 text-neutral-0 border-neutral-60 w-full placeholder-neutral-40 placeholder:italic"
9586
/>
87+
{errors.newPassword && (
88+
<span className="text-red-500 text-sm mt-1">{errors.newPassword.message}</span>
89+
)}
9690
</div>
9791

98-
{/* Password nuevo again */}
92+
{/* Confirm Password */}
9993
<div className="form-control">
10094
<label className="block text-sm text-neutral-20 mb-1">
10195
<span className="label-text font-semibold">Confirm new password</span>
10296
</label>
10397
<input
10498
type="password"
10599
{...register("confirmPassword", {
106-
required: "Confirm your new password",
107-
validate: value => value === newPassword
100+
required: "Please confirm your password",
101+
validate: value => value === newPassword || "Passwords don't match"
108102
})}
109103
placeholder="Confirm your new password"
110-
className="input input-bordered bg-neutral-90 text-neutral-0 border-neutral-60 w-full placeholder-neutral-40 placeholder:italic"
104+
className="input input-bordered bg-neutral-90 text-neutral-0 border-neutral-60 w-full placeholder-neutral-40 placeholder:italic"
111105
/>
106+
{errors.confirmPassword && (
107+
<span className="text-red-500 text-sm mt-1">{errors.confirmPassword.message}</span>
108+
)}
112109
</div>
113110

114-
115-
116111
{/* Buttons */}
117112
<div className="flex justify-end gap-4 pt-4">
118113
<button
119114
type="submit"
120115
disabled={isSubmitting}
121-
className="btn bg-primary-60 text-neutral-0 hover:bg-primary-50 border border-primary-50"
116+
className="btn bg-primary-60 text-neutral-0 hover:bg-primary-50 border border-primary-50 disabled:opacity-50"
117+
onClick={handleSubmit(handlePassSubmit)}
122118
>
123-
{isSubmitting ? "Changing..." : "Change your password"}
119+
{isSubmitting ? "Changing..." : "Change password"}
124120
</button>
125121
<button
126122
type="button"
@@ -130,7 +126,7 @@ export default function ChangePasswordModal({ open, setOpen, profileData, onProf
130126
Cancel
131127
</button>
132128
</div>
133-
</form>
129+
</div>
134130
</div>
135131
</div>
136132
);

0 commit comments

Comments
 (0)