Added change password view
This commit is contained in:
parent
e374df55de
commit
0e1f337360
@ -2,6 +2,7 @@ import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
|
|||||||
import Login from "./pages/Login";
|
import Login from "./pages/Login";
|
||||||
import Tasks from "./pages/Tasks";
|
import Tasks from "./pages/Tasks";
|
||||||
import Profile from "./pages/Profile";
|
import Profile from "./pages/Profile";
|
||||||
|
import ChangePassword from "./pages/ChangePassword";
|
||||||
|
|
||||||
const App = () => {
|
const App = () => {
|
||||||
return (
|
return (
|
||||||
@ -10,6 +11,7 @@ const App = () => {
|
|||||||
<Route path="/login" element={<Login />} />
|
<Route path="/login" element={<Login />} />
|
||||||
<Route path="/tasks" element={<Tasks />} />
|
<Route path="/tasks" element={<Tasks />} />
|
||||||
<Route path="/profile" element={<Profile />} />
|
<Route path="/profile" element={<Profile />} />
|
||||||
|
<Route path="/profile/change-password" element={<ChangePassword />} />
|
||||||
</Routes>
|
</Routes>
|
||||||
</Router>
|
</Router>
|
||||||
);
|
);
|
||||||
|
64
frontend/src/pages/ChangePassword.tsx
Normal file
64
frontend/src/pages/ChangePassword.tsx
Normal file
@ -0,0 +1,64 @@
|
|||||||
|
import { useState } from "react";
|
||||||
|
import { useNavigate } from "react-router-dom";
|
||||||
|
import api from "../api/api";
|
||||||
|
import Cookies from "js-cookie"
|
||||||
|
|
||||||
|
const ChangePassword = () => {
|
||||||
|
const id = Cookies.get("user_id")
|
||||||
|
const navigate = useNavigate();
|
||||||
|
if (!id) {
|
||||||
|
navigate("/login")
|
||||||
|
}
|
||||||
|
const [newPassword, setNewPassword] = useState("");
|
||||||
|
const [error, setError] = useState("");
|
||||||
|
const [success, setSuccess] = useState("");
|
||||||
|
|
||||||
|
const handleSubmit = async (e: React.FormEvent) => {
|
||||||
|
e.preventDefault();
|
||||||
|
setError("");
|
||||||
|
setSuccess("");
|
||||||
|
|
||||||
|
try {
|
||||||
|
await api.patch(`/users/${id}`, {
|
||||||
|
password: newPassword,
|
||||||
|
});
|
||||||
|
|
||||||
|
setSuccess("Hasło zostało zmienione.");
|
||||||
|
setNewPassword("");
|
||||||
|
|
||||||
|
setTimeout(() => navigate("/profile"), 2000); // krótka pauza, żeby pokazać sukces
|
||||||
|
} catch (err: any) {
|
||||||
|
console.error(err);
|
||||||
|
setError(err.response?.data?.message || "Błąd zmiany hasła.");
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="p-6 max-w-md mx-auto">
|
||||||
|
<h1 className="text-2xl font-bold mb-4">Zmień hasło</h1>
|
||||||
|
|
||||||
|
<form onSubmit={handleSubmit} className="bg-white shadow p-4 rounded flex flex-col gap-4">
|
||||||
|
<input
|
||||||
|
type="password"
|
||||||
|
placeholder="Nowe hasło"
|
||||||
|
value={newPassword}
|
||||||
|
onChange={(e) => setNewPassword(e.target.value)}
|
||||||
|
required
|
||||||
|
className="border p-2 rounded"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<button
|
||||||
|
type="submit"
|
||||||
|
className="bg-blue-500 text-white p-2 rounded hover:bg-blue-600"
|
||||||
|
>
|
||||||
|
💾 Zapisz hasło
|
||||||
|
</button>
|
||||||
|
|
||||||
|
{error && <p className="text-red-500">{error}</p>}
|
||||||
|
{success && <p className="text-green-600">{success}</p>}
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ChangePassword;
|
@ -57,7 +57,7 @@ const Profile = () => {
|
|||||||
|
|
||||||
<div className="flex flex-col gap-2">
|
<div className="flex flex-col gap-2">
|
||||||
<button
|
<button
|
||||||
onClick={() => navigate(`/profile/${user.id}/change-password`)}
|
onClick={() => navigate("/profile/change-password")}
|
||||||
className="bg-blue-500 text-white p-2 rounded hover:bg-blue-600"
|
className="bg-blue-500 text-white p-2 rounded hover:bg-blue-600"
|
||||||
>
|
>
|
||||||
🔐 Zmień hasło
|
🔐 Zmień hasło
|
||||||
|
Loading…
x
Reference in New Issue
Block a user