I have an action like this one
<Route path="/admin" element={<MainLayout />}>
<Route
path="collections"
loader={async () => {
// express backend
const data = await fetch(
"http://localhost:3000/admin/collections"
);
return data;
}}
element={<Nav />}
action={async ({ request, params }) => {
if (request.method === "post") {
let formData = await request.formData();
let collection = formData.get("collectionName");
// express backend
const res = await fetch(
"http://localhost:3000/admin/collections/createCollection",
{
method: "POST", // *GET, POST, PUT, DELETE, etc.
mode: "cors", // no-cors, *cors, same-origin
cache: "no-cache", // *default, no-cache, reload, force-cache, only-if-cached
credentials: "same-origin", // include, *same-origin, omit
headers: {
"Content-Type": "application/json",
// 'Content-Type': 'application/x-www-form-urlencoded',
},
redirect: "follow", // manual, *follow, error
referrerPolicy: "no-referrer", // no-referrer, *no-referrer-when-downgrade, origin, origin-when-cross-origin, same-origin, strict-origin, strict-origin-when-cross-origin, unsafe-url
body: JSON.stringify({
collection: collection,
}),
}
);
if (!res.ok) throw res;
return { ok: true };
}
}}
>
</Route>
</Route>
in my component I use then the Form component and send a post request with the data to admin/collections but nothing happens why is that what is here wrong?