adding pilot

This commit is contained in:
2024-08-03 11:38:30 -05:00
parent ac52c5335f
commit ef184aed80
7 changed files with 170 additions and 26 deletions

View File

@@ -16,13 +16,16 @@
"@fortawesome/free-regular-svg-icons": "^6.5.2",
"@fortawesome/free-solid-svg-icons": "^6.5.2",
"@fortawesome/react-fontawesome": "^0.2.2",
"@noahspan/noahspan-components": "^0.5.1",
"@hookform/resolvers": "^3.9.0",
"@noahspan/noahspan-components": "^0.5.6",
"axios": "^1.7.2",
"framer-motion": "^11.1.7",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-hook-form": "^7.51.4",
"react-router-dom": "^6.23.0"
"react-router-dom": "^6.23.0",
"yup": "^1.4.0",
"zod": "^3.23.8"
},
"devDependencies": {
"@microsoft/microsoft-graph-types": "^2.40.0",

View File

@@ -1,12 +1,7 @@
import { useState } from 'react';
import { useForm, Controller, FormProvider } from 'react-hook-form';
import {
Accordion,
AccordionBody,
AccordionHeader,
Button,
ChevronDownIcon,
ChevronUpIcon,
DatePicker,
Drawer,
DrawerBody,
@@ -24,6 +19,40 @@ import { Person } from '@microsoft/microsoft-graph-types';
import { AxiosInstance, AxiosResponse } from 'axios';
import { useHttpClient } from '../../hooks/httpClient/UseHttpClient';
import { useAccessToken } from '../../hooks/accessToken/UseAcessToken';
import { zodResolver } from '@hookform/resolvers/zod';
import { z } from 'zod';
import { IPilotFormCertificates } from '../pilotFormCertificates/IPilotFormCertificates';
import { IPilotFormEndorsements } from '../pilotFormEndorsements/IPilotFormEndorsements';
interface PilotFormSchema {
id: string;
name: string;
address: string;
city: string;
state: string;
postalCode: string;
email: string;
phone: string;
certificates: IPilotFormCertificates[];
endorsements: IPilotFormEndorsements[];
medicalClass: string;
medicalExpiration: string;
}
const schema = z.object({
id: z.string(),
name: z.string(),
address: z.string(),
city: z.string(),
state: z.string(),
postalCode: z.string(),
email: z.string(),
phone: z.string(),
// certificates: z.array(),
// endorsements: z.array(),
medicalClass: z.string(),
medicalExpiration: z.string()
});
interface PilotFormProps {
isDrawerOpen: boolean;
@@ -39,9 +68,11 @@ const PilotForm: React.FC<PilotFormProps> = ({
const [isPeoplePickerLoading, setIsPeoplePickerLoading] =
useState<boolean>(false);
const { getAccessToken } = useAccessToken();
const methods = useForm();
const methods = useForm<PilotFormSchema>({
resolver: zodResolver(schema)
});
const onSubmit = (data: unknown) => {
const onSubmit = (data: PilotFormSchema) => {
console.log(data);
};
@@ -120,6 +151,7 @@ const PilotForm: React.FC<PilotFormProps> = ({
control={methods.control}
render={({ field }) => (
<Input
className="!border-t-blue-gray-200 focus:!border-t-gray-900"
labelProps={{
className: 'before:content-none after:content-none'
}}
@@ -213,6 +245,27 @@ const PilotForm: React.FC<PilotFormProps> = ({
)}
/>
</div>
<div className="col-span-1">
<Typography variant="h6">Last Review</Typography>
</div>
<div className="col-span-3">
<Controller
name="lastReview"
control={methods.control}
render={({ field }) => {
return (
<DatePicker
handleDateChanged={(date: string) => {
methods.setValue('lastReview', date);
}}
inputProps={{
value: field.value
}}
/>
);
}}
/>
</div>
<div className="col-span-4">
<Typography variant="h5">Certificates</Typography>
<hr className="my-3" />

View File

@@ -6,7 +6,8 @@ import {
Option,
PlusIcon,
Select,
TrashIcon
TrashIcon,
Typography
} from '@noahspan/noahspan-components';
import { Controller, useFieldArray, useFormContext } from 'react-hook-form';
@@ -26,6 +27,20 @@ const PilotFormCertificates: React.FC<IPilotFormCertificates> = ({
return (
<>
{fields.length > 0 && (
<>
<div className="col-span-1">
<Typography variant="h6">Type</Typography>
</div>
<div className="col-span-1">
<Typography variant="h6">Number</Typography>
</div>
<div className="col-span-1">
<Typography variant="h6">Date of Issue</Typography>
</div>
<div className="col-span-1"></div>
</>
)}
{fields.map((field, index) => {
return (
<>
@@ -87,6 +102,7 @@ const PilotFormCertificates: React.FC<IPilotFormCertificates> = ({
<Button
className="flex items-center gap-3"
onClick={() => remove(index)}
variant="outlined"
>
<TrashIcon size="lg" />
Delete

View File

@@ -6,7 +6,8 @@ import {
Option,
PlusIcon,
Select,
TrashIcon
TrashIcon,
Typography
} from '@noahspan/noahspan-components';
import { Controller, useFieldArray, useFormContext } from 'react-hook-form';
@@ -26,6 +27,18 @@ const PilotFormEndorsements: React.FC<IPilotFormEndorsements> = ({
return (
<>
{fields.length > 0 && (
<>
<div className="col-span-1">
<Typography variant="h6">Type</Typography>
</div>
<div className="col-span-1">
<Typography variant="h6">Date of Issue</Typography>
</div>
<div className="col-span-1"></div>
<div className="col-span-1"></div>
</>
)}
{fields.map((field, index) => {
return (
<>
@@ -75,6 +88,7 @@ const PilotFormEndorsements: React.FC<IPilotFormEndorsements> = ({
<Button
className="flex items-center gap-3"
onClick={() => remove(index)}
variant="outlined"
>
<TrashIcon size="lg" />
Delete