From 23dbda7135a0d4c01b355883d9648afa915992c7 Mon Sep 17 00:00:00 2001
From: andrzej <andrzejjamesstepien@gmail.com>
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/tailwind.css           |  22 ++++------------------
 src/app/ui/forms/pub.tsx       |   9 ++++-----
 src/app/ui/forms/story.tsx     |  15 ++++++---------
 6 files changed, 28 insertions(+), 42 deletions(-)

diff --git a/prisma/dev.db b/prisma/dev.db
index 9c0bb04bb2dfc87c6bef19f07213eec5934f12e3..48d333c52b0090d970b9a59863bef341d4cae6a1 100644
GIT binary patch
delta 398
zcmZozz|ydQWr8&0k%=<Sj7K&mH2QOSvhy+vGX|6<Nlt$4FDb{xx0I9rB;R%ZLVkC?
zzx>Ah%lHoSE#-g3R||rh1r4J4H29SmG-P=h^9xe*k~0$X<bZq$U0%kd#5@!zH+gAX
z0}sD6FJpOrc~xprvD{?C_#P$(hROTmwS@)6SQ(Ug8B-8IZu8%GP6ehw`N<p&N<#dH
zA&_?x3~p9b2;-eRsduUbzdVB$lPc?7=bZfFR0WsJ#GL$epqSWZ`@Sqj)ej7uOzMnZ
zQ@C7M7??zvUzX)(rW7l9dY0#NdICj+8NVbZCQd%rugb;GB+dM?I1vaZ|Lxafp3Ogd
zv)+VAerYBTR$*pFMkaL@A!bfSb^cQfJdCW?KoMq-$&2Q9GDq@9Zq{4i#;?faVa3kE
z2vRA`f0#jxky%xWfq{XKkqIoy>|wom>iTI4%=7r?ZPvR`!q4Gh&3}%8&BJQ*s{3IE
E0N6Tj3jhEB

delta 353
zcmZozz|ydQWr8&0wuv&%jN3LQH2QP7vGXzuGX|6<iB5j)FDb>zx0H?lB;R%ZLVkC?
zzx>Ah%lHoSE#+Izw|ujpK|9~%rEv{Bg4&vlt~q6?#R`53lMUm0nD}2!-XE_m%)r1P
zqRPwYo1a%)l3Jt?l9`*j`ENX@0+Y4uWR3<UAwFx~NvLqMqCyz&<Vn3#B^Y#=LK(j%
zq5u&$7KY9CeOZjEhZ#7T)EU2~aJjHBFo`n1EX&VKDOT|GEYIivz`(;K%6_3ZC1vut
zepN03CRyf}1v#mysgwWq>oH&FzrI;-LL|R5t17E7Gb1CDI*Sl9C!;$5DFz-!CRLz|
zSs5oUn%~Ks&!4|pZ-E=XBCDz_I}0O7r7-_t1~EovRVkn<KA>VrAkD_ew0Y|KX$s7b
X_#bW7yHLW<0hVS{mE64QewYCO<7Q%2

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 (
 
-    <Dialog>
+    <Dialog open={isOpen} onOpenChange={setIsOpen}>
       <DialogTrigger asChild>
         <Button>
           <span className="hidden md:block">Create new publication</span>
@@ -23,11 +29,9 @@ export default function CreatePubDialog({ genres }: ComponentProps<"div"> & { ge
           <DialogTitle>New publication</DialogTitle>
           <DialogDescription>Create an entry for a new publication i.e. a place you intend to submit stories to.</DialogDescription>
         </DialogHeader>
-        <PubForm createPub={createPub} genres={genres} />
+        <PubForm createPub={createPub} genres={genres} closeDialog={closeDialog} />
         <DialogFooter>
-          <DialogClose >
-            <Button form="pubform">Submit</Button>
-          </DialogClose>
+          <Button form="pubform">Submit</Button>
         </DialogFooter>
 
       </DialogContent>
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 (
     <Dialog open={isOpen} onOpenChange={setIsOpen}>
@@ -25,12 +28,9 @@ export default function CreateStoryDialog({ genres }: ComponentProps<"div"> & {
           <DialogTitle>New story</DialogTitle>
           <DialogDescription>Create an entry for a new story i.e. a thing you intend to submit for publication.</DialogDescription>
         </DialogHeader>
-        <StoryForm createStory={createStory} genres={genres} className="" />
+        <StoryForm createStory={createStory} genres={genres} className="" closeDialog={closeDialog} />
         <DialogFooter>
-          <DialogClose>
-            {/* TODO: pass setIsOpen to form as prop, to be handled post-verification */}
-            <Button form="storyform">Submit</Button>
-          </DialogClose>
+          <Button form="storyform">Submit</Button>
         </DialogFooter>
 
       </DialogContent>
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/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<Genre>, createPub: (data: any) => void }) {
+export default function PubForm({ genres, createPub, className, closeDialog }: ComponentProps<"div"> & { genres: Array<Genre>, createPub: (data: any) => void, closeDialog: () => void }) {
 	const form = useForm<z.infer<typeof pubSchema>>({
 		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: (
-				<pre className="mt-2 w-[340px] rounded-md bg-slate-950 p-4">
-					<code className="text-white">{JSON.stringify(errors, null, 2)}</code>
-				</pre>
+				<Ban />
 			),
 		})
 		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<Genre>, createStory: (data: any) => void, className: string }) {
+export default function StoryForm({ genres, createStory, className, closeDialog }: ComponentProps<"div"> & { genres: Array<Genre>, createStory: (data: any) => void, className: string, closeDialog: () => void }) {
 	const form = useForm<z.infer<typeof formSchema>>({
 		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: (
-				<pre className="mt-2 w-[340px] rounded-md bg-slate-950 p-4">
-					<code className="text-white">{JSON.stringify(errors, null, 2)}</code>
-				</pre>
-			),
+			description: (<Ban />)
 		})
 		console.log(JSON.stringify(errors))
 	}
@@ -100,7 +97,7 @@ export default function StoryForm({ genres, createStory, className }: ComponentP
 								<FormItem className="flex flex-col">
 									<FormLabel className="h-5">Word count</FormLabel>
 									<FormControl>
-										<Input className=" w-24" type="number" step={500} min={1} {...field}></Input>
+										<Input className=" w-24" type="number" step={500} {...field}></Input>
 									</FormControl>
 									<FormMessage />
 								</FormItem>