feat: Implement highlights support for links. Fixes #620

2 files changed, 77 insertions, 0 deletions

diff --git a/packages/shared-react/hooks/highlights.ts b/packages/shared-react/hooks/highlights.ts
new file mode 100644
index 00000000..299ed697
--- /dev/null
+++ b/packages/shared-react/hooks/highlights.ts
@@ -0,0 +1,46 @@
+import { api } from "../trpc";
+
+export function useCreateHighlight(
+  ...opts: Parameters<typeof api.highlights.create.useMutation>
+) {
+  const apiUtils = api.useUtils();
+  return api.highlights.create.useMutation({
+    ...opts[0],
+    onSuccess: (res, req, meta) => {
+      apiUtils.highlights.getForBookmark.invalidate({
+        bookmarkId: req.bookmarkId,
+      });
+      return opts[0]?.onSuccess?.(res, req, meta);
+    },
+  });
+}
+
+export function useUpdateHighlight(
+  ...opts: Parameters<typeof api.highlights.update.useMutation>
+) {
+  const apiUtils = api.useUtils();
+  return api.highlights.update.useMutation({
+    ...opts[0],
+    onSuccess: (res, req, meta) => {
+      apiUtils.highlights.getForBookmark.invalidate({
+        bookmarkId: res.bookmarkId,
+      });
+      return opts[0]?.onSuccess?.(res, req, meta);
+    },
+  });
+}
+
+export function useDeleteHighlight(
+  ...opts: Parameters<typeof api.highlights.delete.useMutation>
+) {
+  const apiUtils = api.useUtils();
+  return api.highlights.delete.useMutation({
+    ...opts[0],
+    onSuccess: (res, req, meta) => {
+      apiUtils.highlights.getForBookmark.invalidate({
+        bookmarkId: res.bookmarkId,
+      });
+      return opts[0]?.onSuccess?.(res, req, meta);
+    },
+  });
+}
diff --git a/packages/shared/types/highlights.ts b/packages/shared/types/highlights.ts
new file mode 100644
index 00000000..b766c360
--- /dev/null
+++ b/packages/shared/types/highlights.ts
@@ -0,0 +1,31 @@
+import { z } from "zod";
+
+const zHighlightColorSchema = z.enum(["yellow", "red", "green", "blue"]);
+export type ZHighlightColor = z.infer<typeof zHighlightColorSchema>;
+export const SUPPORTED_HIGHLIGHT_COLORS = zHighlightColorSchema.options;
+
+const zHighlightBaseSchema = z.object({
+  bookmarkId: z.string(),
+  startOffset: z.number(),
+  endOffset: z.number(),
+  color: zHighlightColorSchema.default("yellow"),
+  text: z.string().nullable(),
+  note: z.string().nullable(),
+});
+
+export const zHighlightSchema = zHighlightBaseSchema.merge(
+  z.object({
+    id: z.string(),
+    userId: z.string(),
+    createdAt: z.date(),
+  }),
+);
+
+export type ZHighlight = z.infer<typeof zHighlightSchema>;
+
+export const zNewHighlightSchema = zHighlightBaseSchema;
+
+export const zUpdateHighlightSchema = z.object({
+  highlightId: z.string(),
+  color: zHighlightColorSchema.optional(),
+});