begin implementation of edit feature
This commit is contained in:
		
							parent
							
								
									c6496130e3
								
							
						
					
					
						commit
						134cfa136a
					
				
							
								
								
									
										
											BIN
										
									
								
								prisma/dev.db
								
								
								
								
							
							
						
						
									
										
											BIN
										
									
								
								prisma/dev.db
								
								
								
								
							
										
											Binary file not shown.
										
									
								
							|  | @ -1,12 +1,12 @@ | ||||||
| "use server" | "use server" | ||||||
| import { Genre } from "@prisma/client" | import { Genre, Story } from "@prisma/client" | ||||||
| import prisma from "./db" | import prisma from "./db" | ||||||
| import { revalidatePath } from "next/cache" | import { revalidatePath } from "next/cache" | ||||||
| import { redirect } from "next/navigation" | import { redirect } from "next/navigation" | ||||||
| 
 | 
 | ||||||
| export async function createStory(data) { | export async function createStory(data: Story & { genres: number[] }) { | ||||||
| 	"use server" | 	"use server" | ||||||
| 	const genresArray = data.genres.map((e: Genre) => { return { id: e } }) | 	const genresArray = data.genres.map((e) => { return { id: e } }) | ||||||
| 	const res = await prisma.story.create({ | 	const res = await prisma.story.create({ | ||||||
| 		data: { | 		data: { | ||||||
| 			title: data.title, | 			title: data.title, | ||||||
|  |  | ||||||
|  | @ -0,0 +1,22 @@ | ||||||
|  | import { Genre, Story } from "@prisma/client" | ||||||
|  | import { StoryWithGenres } from "app/story/page" | ||||||
|  | import prisma from "./db" | ||||||
|  | import { revalidatePath } from "next/cache" | ||||||
|  | import { redirect } from "next/navigation" | ||||||
|  | 
 | ||||||
|  | export async function updateStory(data: Story & { genres: number[] }) { | ||||||
|  | 	"use server" | ||||||
|  | 	const genresArray = data.genres.map((e) => { return { id: e } }) | ||||||
|  | 
 | ||||||
|  | 	const res = await prisma.story.update({ | ||||||
|  | 		where: { id: data.id }, | ||||||
|  | 		data: { | ||||||
|  | 			title: data.title, | ||||||
|  | 			word_count: data.word_count, | ||||||
|  | 			genres: { set: genresArray } | ||||||
|  | 		} | ||||||
|  | 	}) | ||||||
|  | 	console.log(`updated story: ${res}`) | ||||||
|  | 	revalidatePath("/story") | ||||||
|  | 	redirect("/story") | ||||||
|  | } | ||||||
|  | @ -19,7 +19,7 @@ export default function CreateStoryDialog({ genres }: ComponentProps<"div"> & { | ||||||
|           <DialogTitle>New story</DialogTitle> |           <DialogTitle>New story</DialogTitle> | ||||||
|           <DialogDescription>Create an entry for a new story i.e. a thing you intend to submit for publication.</DialogDescription> |           <DialogDescription>Create an entry for a new story i.e. a thing you intend to submit for publication.</DialogDescription> | ||||||
|         </DialogHeader> |         </DialogHeader> | ||||||
|         <StoryForm createStory={createStory} genres={genres} /> |         <StoryForm createStory={createStory} genres={genres} existingData={null} /> | ||||||
|         <DialogFooter> |         <DialogFooter> | ||||||
|           <Button form="storyform">Submit</Button> |           <Button form="storyform">Submit</Button> | ||||||
|         </DialogFooter> |         </DialogFooter> | ||||||
|  |  | ||||||
|  | @ -23,6 +23,7 @@ export default async function Page() { | ||||||
|     <div className="container mx-auto"> |     <div className="container mx-auto"> | ||||||
|       <DataTable columns={columns} data={storiesWithGenres} type="story"> |       <DataTable columns={columns} data={storiesWithGenres} type="story"> | ||||||
|         <CreateStoryDialog genres={genres} /> |         <CreateStoryDialog genres={genres} /> | ||||||
|  |         {/* TODO - EDIT STORY DIALOG */} | ||||||
|       </DataTable> |       </DataTable> | ||||||
|     </div> |     </div> | ||||||
|   ) |   ) | ||||||
|  |  | ||||||
|  | @ -21,31 +21,33 @@ import { | ||||||
| 	PopoverContent, | 	PopoverContent, | ||||||
| } from "@/components/ui/popover" | } from "@/components/ui/popover" | ||||||
| import { ComponentProps } from "react" | import { ComponentProps } from "react" | ||||||
| import { Genre } from "@prisma/client" | import { Genre, Story } from "@prisma/client" | ||||||
| import { randomStoryTitle } from "app/lib/shortStoryTitleGenerator" | import { randomStoryTitle } from "app/lib/shortStoryTitleGenerator" | ||||||
| import { usePathname } from "next/navigation" | import { usePathname } from "next/navigation" | ||||||
| import GenrePicker from "./genrePicker" | import GenrePicker from "./genrePicker" | ||||||
|  | import { StoryWithGenres } from "app/story/page" | ||||||
| 
 | 
 | ||||||
| const formSchema = z.object({ | const formSchema = z.object({ | ||||||
|  | 	id: z.number().optional(), | ||||||
| 	title: z.string().min(2).max(50), | 	title: z.string().min(2).max(50), | ||||||
| 	word_count: z.coerce.number().min(100), | 	word_count: z.coerce.number().min(100), | ||||||
| 	genres: z.array(z.number()) | 	genres: z.array(z.number()) | ||||||
| }) | }) | ||||||
| 
 | 
 | ||||||
| export default function StoryForm({ genres, createStory, className }: ComponentProps<"div"> & { genres: Array<Genre>, createStory: (data: any) => void }) { | export default function StoryForm({ genres, createStory, className, existingData }: ComponentProps<"div"> & { genres: Array<Genre>, createStory: (data: any) => void, existingData: Story & { genres: number[] } | null }) { | ||||||
| 	// 1. Define your form.
 |  | ||||||
| 	const form = useForm<z.infer<typeof formSchema>>({ | 	const form = useForm<z.infer<typeof formSchema>>({ | ||||||
| 		resolver: zodResolver(formSchema), | 		resolver: zodResolver(formSchema), | ||||||
| 		defaultValues: { | 		defaultValues: { | ||||||
| 			title: "", | 			id: existingData?.id, | ||||||
| 			word_count: 0, | 			title: existingData?.title ?? "", | ||||||
| 			genres: [] | 			word_count: existingData?.word_count ?? 500, | ||||||
|  | 			genres: existingData?.genres ?? [] | ||||||
| 		}, | 		}, | ||||||
| 	}) | 	}) | ||||||
| 	// 2. Define a submit handler.
 | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
| 	function onSubmit(values: z.infer<typeof formSchema>) { | 	function onSubmit(values: z.infer<typeof formSchema>) { | ||||||
| 		// Do something with the form values.
 |  | ||||||
| 		// ✅ This will be type-safe and validated.
 |  | ||||||
| 		toast({ | 		toast({ | ||||||
| 			title: "You submitted the following values:", | 			title: "You submitted the following values:", | ||||||
| 			description: ( | 			description: ( | ||||||
|  |  | ||||||
|  | @ -13,9 +13,12 @@ export default function FormContextMenu({ pathname, row, selectedRows, deselect | ||||||
|     <Dialog modal={true}> |     <Dialog modal={true}> | ||||||
|       <ContextMenuContent > |       <ContextMenuContent > | ||||||
|         {pathname !== "/submission" && selectedRows.length <= 1 ? |         {pathname !== "/submission" && selectedRows.length <= 1 ? | ||||||
|  |           <> | ||||||
|             <Link href={`${pathname}/${row.original.id}`}> |             <Link href={`${pathname}/${row.original.id}`}> | ||||||
|               <ContextMenuItem>Inspect</ContextMenuItem> |               <ContextMenuItem>Inspect</ContextMenuItem> | ||||||
|             </Link> |             </Link> | ||||||
|  |             <ContextMenuItem>Edit</ContextMenuItem> | ||||||
|  |           </> | ||||||
|           : "" |           : "" | ||||||
|         } |         } | ||||||
|         { |         { | ||||||
|  |  | ||||||
		Loading…
	
		Reference in New Issue