feature: Extract hook logic into separate package and add a new action bar in bookmark preview

5 files changed, 119 insertions, 0 deletions

diff --git a/packages/shared-react/hooks/bookmarks.ts b/packages/shared-react/hooks/bookmarks.ts
new file mode 100644
index 00000000..7349e680
--- /dev/null
+++ b/packages/shared-react/hooks/bookmarks.ts
@@ -0,0 +1,43 @@
+import { api } from "../trpc";
+
+export function useDeleteBookmark(
+  ...opts: Parameters<typeof api.bookmarks.deleteBookmark.useMutation>
+) {
+  const apiUtils = api.useUtils();
+  return api.bookmarks.deleteBookmark.useMutation({
+    ...opts,
+    onSuccess: (res, req, meta) => {
+      apiUtils.bookmarks.getBookmarks.invalidate();
+      apiUtils.bookmarks.searchBookmarks.invalidate();
+      opts[0]?.onSuccess?.(res, req, meta);
+    },
+  });
+}
+
+export function useUpdateBookmark(
+  ...opts: Parameters<typeof api.bookmarks.updateBookmark.useMutation>
+) {
+  const apiUtils = api.useUtils();
+  return api.bookmarks.updateBookmark.useMutation({
+    ...opts,
+    onSuccess: (res, req, meta) => {
+      apiUtils.bookmarks.getBookmarks.invalidate();
+      apiUtils.bookmarks.searchBookmarks.invalidate();
+      apiUtils.bookmarks.getBookmark.invalidate({ bookmarkId: req.bookmarkId });
+      opts[0]?.onSuccess?.(res, req, meta);
+    },
+  });
+}
+
+export function useRecrawlBookmark(
+  ...opts: Parameters<typeof api.bookmarks.recrawlBookmark.useMutation>
+) {
+  const apiUtils = api.useUtils();
+  return api.bookmarks.recrawlBookmark.useMutation({
+    ...opts,
+    onSuccess: (res, req, meta) => {
+      apiUtils.bookmarks.getBookmark.invalidate({ bookmarkId: req.bookmarkId });
+      opts[0]?.onSuccess?.(res, req, meta);
+    },
+  });
+}
diff --git a/packages/shared-react/hooks/lists.ts b/packages/shared-react/hooks/lists.ts
new file mode 100644
index 00000000..5cfcd194
--- /dev/null
+++ b/packages/shared-react/hooks/lists.ts
@@ -0,0 +1,14 @@
+import { api } from "../trpc";
+
+export function useRemoveBookmarkFromList(
+  ...opts: Parameters<typeof api.lists.removeFromList.useMutation>
+) {
+  const apiUtils = api.useUtils();
+  return api.lists.removeFromList.useMutation({
+    ...opts,
+    onSuccess: (res, req, meta) => {
+      apiUtils.bookmarks.getBookmarks.invalidate({ listId: req.listId });
+      opts[0]?.onSuccess?.(res, req, meta);
+    },
+  });
+}
diff --git a/packages/shared-react/package.json b/packages/shared-react/package.json
new file mode 100644
index 00000000..46a2adb5
--- /dev/null
+++ b/packages/shared-react/package.json
@@ -0,0 +1,41 @@
+{
+  "$schema": "https://json.schemastore.org/package.json",
+  "name": "@hoarder/shared-react",
+  "version": "0.1.0",
+  "private": true,
+  "dependencies": {
+    "@hoarder/trpc": "workspace:^0.1.0",
+    "@tanstack/react-query": "^5.24.8"
+  },
+  "devDependencies": {
+    "@hoarder/eslint-config": "workspace:^0.2.0",
+    "@hoarder/prettier-config": "workspace:^0.1.0",
+    "@hoarder/tsconfig": "workspace:^0.1.0"
+  },
+"peerDependencies": {
+    "react": "*",
+    "react-native": "*",
+    "react-native-web": "*"
+  },
+  "peerDependenciesMeta": {
+    "react-native": {
+      "optional": true
+    },
+    "react-native-web": {
+      "optional": true
+    }
+  },
+  "scripts": {
+    "typecheck": "tsc --noEmit",
+    "format": "prettier . --ignore-path ../../.prettierignore",
+    "lint": "eslint ."
+  },
+  "eslintConfig": {
+    "root": true,
+    "extends": [
+      "@hoarder/eslint-config/base",
+      "@hoarder/eslint-config/react"
+    ]
+  },
+  "prettier": "@hoarder/prettier-config"
+}
diff --git a/packages/shared-react/trpc.ts b/packages/shared-react/trpc.ts
new file mode 100644
index 00000000..99fdd8b5
--- /dev/null
+++ b/packages/shared-react/trpc.ts
@@ -0,0 +1,7 @@
+"use client";
+
+import { createTRPCReact } from "@trpc/react-query";
+
+import type { AppRouter } from "@hoarder/trpc/routers/_app";
+
+export const api = createTRPCReact<AppRouter>();
diff --git a/packages/shared-react/tsconfig.json b/packages/shared-react/tsconfig.json
new file mode 100644
index 00000000..8c3411bf
--- /dev/null
+++ b/packages/shared-react/tsconfig.json
@@ -0,0 +1,14 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "extends": "@hoarder/tsconfig/base.json",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "plugins": [],
+    "paths": {
+      "@/*": ["./*"]
+    },
+    "tsBuildInfoFile": "node_modules/.cache/tsbuildinfo.json"
+  },
+  "include": ["**/*.ts", "**/*.tsx"],
+  "exclude": ["node_modules"]
+}