@burdenoff/microfe-store 2026.703.1 → 2026.703.2

package/dist/pages/AdminReviewModerationPage.js

@@ -1,225 +1,251 @@
 import { useStore as e } from "../providers/StoreProvider.js";
 import { useEffect as t, useRef as n, useState as r } from "react";
-import { ArrowLeft as i, MessageSquareWarning as a, Search as o, X as s } from "lucide-react";
-import { graphqlFetch as c } from "@burdenoff/fe-libs/shared/graphql";
-import { jsx as l, jsxs as u } from "react/jsx-runtime";
-import { useNavigate as d } from "react-router-dom";
-import { GlassCard as f, IllustratedEmptyState as p, PagePurpose as m } from "@burdenoff/fe-libs/ui";
+import { ArrowLeft as i, Check as a, MessageSquareWarning as o, Search as s, X as c } from "lucide-react";
+import { graphqlFetch as l } from "@burdenoff/fe-libs/shared/graphql";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import { useNavigate as f } from "react-router-dom";
+import { GlassCard as p, IllustratedEmptyState as m, PagePurpose as h } from "@burdenoff/fe-libs/ui";
 //#region src/pages/AdminReviewModerationPage.tsx
-var h = "query SearchProductsForModeration($query: String!) { searchProducts(query: $query, limit: 10) { id name slug } }", g = "query ProductReviewsForModeration($productId: String!) { productReviews(productId: $productId) { id userId rating title comment status helpful createdAt } }", _ = "mutation RejectReview($id: ID!) { rejectReview(id: $id) { id status } }", v = () => {
-	let v = d(), { authToken: y } = e(), [b, x] = r(""), [S, C] = r([]), [w, T] = r(!1), [E, D] = r(!1), [O, k] = r(null), [A, j] = r([]), [M, N] = r(!1), [P, F] = r(null), [I, L] = r(null), R = n(null), z = n(null);
+var g = "query SearchProductsForModeration($query: String!) { searchProducts(query: $query, limit: 10) { id name slug } }", _ = "query ProductReviewsForModeration($productId: String!) { productReviews(productId: $productId) { id userId rating title comment status helpful createdAt } }", v = "mutation RejectReview($id: ID!) { rejectReview(id: $id) { id status } }", y = "mutation ApproveReview($id: ID!) { approveReview(id: $id) { id status } }", b = () => {
+	let b = f(), { authToken: x } = e(), [S, C] = r(""), [w, T] = r([]), [E, D] = r(!1), [O, k] = r(!1), [A, j] = r(null), [M, N] = r([]), [P, F] = r(!1), [I, L] = r(null), [R, z] = r(null), B = n(null), V = n(null);
 	t(() => {
 		let e = (e) => {
-			z.current && !z.current.contains(e.target) && D(!1);
+			V.current && !V.current.contains(e.target) && k(!1);
 		};
 		return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
 	}, []);
-	let B = (e) => {
-		if (x(e), k(null), j([]), F(null), R.current && clearTimeout(R.current), !e.trim()) {
-			C([]), D(!1);
+	let H = (e) => {
+		if (C(e), j(null), N([]), L(null), B.current && clearTimeout(B.current), !e.trim()) {
+			T([]), k(!1);
 			return;
 		}
-		R.current = setTimeout(async () => {
-			T(!0);
+		B.current = setTimeout(async () => {
+			D(!0);
 			try {
-				C((await c({
+				T((await l({
 					gateway: "global",
-					query: h,
+					query: g,
 					variables: { query: e },
-					authToken: y || void 0
-				})).data?.searchProducts ?? []), D(!0);
+					authToken: x || void 0
+				})).data?.searchProducts ?? []), k(!0);
 			} catch {
-				C([]);
+				T([]);
 			} finally {
-				T(!1);
+				D(!1);
 			}
 		}, 300);
-	}, V = (e) => {
-		k(e), x(e.name), D(!1), H(e.id);
-	}, H = async (e) => {
-		N(!0), F(null);
+	}, U = (e) => {
+		j(e), C(e.name), k(!1), W(e.id);
+	}, W = async (e) => {
+		F(!0), L(null);
 		try {
-			let t = await c({
+			let t = await l({
 				gateway: "global",
-				query: g,
+				query: _,
 				variables: { productId: e },
-				authToken: y || void 0
+				authToken: x || void 0
 			});
 			if (t.errors?.length) throw Error(t.errors[0]?.message ?? "Failed to fetch reviews");
-			j(t.data?.productReviews ?? []);
+			N(t.data?.productReviews ?? []);
 		} catch (e) {
-			F(e instanceof Error ? e.message : "Failed to fetch reviews");
+			L(e instanceof Error ? e.message : "Failed to fetch reviews");
 		} finally {
-			N(!1);
+			F(!1);
 		}
-	}, U = async (e) => {
-		L(e), F(null);
+	}, G = async (e) => {
+		z(e), L(null);
 		try {
-			let t = await c({
+			let t = await l({
 				gateway: "global",
-				query: _,
+				query: v,
 				variables: { id: e },
-				authToken: y || void 0
+				authToken: x || void 0
 			});
 			if (t.errors?.length) throw Error(t.errors[0]?.message ?? "Failed to remove review");
-			j((t) => t.filter((t) => t.id !== e));
+			N((t) => t.map((t) => t.id === e ? {
+				...t,
+				status: "REJECTED"
+			} : t));
 		} catch (e) {
-			F(e instanceof Error ? e.message : "Failed to remove review");
+			L(e instanceof Error ? e.message : "Failed to remove review");
 		} finally {
-			L(null);
+			z(null);
+		}
+	}, K = async (e) => {
+		z(e), L(null);
+		try {
+			let t = await l({
+				gateway: "global",
+				query: y,
+				variables: { id: e },
+				authToken: x || void 0
+			});
+			if (t.errors?.length) throw Error(t.errors[0]?.message ?? "Failed to approve review");
+			N((t) => t.map((t) => t.id === e ? {
+				...t,
+				status: "APPROVED"
+			} : t));
+		} catch (e) {
+			L(e instanceof Error ? e.message : "Failed to approve review");
+		} finally {
+			z(null);
 		}
 	};
-	return /* @__PURE__ */ u("div", {
+	return /* @__PURE__ */ d("div", {
 		className: "min-h-screen bg-surface-default",
-		children: [/* @__PURE__ */ l("header", {
+		children: [/* @__PURE__ */ u("header", {
 			className: "border-b border-border-seam bg-surface-raised",
-			children: /* @__PURE__ */ u("div", {
+			children: /* @__PURE__ */ d("div", {
 				className: "mx-auto max-w-7xl px-6 py-4",
-				children: [/* @__PURE__ */ u("div", {
+				children: [/* @__PURE__ */ d("div", {
 					className: "flex items-center gap-3",
-					children: [/* @__PURE__ */ u("button", {
+					children: [/* @__PURE__ */ d("button", {
 						type: "button",
-						onClick: () => v(-1),
+						onClick: () => b(-1),
 						"aria-label": "Go back",
 						className: "inline-flex items-center gap-2 rounded-md px-3 py-1.5 text-sm text-text-secondary hover:bg-surface-hover hover:text-text-primary",
-						children: [/* @__PURE__ */ l(i, { className: "size-4" }), "Back"]
-					}), /* @__PURE__ */ u("div", {
+						children: [/* @__PURE__ */ u(i, { className: "size-4" }), "Back"]
+					}), /* @__PURE__ */ d("div", {
 						className: "flex items-center gap-2",
-						children: [/* @__PURE__ */ l(a, { className: "size-5 text-text-primary" }), /* @__PURE__ */ l("h1", {
+						children: [/* @__PURE__ */ u(o, { className: "size-5 text-text-primary" }), /* @__PURE__ */ u("h1", {
 							className: "text-xl font-semibold text-text-primary",
 							children: "Review Moderation"
 						})]
 					})]
-				}), /* @__PURE__ */ l("p", {
+				}), /* @__PURE__ */ u("p", {
 					className: "mt-1 text-sm text-text-secondary",
-					children: "Review published content by product and remove anything that violates guidelines"
+					children: "Moderate reviews by product — approve legitimate ones or remove violations"
 				})]
 			})
-		}), /* @__PURE__ */ l("main", {
+		}), /* @__PURE__ */ u("main", {
 			className: "mx-auto max-w-7xl p-6",
-			children: /* @__PURE__ */ u("div", {
+			children: /* @__PURE__ */ d("div", {
 				className: "space-y-4",
 				children: [
-					/* @__PURE__ */ l(m, { children: "Keep the marketplace trustworthy. Pick any product, read every review customers have left for it, and remove ones that break the content guidelines (spam, abuse, or off-topic posts). This is targeted clean-up — search the exact product you need to moderate rather than scrolling an endless global feed." }),
-					/* @__PURE__ */ u(f, {
-						treatment: "glass",
-						glow: !0,
-						className: "p-4",
-						children: [/* @__PURE__ */ u("div", {
-							ref: z,
-							className: "relative",
-							children: [
-								/* @__PURE__ */ l("label", {
-									htmlFor: "admin-review-product-search",
-									className: "mb-1.5 block text-sm font-medium text-text-primary",
-									children: "Search product by name"
-								}),
-								/* @__PURE__ */ u("div", {
-									className: "relative flex items-center",
-									children: [
-										/* @__PURE__ */ l(o, { className: "pointer-events-none absolute left-3 size-4 text-text-secondary" }),
-										/* @__PURE__ */ l("input", {
-											id: "admin-review-product-search",
-											"aria-label": "Search product by name",
-											value: b,
-											onChange: (e) => B(e.target.value),
-											onFocus: () => S.length > 0 && D(!0),
-											placeholder: "Type a product name to search...",
-											autoComplete: "off",
-											className: "w-full rounded-md border border-border-default bg-surface-default py-2 pl-9 pr-3 text-sm text-text-primary outline-none focus:border-border-accent"
-										}),
-										w && /* @__PURE__ */ l("span", {
-											className: "absolute right-3 text-xs text-text-secondary",
-											children: "Searching…"
-										})
-									]
-								}),
-								E && S.length > 0 && /* @__PURE__ */ l("ul", {
-									className: "absolute z-10 mt-1 w-full rounded-md border border-border-default bg-surface-raised shadow-lg",
-									children: S.map((e) => /* @__PURE__ */ l("li", { children: /* @__PURE__ */ u("button", {
-										type: "button",
-										onClick: () => V(e),
-										className: "w-full px-4 py-2.5 text-left text-sm hover:bg-surface-hover",
-										children: [/* @__PURE__ */ l("span", {
-											className: "font-medium text-text-primary",
-											children: e.name
-										}), /* @__PURE__ */ l("span", {
-											className: "ml-2 text-xs text-text-secondary",
-											children: e.slug
-										})]
-									}) }, e.id))
-								}),
-								E && !w && S.length === 0 && b.trim() && /* @__PURE__ */ u("div", {
-									className: "absolute z-10 mt-1 w-full rounded-md border border-border-default bg-surface-raised px-4 py-3 text-sm text-text-secondary shadow-lg",
-									children: [
-										"No products found for “",
-										b,
-										"”"
-									]
-								})
-							]
-						}), O && /* @__PURE__ */ u("p", {
-							className: "mt-2 text-xs text-text-secondary",
-							children: [
-								"Moderating:",
-								" ",
-								/* @__PURE__ */ l("span", {
-									className: "font-medium text-text-primary",
-									children: O.name
-								}),
-								/* @__PURE__ */ u("span", {
-									className: "ml-1 text-text-tertiary",
-									children: [
-										"(",
-										O.id,
-										")"
-									]
-								})
-							]
-						})]
+					/* @__PURE__ */ u(h, { children: "Keep the marketplace trustworthy. Pick any product, read every review customers have left for it, approve legitimate ones, and remove those that break content guidelines (spam, abuse, or off-topic posts). Search the exact product you need to moderate rather than scrolling an endless global feed." }),
+					/* @__PURE__ */ d("div", {
+						ref: V,
+						className: "relative",
+						children: [
+							/* @__PURE__ */ d(p, {
+								treatment: "glass",
+								glow: !0,
+								className: "p-4",
+								children: [
+									/* @__PURE__ */ u("label", {
+										htmlFor: "admin-review-product-search",
+										className: "mb-1.5 block text-sm font-medium text-text-primary",
+										children: "Search product by name"
+									}),
+									/* @__PURE__ */ d("div", {
+										className: "relative flex items-center",
+										children: [
+											/* @__PURE__ */ u(s, { className: "pointer-events-none absolute left-3 size-4 text-text-secondary" }),
+											/* @__PURE__ */ u("input", {
+												id: "admin-review-product-search",
+												"aria-label": "Search product by name",
+												value: S,
+												onChange: (e) => H(e.target.value),
+												onFocus: () => w.length > 0 && k(!0),
+												placeholder: "Type a product name to search...",
+												autoComplete: "off",
+												className: "w-full rounded-md border border-border-default bg-surface-default py-2 pl-9 pr-3 text-sm text-text-primary outline-none focus:border-border-accent"
+											}),
+											E && /* @__PURE__ */ u("span", {
+												className: "absolute right-3 text-xs text-text-secondary",
+												children: "Searching…"
+											})
+										]
+									}),
+									A && /* @__PURE__ */ d("p", {
+										className: "mt-2 text-xs text-text-secondary",
+										children: [
+											"Moderating:",
+											" ",
+											/* @__PURE__ */ u("span", {
+												className: "font-medium text-text-primary",
+												children: A.name
+											}),
+											/* @__PURE__ */ d("span", {
+												className: "ml-1 text-text-tertiary",
+												children: [
+													"(",
+													A.id,
+													")"
+												]
+											})
+										]
+									})
+								]
+							}),
+							O && w.length > 0 && /* @__PURE__ */ u("ul", {
+								className: "absolute left-0 right-0 z-50 mt-1 rounded-md border border-border-default bg-surface-raised shadow-lg",
+								children: w.map((e) => /* @__PURE__ */ u("li", { children: /* @__PURE__ */ d("button", {
+									type: "button",
+									onMouseDown: (e) => e.preventDefault(),
+									onClick: () => U(e),
+									className: "w-full px-4 py-2.5 text-left text-sm hover:bg-surface-hover",
+									children: [/* @__PURE__ */ u("span", {
+										className: "font-medium text-text-primary",
+										children: e.name
+									}), /* @__PURE__ */ u("span", {
+										className: "ml-2 text-xs text-text-secondary",
+										children: e.id
+									})]
+								}) }, e.id))
+							}),
+							O && !E && w.length === 0 && S.trim() && /* @__PURE__ */ d("div", {
+								className: "absolute left-0 right-0 z-50 mt-1 rounded-md border border-border-default bg-surface-raised px-4 py-3 text-sm text-text-secondary shadow-lg",
+								children: [
+									"No products found for “",
+									S,
+									"”"
+								]
+							})
+						]
 					}),
-					P && /* @__PURE__ */ l("div", {
+					I && /* @__PURE__ */ u("div", {
 						role: "alert",
 						className: "rounded-md border border-border-danger bg-surface-danger-muted px-4 py-3 text-sm text-text-danger",
-						children: P
+						children: I
 					}),
-					M && /* @__PURE__ */ l("div", {
+					P && /* @__PURE__ */ u("div", {
 						className: "rounded-lg border border-border-default bg-surface-raised p-10 text-center",
-						children: /* @__PURE__ */ l("p", {
+						children: /* @__PURE__ */ u("p", {
 							className: "text-sm text-text-secondary",
 							children: "Loading reviews…"
 						})
 					}),
-					!M && !O ? /* @__PURE__ */ l(p, {
+					!P && !A ? /* @__PURE__ */ u(m, {
 						illustration: "empty-search",
 						title: "Search a product to moderate",
 						description: "Use the search box above to find a product by name. Its reviews will load here so you can inspect and remove any that violate the guidelines."
-					}) : !M && O && A.length === 0 ? /* @__PURE__ */ l(p, {
+					}) : !P && A && M.length === 0 ? /* @__PURE__ */ u(m, {
 						illustration: "empty-notifications",
 						title: "No reviews to moderate",
 						description: "This product has no reviews right now. Nothing here needs your attention."
-					}) : /* @__PURE__ */ l("ul", {
+					}) : /* @__PURE__ */ u("ul", {
 						className: "space-y-3",
-						children: A.map((e) => /* @__PURE__ */ l("li", {
+						children: M.map((e) => /* @__PURE__ */ u("li", {
 							className: "rounded-lg border border-border-seam bg-surface-raised p-4 transition-[box-shadow,border-color] hover:border-border-strong hover:shadow-[var(--shadow-pop)]",
-							children: /* @__PURE__ */ u("div", {
+							children: /* @__PURE__ */ d("div", {
 								className: "flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between",
-								children: [/* @__PURE__ */ u("div", { children: [
-									/* @__PURE__ */ u("div", {
+								children: [/* @__PURE__ */ d("div", { children: [
+									/* @__PURE__ */ d("div", {
 										className: "flex items-center gap-2",
-										children: [/* @__PURE__ */ l("p", {
+										children: [/* @__PURE__ */ u("p", {
 											className: "font-medium text-text-primary",
 											children: e.title || "Untitled review"
-										}), /* @__PURE__ */ l("span", {
-											className: "rounded-full bg-surface-muted px-2 py-0.5 text-xs text-text-secondary",
+										}), /* @__PURE__ */ u("span", {
+											className: `rounded-full px-2 py-0.5 text-xs font-medium ${e.status === "APPROVED" ? "bg-surface-success-muted text-text-success" : e.status === "REJECTED" ? "bg-surface-danger-muted text-text-danger" : "bg-surface-warning-muted text-text-warning"}`,
 											children: e.status
 										})]
 									}),
-									/* @__PURE__ */ l("p", {
+									/* @__PURE__ */ u("p", {
 										className: "mt-1 text-sm text-text-secondary",
 										children: e.comment || "No comment provided."
 									}),
-									/* @__PURE__ */ u("p", {
+									/* @__PURE__ */ d("p", {
 										className: "mt-2 text-xs text-text-secondary",
 										children: [
 											"User ",
@@ -230,15 +256,21 @@ var h = "query SearchProductsForModeration($query: String!) { searchProducts(que
 											e.helpful
 										]
 									})
-								] }), /* @__PURE__ */ l("div", {
+								] }), /* @__PURE__ */ d("div", {
 									className: "flex items-center gap-2",
-									children: /* @__PURE__ */ u("button", {
+									children: [e.status !== "APPROVED" && /* @__PURE__ */ d("button", {
+										type: "button",
+										onClick: () => K(e.id),
+										disabled: R === e.id,
+										className: "inline-flex items-center gap-1.5 rounded-md border border-border-success px-3 py-1.5 text-sm font-medium text-text-success hover:bg-surface-success-muted disabled:cursor-not-allowed disabled:opacity-60",
+										children: [/* @__PURE__ */ u(a, { className: "size-4" }), " Approve"]
+									}), e.status !== "REJECTED" && /* @__PURE__ */ d("button", {
 										type: "button",
-										onClick: () => U(e.id),
-										disabled: I === e.id,
+										onClick: () => G(e.id),
+										disabled: R === e.id,
 										className: "inline-flex items-center gap-1.5 rounded-md border border-border-danger px-3 py-1.5 text-sm font-medium text-text-danger hover:bg-surface-danger-muted disabled:cursor-not-allowed disabled:opacity-60",
-										children: [/* @__PURE__ */ l(s, { className: "size-4" }), " Remove"]
-									})
+										children: [/* @__PURE__ */ u(c, { className: "size-4" }), " Remove"]
+									})]
 								})]
 							})
 						}, e.id))
@@ -249,6 +281,6 @@ var h = "query SearchProductsForModeration($query: String!) { searchProducts(que
 	});
 };
 //#endregion
-export { v as AdminReviewModerationPage };
+export { b as AdminReviewModerationPage };
 
 //# sourceMappingURL=AdminReviewModerationPage.js.map

package/dist/pages/AdminReviewModerationPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"AdminReviewModerationPage.js","names":[],"sources":["../../src/pages/AdminReviewModerationPage.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport { useState, useRef, useEffect } from 'react';\nimport { ArrowLeft, Search, X, MessageSquareWarning } from 'lucide-react';\nimport { graphqlFetch } from '@burdenoff/fe-libs/shared/graphql';\nimport { GlassCard, PagePurpose, IllustratedEmptyState } from '@burdenoff/fe-libs/ui';\nimport { useNavigate } from 'react-router-dom';\nimport { useStore } from '../providers/StoreProvider';\n\ntype ModerationReview = {\n  id: string;\n  userId: string;\n  rating: number;\n  title?: string | null;\n  comment?: string | null;\n  status: string;\n  helpful: number;\n  createdAt: string;\n};\n\ntype ProductSearchResult = {\n  id: string;\n  name: string;\n  slug: string;\n};\n\nconst SEARCH_PRODUCTS_QUERY = `query SearchProductsForModeration($query: String!) { searchProducts(query: $query, limit: 10) { id name slug } }`;\nconst PRODUCT_REVIEWS_QUERY = `query ProductReviewsForModeration($productId: String!) { productReviews(productId: $productId) { id userId rating title comment status helpful createdAt } }`;\nconst REJECT_REVIEW_MUTATION = `mutation RejectReview($id: ID!) { rejectReview(id: $id) { id status } }`;\n\nexport const AdminReviewModerationPage: FC = () => {\n  const navigate = useNavigate();\n  const { authToken } = useStore();\n  const [searchQuery, setSearchQuery] = useState('');\n  const [searchResults, setSearchResults] = useState<ProductSearchResult[]>([]);\n  const [searchLoading, setSearchLoading] = useState(false);\n  const [showDropdown, setShowDropdown] = useState(false);\n  const [selectedProduct, setSelectedProduct] = useState<ProductSearchResult | null>(null);\n  const [reviews, setReviews] = useState<ModerationReview[]>([]);\n  const [loading, setLoading] = useState(false);\n  const [error, setError] = useState<string | null>(null);\n  const [actingId, setActingId] = useState<string | null>(null);\n  const searchDebounceRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const dropdownRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    const handleClickOutside = (e: MouseEvent) => {\n      if (dropdownRef.current && !dropdownRef.current.contains(e.target as Node)) {\n        setShowDropdown(false);\n      }\n    };\n    document.addEventListener('mousedown', handleClickOutside);\n    return () => document.removeEventListener('mousedown', handleClickOutside);\n  }, []);\n\n  const handleSearchChange = (value: string) => {\n    setSearchQuery(value);\n    setSelectedProduct(null);\n    setReviews([]);\n    setError(null);\n\n    if (searchDebounceRef.current) clearTimeout(searchDebounceRef.current);\n    if (!value.trim()) {\n      setSearchResults([]);\n      setShowDropdown(false);\n      return;\n    }\n\n    searchDebounceRef.current = setTimeout(async () => {\n      setSearchLoading(true);\n      try {\n        const result = await graphqlFetch<{ searchProducts: ProductSearchResult[] }>({\n          gateway: 'global',\n          query: SEARCH_PRODUCTS_QUERY,\n          variables: { query: value },\n          authToken: authToken || undefined,\n        });\n        setSearchResults(result.data?.searchProducts ?? []);\n        setShowDropdown(true);\n      } catch {\n        setSearchResults([]);\n      } finally {\n        setSearchLoading(false);\n      }\n    }, 300);\n  };\n\n  const selectProduct = (product: ProductSearchResult) => {\n    setSelectedProduct(product);\n    setSearchQuery(product.name);\n    setShowDropdown(false);\n    void loadReviews(product.id);\n  };\n\n  const loadReviews = async (productId: string) => {\n    setLoading(true);\n    setError(null);\n    try {\n      const result = await graphqlFetch<{ productReviews: ModerationReview[] }>({\n        gateway: 'global',\n        query: PRODUCT_REVIEWS_QUERY,\n        variables: { productId },\n        authToken: authToken || undefined,\n      });\n\n      if (result.errors?.length) {\n        throw new Error(result.errors[0]?.message ?? 'Failed to fetch reviews');\n      }\n\n      setReviews(result.data?.productReviews ?? []);\n    } catch (err) {\n      setError(err instanceof Error ? err.message : 'Failed to fetch reviews');\n    } finally {\n      setLoading(false);\n    }\n  };\n\n  const removeReview = async (reviewId: string) => {\n    setActingId(reviewId);\n    setError(null);\n    try {\n      const result = await graphqlFetch({\n        gateway: 'global',\n        query: REJECT_REVIEW_MUTATION,\n        variables: { id: reviewId },\n        authToken: authToken || undefined,\n      });\n\n      if (result.errors?.length) {\n        throw new Error(result.errors[0]?.message ?? 'Failed to remove review');\n      }\n\n      setReviews((prev) => prev.filter((review) => review.id !== reviewId));\n    } catch (err) {\n      setError(err instanceof Error ? err.message : 'Failed to remove review');\n    } finally {\n      setActingId(null);\n    }\n  };\n\n  return (\n    <div className=\"min-h-screen bg-surface-default\">\n      <header className=\"border-b border-border-seam bg-surface-raised\">\n        <div className=\"mx-auto max-w-7xl px-6 py-4\">\n          <div className=\"flex items-center gap-3\">\n            <button\n              type=\"button\"\n              onClick={() => navigate(-1)}\n              aria-label=\"Go back\"\n              className=\"inline-flex items-center gap-2 rounded-md px-3 py-1.5 text-sm text-text-secondary hover:bg-surface-hover hover:text-text-primary\"\n            >\n              <ArrowLeft className=\"size-4\" />\n              Back\n            </button>\n            <div className=\"flex items-center gap-2\">\n              <MessageSquareWarning className=\"size-5 text-text-primary\" />\n              <h1 className=\"text-xl font-semibold text-text-primary\">Review Moderation</h1>\n            </div>\n          </div>\n          <p className=\"mt-1 text-sm text-text-secondary\">\n            Review published content by product and remove anything that violates guidelines\n          </p>\n        </div>\n      </header>\n\n      <main className=\"mx-auto max-w-7xl p-6\">\n        <div className=\"space-y-4\">\n          <PagePurpose>\n            Keep the marketplace trustworthy. Pick any product, read every review customers have left\n            for it, and remove ones that break the content guidelines (spam, abuse, or off-topic\n            posts). This is targeted clean-up — search the exact product you need to moderate rather\n            than scrolling an endless global feed.\n          </PagePurpose>\n\n          <GlassCard treatment=\"glass\" glow className=\"p-4\">\n            <div ref={dropdownRef} className=\"relative\">\n              <label\n                htmlFor=\"admin-review-product-search\"\n                className=\"mb-1.5 block text-sm font-medium text-text-primary\"\n              >\n                Search product by name\n              </label>\n              <div className=\"relative flex items-center\">\n                <Search className=\"pointer-events-none absolute left-3 size-4 text-text-secondary\" />\n                <input\n                  id=\"admin-review-product-search\"\n                  aria-label=\"Search product by name\"\n                  value={searchQuery}\n                  onChange={(e) => handleSearchChange(e.target.value)}\n                  onFocus={() => searchResults.length > 0 && setShowDropdown(true)}\n                  placeholder=\"Type a product name to search...\"\n                  autoComplete=\"off\"\n                  className=\"w-full rounded-md border border-border-default bg-surface-default py-2 pl-9 pr-3 text-sm text-text-primary outline-none focus:border-border-accent\"\n                />\n                {searchLoading && (\n                  <span className=\"absolute right-3 text-xs text-text-secondary\">Searching…</span>\n                )}\n              </div>\n\n              {showDropdown && searchResults.length > 0 && (\n                <ul className=\"absolute z-10 mt-1 w-full rounded-md border border-border-default bg-surface-raised shadow-lg\">\n                  {searchResults.map((product) => (\n                    <li key={product.id}>\n                      <button\n                        type=\"button\"\n                        onClick={() => selectProduct(product)}\n                        className=\"w-full px-4 py-2.5 text-left text-sm hover:bg-surface-hover\"\n                      >\n                        <span className=\"font-medium text-text-primary\">{product.name}</span>\n                        <span className=\"ml-2 text-xs text-text-secondary\">{product.slug}</span>\n                      </button>\n                    </li>\n                  ))}\n                </ul>\n              )}\n\n              {showDropdown &&\n                !searchLoading &&\n                searchResults.length === 0 &&\n                searchQuery.trim() && (\n                  <div className=\"absolute z-10 mt-1 w-full rounded-md border border-border-default bg-surface-raised px-4 py-3 text-sm text-text-secondary shadow-lg\">\n                    No products found for &ldquo;{searchQuery}&rdquo;\n                  </div>\n                )}\n            </div>\n\n            {selectedProduct && (\n              <p className=\"mt-2 text-xs text-text-secondary\">\n                Moderating:{' '}\n                <span className=\"font-medium text-text-primary\">{selectedProduct.name}</span>\n                <span className=\"ml-1 text-text-tertiary\">({selectedProduct.id})</span>\n              </p>\n            )}\n          </GlassCard>\n\n          {error && (\n            <div\n              role=\"alert\"\n              className=\"rounded-md border border-border-danger bg-surface-danger-muted px-4 py-3 text-sm text-text-danger\"\n            >\n              {error}\n            </div>\n          )}\n\n          {loading && (\n            <div className=\"rounded-lg border border-border-default bg-surface-raised p-10 text-center\">\n              <p className=\"text-sm text-text-secondary\">Loading reviews…</p>\n            </div>\n          )}\n\n          {!loading && !selectedProduct ? (\n            <IllustratedEmptyState\n              illustration=\"empty-search\"\n              title=\"Search a product to moderate\"\n              description=\"Use the search box above to find a product by name. Its reviews will load here so you can inspect and remove any that violate the guidelines.\"\n            />\n          ) : !loading && selectedProduct && reviews.length === 0 ? (\n            <IllustratedEmptyState\n              illustration=\"empty-notifications\"\n              title=\"No reviews to moderate\"\n              description=\"This product has no reviews right now. Nothing here needs your attention.\"\n            />\n          ) : (\n            <ul className=\"space-y-3\">\n              {reviews.map((review) => (\n                <li\n                  key={review.id}\n                  className=\"rounded-lg border border-border-seam bg-surface-raised p-4 transition-[box-shadow,border-color] hover:border-border-strong hover:shadow-[var(--shadow-pop)]\"\n                >\n                  <div className=\"flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between\">\n                    <div>\n                      <div className=\"flex items-center gap-2\">\n                        <p className=\"font-medium text-text-primary\">\n                          {review.title || 'Untitled review'}\n                        </p>\n                        <span className=\"rounded-full bg-surface-muted px-2 py-0.5 text-xs text-text-secondary\">\n                          {review.status}\n                        </span>\n                      </div>\n                      <p className=\"mt-1 text-sm text-text-secondary\">\n                        {review.comment || 'No comment provided.'}\n                      </p>\n                      <p className=\"mt-2 text-xs text-text-secondary\">\n                        User {review.userId} • Rating {review.rating}/5 • Helpful {review.helpful}\n                      </p>\n                    </div>\n                    <div className=\"flex items-center gap-2\">\n                      <button\n                        type=\"button\"\n                        onClick={() => removeReview(review.id)}\n                        disabled={actingId === review.id}\n                        className=\"inline-flex items-center gap-1.5 rounded-md border border-border-danger px-3 py-1.5 text-sm font-medium text-text-danger hover:bg-surface-danger-muted disabled:cursor-not-allowed disabled:opacity-60\"\n                      >\n                        <X className=\"size-4\" /> Remove\n                      </button>\n                    </div>\n                  </div>\n                </li>\n              ))}\n            </ul>\n          )}\n        </div>\n      </main>\n    </div>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"AdminReviewModerationPage.js","names":[],"sources":["../../src/pages/AdminReviewModerationPage.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport { useState, useRef, useEffect } from 'react';\nimport { ArrowLeft, Search, X, Check, MessageSquareWarning } from 'lucide-react';\nimport { graphqlFetch } from '@burdenoff/fe-libs/shared/graphql';\nimport { GlassCard, PagePurpose, IllustratedEmptyState } from '@burdenoff/fe-libs/ui';\nimport { useNavigate } from 'react-router-dom';\nimport { useStore } from '../providers/StoreProvider';\n\ntype ModerationReview = {\n  id: string;\n  userId: string;\n  rating: number;\n  title?: string | null;\n  comment?: string | null;\n  status: string;\n  helpful: number;\n  createdAt: string;\n};\n\ntype ProductSearchResult = {\n  id: string;\n  name: string;\n  slug: string;\n};\n\nconst SEARCH_PRODUCTS_QUERY = `query SearchProductsForModeration($query: String!) { searchProducts(query: $query, limit: 10) { id name slug } }`;\nconst PRODUCT_REVIEWS_QUERY = `query ProductReviewsForModeration($productId: String!) { productReviews(productId: $productId) { id userId rating title comment status helpful createdAt } }`;\nconst REJECT_REVIEW_MUTATION = `mutation RejectReview($id: ID!) { rejectReview(id: $id) { id status } }`;\nconst APPROVE_REVIEW_MUTATION = `mutation ApproveReview($id: ID!) { approveReview(id: $id) { id status } }`;\n\nexport const AdminReviewModerationPage: FC = () => {\n  const navigate = useNavigate();\n  const { authToken } = useStore();\n  const [searchQuery, setSearchQuery] = useState('');\n  const [searchResults, setSearchResults] = useState<ProductSearchResult[]>([]);\n  const [searchLoading, setSearchLoading] = useState(false);\n  const [showDropdown, setShowDropdown] = useState(false);\n  const [selectedProduct, setSelectedProduct] = useState<ProductSearchResult | null>(null);\n  const [reviews, setReviews] = useState<ModerationReview[]>([]);\n  const [loading, setLoading] = useState(false);\n  const [error, setError] = useState<string | null>(null);\n  const [actingId, setActingId] = useState<string | null>(null);\n  const searchDebounceRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const dropdownRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    const handleClickOutside = (e: MouseEvent) => {\n      if (dropdownRef.current && !dropdownRef.current.contains(e.target as Node)) {\n        setShowDropdown(false);\n      }\n    };\n    document.addEventListener('mousedown', handleClickOutside);\n    return () => document.removeEventListener('mousedown', handleClickOutside);\n  }, []);\n\n  const handleSearchChange = (value: string) => {\n    setSearchQuery(value);\n    setSelectedProduct(null);\n    setReviews([]);\n    setError(null);\n\n    if (searchDebounceRef.current) clearTimeout(searchDebounceRef.current);\n    if (!value.trim()) {\n      setSearchResults([]);\n      setShowDropdown(false);\n      return;\n    }\n\n    searchDebounceRef.current = setTimeout(async () => {\n      setSearchLoading(true);\n      try {\n        const result = await graphqlFetch<{ searchProducts: ProductSearchResult[] }>({\n          gateway: 'global',\n          query: SEARCH_PRODUCTS_QUERY,\n          variables: { query: value },\n          authToken: authToken || undefined,\n        });\n        setSearchResults(result.data?.searchProducts ?? []);\n        setShowDropdown(true);\n      } catch {\n        setSearchResults([]);\n      } finally {\n        setSearchLoading(false);\n      }\n    }, 300);\n  };\n\n  const selectProduct = (product: ProductSearchResult) => {\n    setSelectedProduct(product);\n    setSearchQuery(product.name);\n    setShowDropdown(false);\n    void loadReviews(product.id);\n  };\n\n  const loadReviews = async (productId: string) => {\n    setLoading(true);\n    setError(null);\n    try {\n      const result = await graphqlFetch<{ productReviews: ModerationReview[] }>({\n        gateway: 'global',\n        query: PRODUCT_REVIEWS_QUERY,\n        variables: { productId },\n        authToken: authToken || undefined,\n      });\n\n      if (result.errors?.length) {\n        throw new Error(result.errors[0]?.message ?? 'Failed to fetch reviews');\n      }\n\n      setReviews(result.data?.productReviews ?? []);\n    } catch (err) {\n      setError(err instanceof Error ? err.message : 'Failed to fetch reviews');\n    } finally {\n      setLoading(false);\n    }\n  };\n\n  const removeReview = async (reviewId: string) => {\n    setActingId(reviewId);\n    setError(null);\n    try {\n      const result = await graphqlFetch({\n        gateway: 'global',\n        query: REJECT_REVIEW_MUTATION,\n        variables: { id: reviewId },\n        authToken: authToken || undefined,\n      });\n\n      if (result.errors?.length) {\n        throw new Error(result.errors[0]?.message ?? 'Failed to remove review');\n      }\n\n      setReviews((prev) => prev.map((r) => (r.id === reviewId ? { ...r, status: 'REJECTED' } : r)));\n    } catch (err) {\n      setError(err instanceof Error ? err.message : 'Failed to remove review');\n    } finally {\n      setActingId(null);\n    }\n  };\n\n  const approveReview = async (reviewId: string) => {\n    setActingId(reviewId);\n    setError(null);\n    try {\n      const result = await graphqlFetch({\n        gateway: 'global',\n        query: APPROVE_REVIEW_MUTATION,\n        variables: { id: reviewId },\n        authToken: authToken || undefined,\n      });\n\n      if (result.errors?.length) {\n        throw new Error(result.errors[0]?.message ?? 'Failed to approve review');\n      }\n\n      setReviews((prev) => prev.map((r) => (r.id === reviewId ? { ...r, status: 'APPROVED' } : r)));\n    } catch (err) {\n      setError(err instanceof Error ? err.message : 'Failed to approve review');\n    } finally {\n      setActingId(null);\n    }\n  };\n\n  return (\n    <div className=\"min-h-screen bg-surface-default\">\n      <header className=\"border-b border-border-seam bg-surface-raised\">\n        <div className=\"mx-auto max-w-7xl px-6 py-4\">\n          <div className=\"flex items-center gap-3\">\n            <button\n              type=\"button\"\n              onClick={() => navigate(-1)}\n              aria-label=\"Go back\"\n              className=\"inline-flex items-center gap-2 rounded-md px-3 py-1.5 text-sm text-text-secondary hover:bg-surface-hover hover:text-text-primary\"\n            >\n              <ArrowLeft className=\"size-4\" />\n              Back\n            </button>\n            <div className=\"flex items-center gap-2\">\n              <MessageSquareWarning className=\"size-5 text-text-primary\" />\n              <h1 className=\"text-xl font-semibold text-text-primary\">Review Moderation</h1>\n            </div>\n          </div>\n          <p className=\"mt-1 text-sm text-text-secondary\">\n            Moderate reviews by product — approve legitimate ones or remove violations\n          </p>\n        </div>\n      </header>\n\n      <main className=\"mx-auto max-w-7xl p-6\">\n        <div className=\"space-y-4\">\n          <PagePurpose>\n            Keep the marketplace trustworthy. Pick any product, read every review customers have\n            left for it, approve legitimate ones, and remove those that break content guidelines\n            (spam, abuse, or off-topic posts). Search the exact product you need to moderate rather\n            than scrolling an endless global feed.\n          </PagePurpose>\n\n          <div ref={dropdownRef} className=\"relative\">\n            <GlassCard treatment=\"glass\" glow className=\"p-4\">\n              <label\n                htmlFor=\"admin-review-product-search\"\n                className=\"mb-1.5 block text-sm font-medium text-text-primary\"\n              >\n                Search product by name\n              </label>\n              <div className=\"relative flex items-center\">\n                <Search className=\"pointer-events-none absolute left-3 size-4 text-text-secondary\" />\n                <input\n                  id=\"admin-review-product-search\"\n                  aria-label=\"Search product by name\"\n                  value={searchQuery}\n                  onChange={(e) => handleSearchChange(e.target.value)}\n                  onFocus={() => searchResults.length > 0 && setShowDropdown(true)}\n                  placeholder=\"Type a product name to search...\"\n                  autoComplete=\"off\"\n                  className=\"w-full rounded-md border border-border-default bg-surface-default py-2 pl-9 pr-3 text-sm text-text-primary outline-none focus:border-border-accent\"\n                />\n                {searchLoading && (\n                  <span className=\"absolute right-3 text-xs text-text-secondary\">Searching…</span>\n                )}\n              </div>\n\n              {selectedProduct && (\n                <p className=\"mt-2 text-xs text-text-secondary\">\n                  Moderating:{' '}\n                  <span className=\"font-medium text-text-primary\">{selectedProduct.name}</span>\n                  <span className=\"ml-1 text-text-tertiary\">({selectedProduct.id})</span>\n                </p>\n              )}\n            </GlassCard>\n\n            {showDropdown && searchResults.length > 0 && (\n              <ul className=\"absolute left-0 right-0 z-50 mt-1 rounded-md border border-border-default bg-surface-raised shadow-lg\">\n                {searchResults.map((product) => (\n                  <li key={product.id}>\n                    <button\n                      type=\"button\"\n                      onMouseDown={(e) => e.preventDefault()}\n                      onClick={() => selectProduct(product)}\n                      className=\"w-full px-4 py-2.5 text-left text-sm hover:bg-surface-hover\"\n                    >\n                      <span className=\"font-medium text-text-primary\">{product.name}</span>\n                      <span className=\"ml-2 text-xs text-text-secondary\">{product.id}</span>\n                    </button>\n                  </li>\n                ))}\n              </ul>\n            )}\n\n            {showDropdown && !searchLoading && searchResults.length === 0 && searchQuery.trim() && (\n              <div className=\"absolute left-0 right-0 z-50 mt-1 rounded-md border border-border-default bg-surface-raised px-4 py-3 text-sm text-text-secondary shadow-lg\">\n                No products found for &ldquo;{searchQuery}&rdquo;\n              </div>\n            )}\n          </div>\n\n          {error && (\n            <div\n              role=\"alert\"\n              className=\"rounded-md border border-border-danger bg-surface-danger-muted px-4 py-3 text-sm text-text-danger\"\n            >\n              {error}\n            </div>\n          )}\n\n          {loading && (\n            <div className=\"rounded-lg border border-border-default bg-surface-raised p-10 text-center\">\n              <p className=\"text-sm text-text-secondary\">Loading reviews…</p>\n            </div>\n          )}\n\n          {!loading && !selectedProduct ? (\n            <IllustratedEmptyState\n              illustration=\"empty-search\"\n              title=\"Search a product to moderate\"\n              description=\"Use the search box above to find a product by name. Its reviews will load here so you can inspect and remove any that violate the guidelines.\"\n            />\n          ) : !loading && selectedProduct && reviews.length === 0 ? (\n            <IllustratedEmptyState\n              illustration=\"empty-notifications\"\n              title=\"No reviews to moderate\"\n              description=\"This product has no reviews right now. Nothing here needs your attention.\"\n            />\n          ) : (\n            <ul className=\"space-y-3\">\n              {reviews.map((review) => (\n                <li\n                  key={review.id}\n                  className=\"rounded-lg border border-border-seam bg-surface-raised p-4 transition-[box-shadow,border-color] hover:border-border-strong hover:shadow-[var(--shadow-pop)]\"\n                >\n                  <div className=\"flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between\">\n                    <div>\n                      <div className=\"flex items-center gap-2\">\n                        <p className=\"font-medium text-text-primary\">\n                          {review.title || 'Untitled review'}\n                        </p>\n                        <span\n                          className={`rounded-full px-2 py-0.5 text-xs font-medium ${\n                            review.status === 'APPROVED'\n                              ? 'bg-surface-success-muted text-text-success'\n                              : review.status === 'REJECTED'\n                                ? 'bg-surface-danger-muted text-text-danger'\n                                : 'bg-surface-warning-muted text-text-warning'\n                          }`}\n                        >\n                          {review.status}\n                        </span>\n                      </div>\n                      <p className=\"mt-1 text-sm text-text-secondary\">\n                        {review.comment || 'No comment provided.'}\n                      </p>\n                      <p className=\"mt-2 text-xs text-text-secondary\">\n                        User {review.userId} • Rating {review.rating}/5 • Helpful {review.helpful}\n                      </p>\n                    </div>\n                    <div className=\"flex items-center gap-2\">\n                      {review.status !== 'APPROVED' && (\n                        <button\n                          type=\"button\"\n                          onClick={() => approveReview(review.id)}\n                          disabled={actingId === review.id}\n                          className=\"inline-flex items-center gap-1.5 rounded-md border border-border-success px-3 py-1.5 text-sm font-medium text-text-success hover:bg-surface-success-muted disabled:cursor-not-allowed disabled:opacity-60\"\n                        >\n                          <Check className=\"size-4\" /> Approve\n                        </button>\n                      )}\n                      {review.status !== 'REJECTED' && (\n                        <button\n                          type=\"button\"\n                          onClick={() => removeReview(review.id)}\n                          disabled={actingId === review.id}\n                          className=\"inline-flex items-center gap-1.5 rounded-md border border-border-danger px-3 py-1.5 text-sm font-medium text-text-danger hover:bg-surface-danger-muted disabled:cursor-not-allowed disabled:opacity-60\"\n                        >\n                          <X className=\"size-4\" /> Remove\n                        </button>\n                      )}\n                    </div>\n                  </div>\n                </li>\n              ))}\n            </ul>\n          )}\n        </div>\n      </main>\n    </div>\n  );\n};\n"],"mappings":"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"}