68 lines
1.9 KiB
TypeScript
68 lines
1.9 KiB
TypeScript
import { Container, Stack, Title } from "@mantine/core";
|
|
import { FlightFormSchema, flightCreateHelper } from "@/util/types";
|
|
import { useMutation, useQueryClient } from "@tanstack/react-query";
|
|
import { useApi } from "@/util/api";
|
|
import { useNavigate } from "@remix-run/react";
|
|
import FlightForm from "@/ui/form/flight-form";
|
|
|
|
export default function NewFlight() {
|
|
const navigate = useNavigate();
|
|
const queryClient = useQueryClient();
|
|
|
|
const client = useApi();
|
|
|
|
const createFlight = useMutation({
|
|
mutationFn: async (values: FlightFormSchema) => {
|
|
const newFlight = flightCreateHelper(values);
|
|
if (newFlight) {
|
|
const res = await client.post("/flights", newFlight);
|
|
|
|
const id = res.data.id;
|
|
if (!id) throw new Error("Flight creation failed");
|
|
|
|
const imageForm = new FormData();
|
|
|
|
// Upload images
|
|
for (const img of values.images) {
|
|
imageForm.append("images", img);
|
|
}
|
|
|
|
const img_id = await client.post(
|
|
`/flights/${id}/add_images`,
|
|
imageForm,
|
|
{ headers: { "Content-Type": "multipart/form-data" } }
|
|
);
|
|
|
|
if (!img_id) {
|
|
await queryClient.invalidateQueries({ queryKey: ["flights-list"] });
|
|
throw new Error("Image upload failed");
|
|
}
|
|
|
|
return res.data;
|
|
}
|
|
throw new Error("Flight creation failed");
|
|
},
|
|
onSuccess: async (data: { id: string }) => {
|
|
await queryClient.invalidateQueries({ queryKey: ["flights-list"] });
|
|
navigate(`/logbook/flights/${data.id}`);
|
|
},
|
|
});
|
|
|
|
return (
|
|
<Container>
|
|
<Stack>
|
|
<Title order={2}>New Flight</Title>
|
|
|
|
<FlightForm
|
|
onSubmit={createFlight.mutate}
|
|
isPending={createFlight.isPending}
|
|
isError={createFlight.isError}
|
|
error={createFlight.error}
|
|
mah="calc(100vh - 95px - 110px)"
|
|
autofillHobbs
|
|
/>
|
|
</Stack>
|
|
</Container>
|
|
);
|
|
}
|