chore: setup project for production
This commit is contained in:
113
app/accounts/profile/change-password/page.jsx
Normal file
113
app/accounts/profile/change-password/page.jsx
Normal file
@@ -0,0 +1,113 @@
|
||||
'use client'
|
||||
import React, { useState } from "react";
|
||||
import axios from "axios";
|
||||
import authAxios from "@/utils/axios";
|
||||
|
||||
const ChangePassword = () => {
|
||||
const [oldPassword, setOldPassword] = useState("");
|
||||
const [newPassword, setNewPassword] = useState("");
|
||||
const [confirmNewPassword, setConfirmNewPassword] = useState("");
|
||||
const [error, setError] = useState("");
|
||||
const [success, setSuccess] = useState("");
|
||||
|
||||
const handleSubmit = async (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
|
||||
if (!oldPassword || !newPassword || !confirmNewPassword) {
|
||||
setError("All fields are required.");
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
if (newPassword !== confirmNewPassword) {
|
||||
setError("New passwords do not match.");
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
setError("");
|
||||
|
||||
try {
|
||||
|
||||
const response = await authAxios.post(
|
||||
"/account/change-password/",
|
||||
{
|
||||
old_password: oldPassword,
|
||||
new_password: newPassword,
|
||||
confirm_new_password: confirmNewPassword,
|
||||
}
|
||||
);
|
||||
|
||||
if (response.data.status) {
|
||||
setSuccess("Password updated successfully.");
|
||||
} else {
|
||||
setError(response.data.message || "Something went wrong.");
|
||||
}
|
||||
} catch (err) {
|
||||
setError("Failed to change password. Please try again.");
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div>
|
||||
<h1 className="text-3xl font-semibold border-b pb-4 text-zinc-700">
|
||||
Change Password
|
||||
</h1>
|
||||
<form onSubmit={handleSubmit}>
|
||||
<div className="sm:w-3/4 p-4">
|
||||
<label className="block font-medium my-3 text-zinc-700 sm:text-xl text-lg">
|
||||
Old Password
|
||||
</label>
|
||||
<input
|
||||
type="password"
|
||||
className="mt-1 block w-full sm:w-3/5 rounded-md p-3 border"
|
||||
value={oldPassword}
|
||||
onChange={(e) => setOldPassword(e.target.value)}
|
||||
/>
|
||||
|
||||
<label className="block font-medium my-3 text-zinc-700 sm:text-xl text-lg">
|
||||
New Password
|
||||
</label>
|
||||
<input
|
||||
type="password"
|
||||
className="mt-1 block w-full sm:w-3/5 rounded-md p-3 border"
|
||||
value={newPassword}
|
||||
onChange={(e) => setNewPassword(e.target.value)}
|
||||
/>
|
||||
|
||||
<label className="block my-3 font-medium text-zinc-700 sm:text-xl text-lg">
|
||||
Confirm New Password
|
||||
</label>
|
||||
<input
|
||||
type="password"
|
||||
className="mt-1 block w-full sm:w-3/5 rounded-md p-3 border"
|
||||
value={confirmNewPassword}
|
||||
onChange={(e) => setConfirmNewPassword(e.target.value)}
|
||||
/>
|
||||
|
||||
{error && (
|
||||
<div className="text-red-600 mt-2">
|
||||
<p>{error}</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{success && (
|
||||
<div className="text-green-600 mt-2">
|
||||
<p>{success}</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
className="bg-[#AC8C6B] bg-opacity-70 text-white px-4 py-3 rounded-md mt-3"
|
||||
>
|
||||
Submit
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default ChangePassword;
|
||||
Reference in New Issue
Block a user