Skip to content

Commit

Permalink
simplify note upload even further
Browse files Browse the repository at this point in the history
  • Loading branch information
kentcdodds committed Aug 29, 2023
1 parent c7147cd commit 783f4b0
Showing 1 changed file with 54 additions and 52 deletions.
106 changes: 54 additions & 52 deletions app/routes/users+/$username_+/__note-editor.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -58,6 +58,12 @@ function imageHasFile(
return Boolean(image.file?.size && image.file?.size > 0)
}

function imageHasId(
image: ImageFieldset,
): image is ImageFieldset & { id: NonNullable<ImageFieldset['id']> } {
return image.id != null
}

const NoteEditorSchema = z.object({
id: z.string().optional(),
title: z.string().min(titleMinLength).max(titleMaxLength),
Expand Down Expand Up @@ -90,20 +96,34 @@ export async function action({ request }: DataFunctionArgs) {
}).transform(async ({ images = [], ...data }) => {
return {
...data,
imageIds: images.map(i => i.id).filter(Boolean),
imageUpdates: images
.filter(i => i.id && !imageHasFile(i))
.map(i => ({
id: i.id,
altText: i.altText,
})),
imageUploads: await Promise.all(
images.filter(imageHasFile).map(async image => ({
id: image.id,
altText: image.altText,
contentType: image.file.type,
blob: Buffer.from(await image.file.arrayBuffer()),
})),
imageUpdates: await Promise.all(
images.filter(imageHasId).map(async i => {
if (imageHasFile(i)) {
return {
id: i.id,
altText: i.altText,
contentType: i.file.type,
blob: Buffer.from(await i.file.arrayBuffer()),
}
} else {
return {
id: i.id,
altText: i.altText,
}
}
}),
),
newImages: await Promise.all(
images
.filter(imageHasFile)
.filter(i => !i.id)
.map(async image => {
return {
altText: image.altText,
contentType: image.file.type,
blob: Buffer.from(await image.file.arrayBuffer()),
}
}),
),
}
}),
Expand All @@ -122,48 +142,30 @@ export async function action({ request }: DataFunctionArgs) {
id: noteId,
title,
content,
imageUploads = [],
imageUpdates = [],
imageIds,
newImages = [],
} = submission.value

const updatedNote = await prisma.$transaction(async $prisma => {
const note = await $prisma.note.upsert({
select: { id: true, owner: { select: { username: true } } },
where: { id: noteId ?? '__new_note__' },
create: {
ownerId: userId,
title,
content,
},
update: {
title,
content,
images: {
deleteMany: { id: { notIn: imageIds } },
updateMany: imageUpdates.map(updates => ({
where: { id: updates.id },
data: updates,
})),
},
const updatedNote = await prisma.note.upsert({
select: { id: true, owner: { select: { username: true } } },
where: { id: noteId ?? '__new_note__' },
create: {
ownerId: userId,
title,
content,
},
update: {
title,
content,
images: {
deleteMany: { id: { notIn: imageUpdates.map(i => i.id) } },
updateMany: imageUpdates.map(updates => ({
where: { id: updates.id },
data: { ...updates, id: updates.blob ? cuid() : updates.id },
})),
create: newImages,
},
})

for (const image of imageUploads) {
await $prisma.noteImage.upsert({
select: { id: true },
where: { id: image.id ?? '__new_image__' },
create: { ...image, noteId: note.id },
update: {
...image,
// update the id since it is used for caching
id: cuid(),
noteId: note.id,
},
})
}

return note
},
})

return redirect(
Expand Down

2 comments on commit 783f4b0

@arpitdalal
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@kentcdodds
Images aren't added when creating new notes, likely because images aren't being created in the create block of the prisma query.
Changing the create block to this should fix it:

create: {
  ownerId: userId,
  title,
  content,
  images: {
    create: newImages,
  },
},

@kentcdodds
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks! Fixed in 74ee414

Please sign in to comment.