System Information
- Strapi Version: v4
- Operating System: Mac
- Database: Graphql
- Node Version: 16
- NPM Version:
- Yarn Version:
I am trying to get feedback from users on a personal project. Unfortunately, I am not able to connect with Strapi. I am using Next.js on the front end. This is my feedback.tsx inside the pages folder
const Feedback = ({
campaign,
item,
}: {
campaign: StrapiProps;
item: StrapiMapped;
}) => {
const [feedback, setFeedback] = useState("");
const [id, setId] = useState("");
const [feedbacksArray, setFeedbacksArray] = useState<
{ Platform: string; AssetTitle: string; feedback: string }[]
>([]);
const [submitted, setSubmitted] = useState<boolean>();
const submitFeedback = async () => {
try {
fetch(`${process.env.NEXT_PUBLIC_STRAPI_URL}/api/campaigns/${id}}`, {
method: "PUT",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${process.env.NEXT_PUBLIC_AUTH_TOKEN}`,
email: "joa@email.com",
password: "password",
},
body: JSON.stringify({
Feedback:
feedbacksArray != null
? [...feedbacksArray, [item.Platform, item.AssetTitle, feedback]]
: [[item.Platform, item.AssetTitle, feedback]],
}),
});
} catch (error) {
console.log("error feedback catch", error);
}
};
console.log("feedbacksArray", feedbacksArray);
console.log("feedback", feedback);
return (
<div className="feedback-wrapper">
<h3 className="feedback-title">Feedback</h3>
<form className="feedback-form">
<textarea
className="feedback-textarea"
placeholder="Add your feedback here.."
rows={5}
value={feedback}
onChange={(e) => {
setFeedbacksArray(campaign.attributes.Feedback);
setFeedback(e.target.value);
setId(campaign.id);
}}
/>
<button
onClick={(e) => {
e.preventDefault();
submitFeedback();
feedback ? setSubmitted(true) : setSubmitted(false);
}}
type="submit"
>
Submit
</button>
</form>
<div className="feedback-submitted">
{submitted ? <p className="from-them">{feedback}</p> : ""}
</div>
</div>
);
};
export default Feedback;
Also, I am using Graphql and Apollo-Client to fetch the data inside the API folder.
The error that I get after I tried to submit the form is in the below screenshot.