100 lines
2.4 KiB
JavaScript
100 lines
2.4 KiB
JavaScript
import React, { useState } from "react";
|
|
import { useNavigate } from "react-router-dom";
|
|
import { useAuth } from "../contexts/AuthContext";
|
|
import ProfileForm from "../components/ProfileForm";
|
|
|
|
export default function PublishProfilePage() {
|
|
const { token } = useAuth();
|
|
const nav = useNavigate();
|
|
const [form, setForm] = useState({
|
|
firstName: "",
|
|
lastName: "",
|
|
phone: "",
|
|
address: "",
|
|
description: "",
|
|
picture: "",
|
|
field: "",
|
|
rate: "",
|
|
published: true,
|
|
});
|
|
const [error, setError] = useState("");
|
|
|
|
const handleChange = (e) => {
|
|
const { name, value, type, checked } = e.target;
|
|
setForm((f) => ({
|
|
...f,
|
|
[name]: type === "checkbox" ? checked : value,
|
|
}));
|
|
};
|
|
|
|
const handleFile = (e) => {
|
|
const file = e.target.files[0];
|
|
if (!file) return;
|
|
const reader = new FileReader();
|
|
reader.onloadend = () => setForm((f) => ({ ...f, picture: reader.result }));
|
|
reader.readAsDataURL(file);
|
|
};
|
|
|
|
const handleSubmit = async (e) => {
|
|
e.preventDefault();
|
|
setError("");
|
|
// require all fields
|
|
const {
|
|
firstName,
|
|
lastName,
|
|
phone,
|
|
address,
|
|
description,
|
|
picture,
|
|
field,
|
|
rate,
|
|
} = form;
|
|
if (
|
|
!firstName ||
|
|
!lastName ||
|
|
!phone ||
|
|
!address ||
|
|
!description ||
|
|
!picture ||
|
|
!field ||
|
|
rate === ""
|
|
) {
|
|
return setError(
|
|
"Please complete all fields (including picture & description) before publishing."
|
|
);
|
|
}
|
|
|
|
try {
|
|
const res = await fetch("/api/profiles", {
|
|
method: "POST",
|
|
headers: {
|
|
"Content-Type": "application/json",
|
|
Authorization: `Bearer ${token}`,
|
|
},
|
|
body: JSON.stringify(form),
|
|
});
|
|
const data = await res.json();
|
|
if (!res.ok) throw new Error(data.error || "Publish failed");
|
|
nav("/profile");
|
|
} catch (err) {
|
|
setError(err.message);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<main className="form-page">
|
|
<h1>Publish Your Seller Profile</h1>
|
|
{error && <p className="error">{error}</p>}
|
|
<ProfileForm
|
|
form={form}
|
|
handleChange={handleChange}
|
|
handleFile={handleFile}
|
|
editMode={true}
|
|
user={{ role: "pro" }}
|
|
onSubmit={handleSubmit}
|
|
onCancel={null}
|
|
/>
|
|
</main>
|
|
);
|
|
}
|