From 52e3a6f31cf43df19a4b966f8a5852a009189cd7 Mon Sep 17 00:00:00 2001 From: andrzej Date: Wed, 25 Sep 2024 18:48:03 +0200 Subject: [PATCH] controlled create dialogs --- prisma/dev.db | Bin 69632 -> 69632 bytes src/app/publication/create.tsx | 14 +++++++++----- src/app/story/create.tsx | 10 +++++----- src/app/submission/create.tsx | 12 ++++++++---- src/app/submission/edit.tsx | 7 +++---- src/app/tailwind.css | 22 ++++------------------ src/app/ui/forms/editSub.tsx | 3 ++- src/app/ui/forms/pub.tsx | 9 ++++----- src/app/ui/forms/story.tsx | 15 ++++++--------- src/app/ui/forms/sub.tsx | 13 ++++++------- src/app/ui/tables/contextMenu.tsx | 5 ----- src/app/ui/tables/data-table.tsx | 4 ++++ 12 files changed, 51 insertions(+), 63 deletions(-) diff --git a/prisma/dev.db b/prisma/dev.db index 9c0bb04bb2dfc87c6bef19f07213eec5934f12e3..9ff9735ca218d26e2e12bcdef0eb34e7f83e528c 100644 GIT binary patch delta 642 zcmY+9O-K}B7{}jd-d$(sZQl1yH@CIbb<{@1*hPyp)W}k77Y}Mmu?5=L4(*2QsH-gn z!A7Tz{K&xu5=;dTN6j@9j43^FE2bs<`Rol)n9vgc;WxL&(lYl^NExa7 z`b^Sqwv9g#5HjD5pK_OboT!09^k4bygKq z5me`=-bo{=D}8Zo(zu;>9{a+=9Z-KDNoay!QPSr?LM7h6Ys8~TB^*u}QaEqi@Ke(? zGrOn~F8J_%Qp;l=EC%r^U$uiv5$+R0PB#V+nj95af+qd}$>8kD8yqq>Uu1BEN9^Ew zKd%!)ouUH@oo>E^Jb={`2q6YS(c(~-z4GRng4g((9o(Dcu22`xqOwq@{p#~|rG<&_ zozfVerkZPyzIHuwwTt`GcYc!P*kg8{9^+o_6$1tAx}$%}tbhp51=78}E5ZiI9c*+? zS4Q+HrLDu-Aka>(>Cs|7eYTjbZxReS5E4FGJp}TvBdl8U1QtNuu08_4p>m+ng#aE> z1b*B<6E7{Zh6$Xrx(N_ywiaZ#WMv3YVAi4xJywpuMbChGI9Dr<#^#E1t)-*e83rl% E3;kB9E&u=k delta 595 zcmY+8PiPZS5XRr^ZnA%}`(D#DHAx$~(Jnz_!v;ao3Kps58mZQ*H6wyn;OVCaA()ot@V7?#Bl&eg+%B&2) z*2}?h*!p;TI(cMR)rxsNSJWh4qz}Qhl3sWaXC>MLSLW|{jqgc+fX6i_*}*L` zM<#HGoFMOT1K02d-mu*26KvF`%Az}R6fVpzXhr$5Y{b&fDDutNPDeZlp*}@|N&7-c zE6Aytdz#fr^D;FWG`RBNUOXzT9+VZ5Z%D@K^EDqjPF;t+%z^5QGsrsk;w~r+#8Y9| z%L?ZiM0x4BexyAvpD zZF60wcge05ZI%ePA3GJl_5SNE`IyLla`01RPB_aog(Ys0JIS{BpJW)f@KfUZCw8PO zE7bGHX^yb)igNktJ1o2b7&1YGN9GS6lFTJPhs-en66Oa9By(MW$55yby5KjMWdV3x z5d%B|s7MtFf}FWcU~GQ~B0^NE8z3|9f^m_pVE=#8ZHDa4P-=Q!zL?3$YD|uuKBd}z dMpf;WCni%7HD-oH=x0lrTsBk4))z56guh@Enb80M diff --git a/src/app/publication/create.tsx b/src/app/publication/create.tsx index 91ef6ed..a50db64 100644 --- a/src/app/publication/create.tsx +++ b/src/app/publication/create.tsx @@ -6,12 +6,18 @@ import { Genre } from "@prisma/client"; import { createPub } from "app/lib/create"; import PubForm from "app/ui/forms/pub"; import { Plus } from "lucide-react"; +import { useState } from "react"; export default function CreatePubDialog({ genres }: ComponentProps<"div"> & { genres: Genre[] }) { + const [isOpen, setIsOpen] = useState(false) + function closeDialog() { + setIsOpen(false) + } + return ( - + - + diff --git a/src/app/story/create.tsx b/src/app/story/create.tsx index 487719e..d3cba95 100644 --- a/src/app/story/create.tsx +++ b/src/app/story/create.tsx @@ -11,6 +11,9 @@ import { Plus } from "lucide-react"; export default function CreateStoryDialog({ genres }: ComponentProps<"div"> & { genres: Genre[] }) { const [isOpen, setIsOpen] = useState(false) + function closeDialog() { + setIsOpen(false) + } return ( @@ -25,12 +28,9 @@ export default function CreateStoryDialog({ genres }: ComponentProps<"div"> & { New story Create an entry for a new story i.e. a thing you intend to submit for publication. - + - - {/* TODO: pass setIsOpen to form as prop, to be handled post-verification */} - - + diff --git a/src/app/submission/create.tsx b/src/app/submission/create.tsx index 59bfa95..dd27e33 100644 --- a/src/app/submission/create.tsx +++ b/src/app/submission/create.tsx @@ -7,6 +7,7 @@ import { ComponentProps } from "react"; import { Pub, Response, Story } from "@prisma/client"; import SubmissionForm from "app/ui/forms/sub"; import { Plus } from "lucide-react"; +import { useState } from "react"; type CreateSubDefaults = { @@ -20,8 +21,13 @@ type CreateSubDefaults = { export default function CreateSubmissionDialog({ stories, pubs, responses, defaults }: ComponentProps<"div"> & { stories: Story[], pubs: Pub[], responses: Response[], defaults?: CreateSubDefaults }) { + const [isOpen, setIsOpen] = useState(false) + function closeDialog() { + setIsOpen(false) + } + return ( - + diff --git a/src/app/submission/edit.tsx b/src/app/submission/edit.tsx index 0d951b0..ec8d272 100644 --- a/src/app/submission/edit.tsx +++ b/src/app/submission/edit.tsx @@ -6,10 +6,11 @@ import { ComponentProps } from "react"; import { Pub, Response, Story } from "@prisma/client"; import SubmissionForm, { SubForm } from "app/ui/forms/sub"; import EditSubmissionForm from "app/ui/forms/editSub"; +import { useState } from "react"; +export default function EditSubmissionDialog({ stories, pubs, responses, defaults, children, closeDialog }: ComponentProps<"div"> & { stories: Story[], pubs: Pub[], responses: Response[], defaults: SubForm, closeDialog: () => void }) { -export default function EditSubmissionDialog({ stories, pubs, responses, defaults, children }: ComponentProps<"div"> & { stories: Story[], pubs: Pub[], responses: Response[], defaults: SubForm }) { return ( <> @@ -17,10 +18,8 @@ export default function EditSubmissionDialog({ stories, pubs, responses, default Edit Submission Change response status, edit dates etc - + - - diff --git a/src/app/tailwind.css b/src/app/tailwind.css index d2566ce..d3db459 100644 --- a/src/app/tailwind.css +++ b/src/app/tailwind.css @@ -1097,10 +1097,6 @@ body { justify-content: space-between; } -.justify-around { - justify-content: space-around; -} - .gap-1 { gap: 0.25rem; } @@ -1202,6 +1198,10 @@ body { white-space: nowrap; } +.rounded-3xl { + border-radius: 1.5rem; +} + .rounded-full { border-radius: 9999px; } @@ -1214,25 +1214,11 @@ body { border-radius: calc(var(--radius) - 4px); } -.rounded-3xl { - border-radius: 1.5rem; -} - -.rounded-l-3xl { - border-top-left-radius: 1.5rem; - border-bottom-left-radius: 1.5rem; -} - .rounded-t-3xl { border-top-left-radius: 1.5rem; border-top-right-radius: 1.5rem; } -.rounded-l { - border-top-left-radius: 0.25rem; - border-bottom-left-radius: 0.25rem; -} - .rounded-tl-3xl { border-top-left-radius: 1.5rem; } diff --git a/src/app/ui/forms/editSub.tsx b/src/app/ui/forms/editSub.tsx index 2bd23c8..6248460 100644 --- a/src/app/ui/forms/editSub.tsx +++ b/src/app/ui/forms/editSub.tsx @@ -40,7 +40,7 @@ import { useRouter } from "next/navigation" export type SubForm = z.infer -export default function EditSubmissionForm({ stories, pubs, responses, defaults }) { +export default function EditSubmissionForm({ stories, pubs, responses, defaults, closeDialog }) { const form = useForm>({ resolver: zodResolver(subSchema), defaultValues: { @@ -76,6 +76,7 @@ export default function EditSubmissionForm({ stories, pubs, responses, defaults if (res === undefined) throw new Error("something went wrong") toast({ title: "Successfully created new submission!" }) router.refresh() + closeDialog() } catch (error) { toast({ title: "UH-OH", diff --git a/src/app/ui/forms/pub.tsx b/src/app/ui/forms/pub.tsx index 3c75149..139df87 100644 --- a/src/app/ui/forms/pub.tsx +++ b/src/app/ui/forms/pub.tsx @@ -21,8 +21,9 @@ import { Genre } from "@prisma/client" import GenrePicker from "./genrePicker" import { pubSchema } from "./schemas" import { useRouter } from "next/navigation" +import { Ban } from "lucide-react" -export default function PubForm({ genres, createPub, className }: ComponentProps<"div"> & { genres: Array, createPub: (data: any) => void }) { +export default function PubForm({ genres, createPub, className, closeDialog }: ComponentProps<"div"> & { genres: Array, createPub: (data: any) => void, closeDialog: () => void }) { const form = useForm>({ resolver: zodResolver(pubSchema), defaultValues: { @@ -41,6 +42,7 @@ export default function PubForm({ genres, createPub, className }: ComponentProps if (!res) throw new Error("something went wrong") toast({ title: "Successfully submitted:", description: values.title }) router.refresh() + closeDialog() } catch (error) { toast({ title: "Oh dear... ", @@ -51,11 +53,8 @@ export default function PubForm({ genres, createPub, className }: ComponentProps function onErrors(errors) { toast({ - title: "You have errors", description: ( - 
-					{JSON.stringify(errors, null, 2)}
-
+ ), }) console.log(JSON.stringify(errors)) diff --git a/src/app/ui/forms/story.tsx b/src/app/ui/forms/story.tsx index 37db8de..e5e1a52 100644 --- a/src/app/ui/forms/story.tsx +++ b/src/app/ui/forms/story.tsx @@ -15,11 +15,12 @@ import { import { Input } from "@/components/ui/input" import { toast } from "@/components/ui/use-toast" -import { ComponentProps } from "react" +import { ComponentProps, SetStateAction } from "react" import { Genre, Story } from "@prisma/client" import { randomStoryTitle } from "app/lib/shortStoryTitleGenerator" import GenrePicker from "./genrePicker" import { useRouter } from "next/navigation" +import { Ban, Cross } from "lucide-react" export const formSchema = z.object({ id: z.number().optional(), @@ -28,7 +29,7 @@ export const formSchema = z.object({ genres: z.array(z.number()) }) -export default function StoryForm({ genres, createStory, className }: ComponentProps<"div"> & { genres: Array, createStory: (data: any) => void, className: string }) { +export default function StoryForm({ genres, createStory, className, closeDialog }: ComponentProps<"div"> & { genres: Array, createStory: (data: any) => void, className: string, closeDialog: () => void }) { const form = useForm>({ resolver: zodResolver(formSchema), defaultValues: { @@ -46,6 +47,7 @@ export default function StoryForm({ genres, createStory, className }: ComponentP if (!res) throw new Error("something went wrong") toast({ title: "Sucessfully submitted:", description: values.title }) router.refresh() + closeDialog() } catch (error) { toast({ title: "Oh dear... ", @@ -58,12 +60,7 @@ export default function StoryForm({ genres, createStory, className }: ComponentP function onErrors(errors) { toast({ - title: "You have errors", - description: ( - 
-					{JSON.stringify(errors, null, 2)}
-
- ), + description: () }) console.log(JSON.stringify(errors)) } @@ -100,7 +97,7 @@ export default function StoryForm({ genres, createStory, className }: ComponentP Word count - + diff --git a/src/app/ui/forms/sub.tsx b/src/app/ui/forms/sub.tsx index c8dbf41..b578a12 100644 --- a/src/app/ui/forms/sub.tsx +++ b/src/app/ui/forms/sub.tsx @@ -35,11 +35,12 @@ import { useState } from "react" import { createSub } from "app/lib/create" import { subSchema } from "./schemas" import { useRouter } from "next/navigation" +import { Ban } from "lucide-react" export type SubForm = z.infer -export default function SubmissionForm({ stories, pubs, responses, defaults }) { +export default function SubmissionForm({ stories, pubs, responses, defaults, closeDialog }: { stories: any, pubs: any, responses: any, defaults: any, closeDialog: () => void }) { const form = useForm>({ resolver: zodResolver(subSchema), defaultValues: { @@ -71,24 +72,22 @@ export default function SubmissionForm({ stories, pubs, responses, defaults }) { async function onSubmit(values: z.infer) { try { const res = await createSub(values) - if (res === undefined) throw new Error("something went wrong") + if (!res) throw new Error("something went wrong") toast({ title: "Successfully created new submission!" }) + router.refresh() + closeDialog() } catch (error) { toast({ title: "UH-OH", description: error.message }) } - router.refresh() } function onErrors(errors) { toast({ - title: "You have errors", description: ( - 
-					{JSON.stringify(errors, null, 2)}
-
+ ), }) console.log(JSON.stringify(errors)) diff --git a/src/app/ui/tables/contextMenu.tsx b/src/app/ui/tables/contextMenu.tsx index feb46ec..c12e13c 100644 --- a/src/app/ui/tables/contextMenu.tsx +++ b/src/app/ui/tables/contextMenu.tsx @@ -1,12 +1,7 @@ -import { Dialog, DialogTrigger, DialogClose, DialogDescription, DialogContent, DialogTitle, DialogHeader, DialogFooter } from "@/components/ui/dialog" -import { Button } from "@/components/ui/button" import { ContextMenuContent, ContextMenuItem, ContextMenuSubTrigger, ContextMenuSeparator, ContextMenuSub, ContextMenuSubContent } from "@/components/ui/context-menu" -import { deleteRecord } from "app/lib/del" import Link from "next/link" import { ComponentProps, useState } from "react" import { Row, Table, TableState } from "@tanstack/react-table" -import { tableNameToItemName } from "app/lib/nameMaps" -import EditSubmissionDialog from "app/submission/edit" export default function FormContextMenu({ table, row, openEditDialog, openDeleteDialog }: ComponentProps<"div"> & { table: Table, row: Row, openEditDialog: (row: Row) => void, openDeleteDialog: (row: Row) => void }) { const pathname = table.options.meta.pathname diff --git a/src/app/ui/tables/data-table.tsx b/src/app/ui/tables/data-table.tsx index 8833fa6..7f7998b 100644 --- a/src/app/ui/tables/data-table.tsx +++ b/src/app/ui/tables/data-table.tsx @@ -119,6 +119,9 @@ export function DataTable({ setIsDeleteDialogVisible(true) SetDialogRow(row) } + function closeEditDialog() { + setIsEditDialogVisible(false) + } @@ -169,6 +172,7 @@ export function DataTable({ pubs={pubs} responses={responses} defaults={dialogRow?.original} + closeDialog={closeEditDialog} />