Setup Playwright (#14)
* setting up playwright * renaming client to app * updating node version * updating node version * fixing husky * fixing husky * fixing husky * fixing husky
This commit was merged in pull request #14.
This commit is contained in:
GitHub
12
app/src/components/logbook/Logbook.tsx
Normal file
12
app/src/components/logbook/Logbook.tsx
Normal file
@@ -0,0 +1,12 @@
|
||||
import SiteNav from '../siteNav/SiteNav';
|
||||
|
||||
const Logbook: React.FC<unknown> = () => {
|
||||
return (
|
||||
<div>
|
||||
<SiteNav />
|
||||
<div>Logbook goes here</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default Logbook;
|
||||
122
app/src/components/logbookEntryForm/LogbookEntryForm.tsx
Normal file
122
app/src/components/logbookEntryForm/LogbookEntryForm.tsx
Normal file
@@ -0,0 +1,122 @@
|
||||
import React from 'react';
|
||||
import {
|
||||
Accordion,
|
||||
AccordionItem,
|
||||
Button,
|
||||
DatePicker,
|
||||
Input
|
||||
} from '@nextui-org/react';
|
||||
import { useForm, Controller, SubmitHandler } from 'react-hook-form';
|
||||
|
||||
const LogbookEntryForm: React.FC<unknown> = () => {
|
||||
const { control, handleSubmit } = useForm();
|
||||
|
||||
const onSubmit = (data: unknown) => {
|
||||
console.log(data);
|
||||
};
|
||||
|
||||
return (
|
||||
<form className="m-10" onSubmit={handleSubmit(onSubmit)}>
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div className="self-center">
|
||||
<label>Date</label>
|
||||
</div>
|
||||
<div>
|
||||
<Controller
|
||||
name="date"
|
||||
control={control}
|
||||
render={({ field }) => <DatePicker labelPlacement="outside-left" />}
|
||||
/>
|
||||
</div>
|
||||
<div className="self-center">
|
||||
<label>Aircraft Type</label>
|
||||
</div>
|
||||
<div>
|
||||
<Controller
|
||||
name="aircraftType"
|
||||
control={control}
|
||||
render={({ field }) => (
|
||||
<Input fullWidth={true} labelPlacement="outside-left" />
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
<div className="self-center">
|
||||
<label>Aircraft Identity</label>
|
||||
</div>
|
||||
<div>
|
||||
<Controller
|
||||
name="aircraftIdent"
|
||||
control={control}
|
||||
render={({ field }) => (
|
||||
<Input fullWidth={true} labelPlacement="outside-left" />
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
<div className="self-center">
|
||||
<label>Route To</label>
|
||||
</div>
|
||||
<div>
|
||||
<Controller
|
||||
name="routeTo"
|
||||
control={control}
|
||||
render={({ field }) => <Input />}
|
||||
/>
|
||||
</div>
|
||||
<div className="self-center">
|
||||
<label>Route From</label>
|
||||
</div>
|
||||
<div>
|
||||
<Controller
|
||||
name="routeFrom"
|
||||
control={control}
|
||||
render={({ field }) => <Input />}
|
||||
/>
|
||||
</div>
|
||||
<div className="self-center">
|
||||
<label>Duration of Flight</label>
|
||||
</div>
|
||||
<div>
|
||||
<Controller
|
||||
name="flightDuration"
|
||||
control={control}
|
||||
render={({ field }) => <Input />}
|
||||
/>
|
||||
</div>
|
||||
<div className="self-center">
|
||||
<label>Single Engine Land</label>
|
||||
</div>
|
||||
<div>
|
||||
<Controller
|
||||
name="aircraftSEL"
|
||||
control={control}
|
||||
render={({ field }) => <Input />}
|
||||
/>
|
||||
</div>
|
||||
<div className="col-span-2">
|
||||
<Accordion>
|
||||
<AccordionItem title="Aircraft Category and Class">
|
||||
<div className="self-center">
|
||||
<label>Single Engine Land</label>
|
||||
</div>
|
||||
<div>
|
||||
<Controller
|
||||
name="aircraftSEL"
|
||||
control={control}
|
||||
render={({ field }) => <Input />}
|
||||
/>
|
||||
</div>
|
||||
</AccordionItem>
|
||||
</Accordion>
|
||||
</div>
|
||||
<div className="col-span-2 justify-self-end">
|
||||
<Button color="default">Cancel</Button>
|
||||
<Button className="ml-10" color="primary">
|
||||
Save
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
);
|
||||
};
|
||||
|
||||
export default LogbookEntryForm;
|
||||
85
app/src/components/pilotForm/PilotForm.tsx
Normal file
85
app/src/components/pilotForm/PilotForm.tsx
Normal file
@@ -0,0 +1,85 @@
|
||||
import {
|
||||
Accordion,
|
||||
AccordionItem,
|
||||
Button,
|
||||
DatePicker,
|
||||
Input,
|
||||
Select,
|
||||
SelectItem
|
||||
} from '@nextui-org/react';
|
||||
import { useForm, Controller, SubmitHandler } from 'react-hook-form';
|
||||
|
||||
const PilotForm: React.FC<unknown> = () => {
|
||||
const { control, handleSubmit } = useForm();
|
||||
|
||||
const onSubmit = (data: unknown) => {
|
||||
console.log(data);
|
||||
};
|
||||
|
||||
return (
|
||||
<form className="m-10" onSubmit={handleSubmit(onSubmit)}>
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div className="self-center">
|
||||
<label>First Name</label>
|
||||
</div>
|
||||
<div>
|
||||
<Controller
|
||||
name="firstName"
|
||||
control={control}
|
||||
render={({ field }) => <Input />}
|
||||
/>
|
||||
</div>
|
||||
<div className="self-center">
|
||||
<label>Last Name</label>
|
||||
</div>
|
||||
<div>
|
||||
<Controller
|
||||
name="lastName"
|
||||
control={control}
|
||||
render={({ field }) => <Input />}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<Accordion>
|
||||
<AccordionItem title="Medical Certificate">
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div className="self-center">
|
||||
<label>Class</label>
|
||||
</div>
|
||||
<div>
|
||||
<Controller
|
||||
name="medicalClass"
|
||||
control={control}
|
||||
render={({ field }) => (
|
||||
<Select>
|
||||
<SelectItem key="first" value="First">
|
||||
First
|
||||
</SelectItem>
|
||||
<SelectItem key="second" value="Second">
|
||||
Second
|
||||
</SelectItem>
|
||||
<SelectItem key="Third" value="Third">
|
||||
Third
|
||||
</SelectItem>
|
||||
</Select>
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
<div className="self-center">
|
||||
<label>Expires</label>
|
||||
</div>
|
||||
<div>
|
||||
<Controller
|
||||
name="medicalExpiration"
|
||||
control={control}
|
||||
render={({ field }) => <DatePicker />}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</AccordionItem>
|
||||
</Accordion>
|
||||
</form>
|
||||
);
|
||||
};
|
||||
|
||||
export default PilotForm;
|
||||
15
app/src/components/pilots/Pilots.tsx
Normal file
15
app/src/components/pilots/Pilots.tsx
Normal file
@@ -0,0 +1,15 @@
|
||||
import SiteNav from '../siteNav/SiteNav';
|
||||
import PilotForm from '../pilotForm/PilotForm';
|
||||
|
||||
const Pilots: React.FC<unknown> = () => {
|
||||
return (
|
||||
<div>
|
||||
<SiteNav />
|
||||
<div>
|
||||
<PilotForm />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default Pilots;
|
||||
59
app/src/components/siteNav/SiteNav.tsx
Normal file
59
app/src/components/siteNav/SiteNav.tsx
Normal file
@@ -0,0 +1,59 @@
|
||||
import {
|
||||
Avatar,
|
||||
Link,
|
||||
Navbar,
|
||||
NavbarBrand,
|
||||
NavbarContent,
|
||||
NavbarItem,
|
||||
Button
|
||||
} from '@nextui-org/react';
|
||||
import { Link as ReactRouterLink } from 'react-router-dom';
|
||||
import { useIsAuthenticated, useMsal } from '@azure/msal-react';
|
||||
|
||||
const SiteNav: React.FC<unknown> = () => {
|
||||
const isAuthenticated = useIsAuthenticated();
|
||||
const { accounts, instance } = useMsal();
|
||||
const initializeLogin = () => {
|
||||
instance.loginRedirect();
|
||||
};
|
||||
|
||||
console.log(accounts);
|
||||
|
||||
return (
|
||||
<Navbar isBordered>
|
||||
<NavbarBrand>Site Logo Goes Here</NavbarBrand>
|
||||
<NavbarContent justify="center">
|
||||
<NavbarItem>
|
||||
<Link>
|
||||
<ReactRouterLink to="/">Flights</ReactRouterLink>
|
||||
</Link>
|
||||
</NavbarItem>
|
||||
<NavbarItem>
|
||||
<Link>
|
||||
<ReactRouterLink to="/logbook">Logbook</ReactRouterLink>
|
||||
</Link>
|
||||
</NavbarItem>
|
||||
<NavbarItem>
|
||||
<Link>
|
||||
<ReactRouterLink to="/checklists">Checklists</ReactRouterLink>
|
||||
</Link>
|
||||
</NavbarItem>
|
||||
<NavbarItem>
|
||||
<Link>
|
||||
<ReactRouterLink to="/pilots">Pilots</ReactRouterLink>
|
||||
</Link>
|
||||
</NavbarItem>
|
||||
</NavbarContent>
|
||||
<NavbarContent justify="end">
|
||||
{!isAuthenticated && (
|
||||
<Button as={Link} color="primary" href="#" onClick={initializeLogin}>
|
||||
Login
|
||||
</Button>
|
||||
)}
|
||||
{isAuthenticated && <Avatar name={accounts[0]?.username} />}
|
||||
</NavbarContent>
|
||||
</Navbar>
|
||||
);
|
||||
};
|
||||
|
||||
export default SiteNav;
|
||||
Reference in New Issue
Block a user