Add hidden event types

This commit is contained in:
Bailey Pumfleet 2021-04-28 10:23:30 +01:00
parent b32a4c75c0
commit c320b0f20d
5 changed files with 72 additions and 8 deletions

View file

@ -3,7 +3,7 @@ import Link from 'next/link';
import prisma from '../lib/prisma';
export default function User(props) {
const eventTypes = props.user.eventTypes.map(type =>
const eventTypes = props.eventTypes.map(type =>
<li key={type.id}>
<Link href={'/' + props.user.username + '/' + type.id.toString()}>
<a className="block px-6 py-4">
@ -46,9 +46,10 @@ export default function User(props) {
export async function getServerSideProps(context) {
const user = await prisma.user.findFirst({
where: {
username: context.query.user,
username: context.query.user,
},
select: {
id: true,
username: true,
name: true,
bio: true,
@ -63,9 +64,17 @@ export async function getServerSideProps(context) {
}
}
const eventTypes = await prisma.eventType.findMany({
where: {
userId: user.id,
hidden: false
}
});
return {
props: {
user
user,
eventTypes
},
}
}

View file

@ -26,12 +26,14 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
const title = req.body.title;
const description = req.body.description;
const length = parseInt(req.body.length);
const hidden = req.body.hidden;
const createEventType = await prisma.eventType.create({
data: {
title: title,
description: description,
length: length,
hidden: hidden,
userId: user.id,
},
});
@ -56,6 +58,7 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
const title = req.body.title;
const description = req.body.description;
const length = parseInt(req.body.length);
const hidden = req.body.hidden;
const updateEventType = await prisma.eventType.update({
where: {
@ -64,7 +67,8 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
data: {
title: title,
description: description,
length: length
length: length,
hidden: hidden
},
});

View file

@ -12,6 +12,7 @@ export default function EventType(props) {
const titleRef = useRef();
const descriptionRef = useRef();
const lengthRef = useRef();
const isHiddenRef = useRef();
if (loading) {
return <p className="text-gray-400">Loading...</p>;
@ -27,12 +28,13 @@ export default function EventType(props) {
const enteredTitle = titleRef.current.value;
const enteredDescription = descriptionRef.current.value;
const enteredLength = lengthRef.current.value;
const enteredIsHidden = isHiddenRef.current.checked;
// TODO: Add validation
const response = await fetch('/api/availability/eventtype', {
method: 'PATCH',
body: JSON.stringify({id: props.eventType.id, title: enteredTitle, description: enteredDescription, length: enteredLength}),
body: JSON.stringify({id: props.eventType.id, title: enteredTitle, description: enteredDescription, length: enteredLength, hidden: enteredIsHidden}),
headers: {
'Content-Type': 'application/json'
}
@ -88,6 +90,26 @@ export default function EventType(props) {
</div>
</div>
</div>
<div className="my-8">
<div className="relative flex items-start">
<div className="flex items-center h-5">
<input
ref={isHiddenRef}
id="ishidden"
name="ishidden"
type="checkbox"
className="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300 rounded"
defaultChecked={props.eventType.hidden}
/>
</div>
<div className="ml-3 text-sm">
<label htmlFor="ishidden" className="font-medium text-gray-700">
Hide this event type
</label>
<p className="text-gray-500">Hide the event type from your page, so it can only be booked through it's URL.</p>
</div>
</div>
</div>
<button type="submit" className="btn btn-primary">Update</button>
<Link href="/availability"><a className="ml-2 btn btn-white">Cancel</a></Link>
</form>
@ -129,7 +151,8 @@ export async function getServerSideProps(context) {
id: true,
title: true,
description: true,
length: true
length: true,
hidden: true
}
});

View file

@ -17,6 +17,7 @@ export default function Availability(props) {
const titleRef = useRef();
const descriptionRef = useRef();
const lengthRef = useRef();
const isHiddenRef = useRef();
const startHoursRef = useRef();
const startMinsRef = useRef();
@ -55,12 +56,13 @@ export default function Availability(props) {
const enteredTitle = titleRef.current.value;
const enteredDescription = descriptionRef.current.value;
const enteredLength = lengthRef.current.value;
const enteredIsHidden = isHiddenRef.current.checked;
// TODO: Add validation
const response = await fetch('/api/availability/eventtype', {
method: 'POST',
body: JSON.stringify({title: enteredTitle, description: enteredDescription, length: enteredLength}),
body: JSON.stringify({title: enteredTitle, description: enteredDescription, length: enteredLength, hidden: enteredIsHidden}),
headers: {
'Content-Type': 'application/json'
}
@ -139,6 +141,11 @@ export default function Availability(props) {
<tr>
<td className="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">
{eventType.title}
{eventType.hidden &&
<span className="ml-2 inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-gray-100 text-gray-800">
Hidden
</span>
}
</td>
<td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
{eventType.description}
@ -221,6 +228,25 @@ export default function Availability(props) {
</div>
</div>
</div>
<div className="my-8">
<div className="relative flex items-start">
<div className="flex items-center h-5">
<input
ref={isHiddenRef}
id="ishidden"
name="ishidden"
type="checkbox"
className="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300 rounded"
/>
</div>
<div className="ml-3 text-sm">
<label htmlFor="ishidden" className="font-medium text-gray-700">
Hide this event type
</label>
<p className="text-gray-500">Hide the event type from your page, so it can only be booked through it's URL.</p>
</div>
</div>
</div>
{/* TODO: Add an error message when required input fields empty*/}
<div className="mt-5 sm:mt-4 sm:flex sm:flex-row-reverse">
<button type="submit" className="btn btn-primary">
@ -324,7 +350,8 @@ export async function getServerSideProps(context) {
id: true,
title: true,
description: true,
length: true
length: true,
hidden: true
}
});
return {

View file

@ -15,6 +15,7 @@ model EventType {
title String
description String?
length Int
hidden Boolean @default(false)
user User? @relation(fields: [userId], references: [id])
userId Int?
}