add createStoryDialog

src/app/story/create.tsx

@@ -0,0 +1,30 @@
+"use client"
+import { createStory } from "app/lib/create"
+import { Dialog, DialogHeader, DialogTrigger, DialogContent, DialogClose, DialogTitle, DialogFooter, DialogDescription } from "@/components/ui/dialog";
+import { Button } from "@/components/ui/button";
+import { ComponentProps } from "react";
+import { Genre } from "@prisma/client";
+import StoryForm from "app/ui/forms/story";
+
+
+export default function CreateStoryDialog({ genres }: ComponentProps<"div"> & { genres: Array<Genre> }) {
+
+  console.log(genres)
+  return (
+    <Dialog>
+      <DialogTrigger asChild>
+        <Button>Create new Story</Button>
+      </DialogTrigger>
+      <DialogContent>
+        <DialogHeader>
+          <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} />
+
+
+      </DialogContent>
+    </Dialog>
+  )
+}
+

src/app/story/page.tsx

@@ -1,16 +1,29 @@
 import { Story } from "@prisma/client";
 import { DataTable } from "app/ui/tables/data-table";
 import { columns } from "./columns";
-import { getStoriesWithGenres } from "app/lib/get";
+import { getGenres, getStoriesWithGenres, getPubsWithGenres } from "app/lib/get";
 import { Genre } from "@prisma/client";
+import CreateStoryDialog from "./create";
 
 export type StoryWithGenres = Story & { genres: Array<Genre> }
 
+
+
+
+
+
 export default async function Page() {
-  const stories: Array<StoryWithGenres> = await getStoriesWithGenres()
+  const genres = await getGenres()
+  const storiesWithGenres: Array<StoryWithGenres> = await getStoriesWithGenres()
+  const pubsWithGenres = await getPubsWithGenres()
+
+
+
   return (
     <div className="container mx-auto">
-      <DataTable columns={columns} data={stories} type="story" />
+      <DataTable columns={columns} data={storiesWithGenres} type="story">
+        <CreateStoryDialog genres={genres} />
+      </DataTable>
     </div>
   )
 }