60 lines
1.1 KiB
TypeScript
60 lines
1.1 KiB
TypeScript
import { useForm } from 'react-hook-form';
|
|
|
|
import {
|
|
TextField,
|
|
CalendarField,
|
|
TimeRangeField,
|
|
Button,
|
|
} from 'components';
|
|
|
|
import {
|
|
StyledMain,
|
|
CreateForm,
|
|
TitleSmall,
|
|
TitleLarge,
|
|
} from './homeStyle';
|
|
|
|
const Home = () => {
|
|
const { register, handleSubmit } = useForm();
|
|
|
|
const onSubmit = data => console.log('submit', data);
|
|
|
|
return (
|
|
<StyledMain>
|
|
<TitleSmall>Create a</TitleSmall>
|
|
<TitleLarge>CRAB FIT</TitleLarge>
|
|
|
|
<CreateForm onSubmit={handleSubmit(onSubmit)}>
|
|
<TextField
|
|
label="Give your event a name!"
|
|
subLabel="Or leave blank to generate one"
|
|
type="text"
|
|
name="name"
|
|
id="name"
|
|
register={register}
|
|
/>
|
|
|
|
<CalendarField
|
|
label="What dates might work?"
|
|
subLabel="Click and drag to select"
|
|
name="dates"
|
|
id="dates"
|
|
register={register}
|
|
/>
|
|
|
|
<TimeRangeField
|
|
label="What times might work?"
|
|
subLabel="Click and drag to select a time range"
|
|
name="times"
|
|
id="times"
|
|
register={register}
|
|
/>
|
|
|
|
<Button type="submit">Create</Button>
|
|
</CreateForm>
|
|
</StyledMain>
|
|
);
|
|
};
|
|
|
|
export default Home;
|