Updated review queue

Author: nirajkark

heritage_graph_ui/src/app/(dashboard)/curation/contributions/page.tsx

@@ -227,20 +227,42 @@ export default function ContributionQueuePage() {
         }
         description={
           moderateConfirm ? (
-            <>
-              <span className="font-medium text-foreground">{moderateConfirm.contribution.name}</span>
-              {moderateConfirm.action === 'reject' ? (
-                <span>
-                  {' '}
-                  will be marked rejected and removed from the pending queue.
+            <span className="space-y-2 block">
+              <span className="block">
+                <span className="font-medium text-foreground">{moderateConfirm.contribution.name}</span>
+                {moderateConfirm.action === 'reject' ? (
+                  <span>
+                    {' '}
+                    will be marked rejected and removed from the pending queue.
+                  </span>
+                ) : (
+                  <span>
+                    {' '}
+                    will be published immediately without the full triage workspace.
+                  </span>
+                )}
+              </span>
+              {moderateConfirm.action === 'accept' && (
+                <span className="block text-sm text-muted-foreground">
+                  Prefer{' '}
+                  <button
+                    type="button"
+                    className="underline text-foreground"
+                    onClick={() => {
+                      const id = moderateConfirm.contribution.entity_id;
+                      setModerateConfirm(null);
+                      router.push(`/curation/review/${id}`);
+                    }}
+                  >
+                    Open full review
+                  </button>{' '}
+                  when sources, conflicts, or confidence need a recorded decision.
                 </span>
-              ) : (
-                <span> will be marked accepted.</span>
               )}
-            </>
+            </span>
           ) : undefined
         }
-        confirmLabel={moderateConfirm?.action === 'accept' ? 'Accept' : 'Reject'}
+        confirmLabel={moderateConfirm?.action === 'accept' ? 'Quick accept' : 'Reject'}
         confirmVariant={moderateConfirm?.action === 'reject' ? 'destructive' : 'default'}
         onConfirm={async () => {
           if (!moderateConfirm) return;
@@ -264,7 +286,16 @@ export default function ContributionQueuePage() {
               Curation <span className="text-white/90">Queues</span>
             </h1>
             <p className="text-blue-100 max-w-2xl">
-              New submitted entities and contributions must be accepted by an editor. These queues list items in need of moderation.
+              Fast accept/reject for straightforward submissions. For source-tier triage,
+              conflicts, and provenance notes, open the{" "}
+              <button
+                type="button"
+                className="underline underline-offset-2 font-medium text-white hover:text-blue-50"
+                onClick={() => router.push('/curation/review')}
+              >
+                Epistemic Review Queue
+              </button>{" "}
+              (or the eye icon on a row) before publishing.
             </p>
             {showPendingCta && (
               <p className="text-sm text-amber-200 border border-amber-400/40 bg-amber-500/20 rounded-lg px-4 py-2 max-w-2xl">
@@ -471,11 +502,11 @@ export default function ContributionQueuePage() {
                             <TableCell className="text-right">
                               <div className="flex justify-end gap-1" onClick={e => e.stopPropagation()}>
                                 <Button variant="ghost" size="icon" className="h-8 w-8 text-blue-600 hover:text-blue-800 hover:bg-blue-50 dark:hover:bg-blue-900/30"
-                                  onClick={() => router.push(`/curation/review/${c.entity_id}`)} title="Review"><Eye className="h-4 w-4" /></Button>
+                                  onClick={() => router.push(`/curation/review/${c.entity_id}`)} title="Full epistemic review"><Eye className="h-4 w-4" /></Button>
                                 {c.status === 'pending_review' && (
                                   <>
                                     <Button variant="ghost" size="icon" className="h-8 w-8 text-green-600 hover:text-green-700 hover:bg-green-50"
-                                      onClick={() => setModerateConfirm({ contribution: c, action: 'accept' })} title="Accept"><CheckCircle className="h-4 w-4" /></Button>
+                                      onClick={() => setModerateConfirm({ contribution: c, action: 'accept' })} title="Quick accept (no triage workspace)"><CheckCircle className="h-4 w-4" /></Button>
                                     <Button variant="ghost" size="icon" className="h-8 w-8 text-red-600 hover:text-red-700 hover:bg-red-50"
                                       onClick={() => setModerateConfirm({ contribution: c, action: 'reject' })} title="Reject"><XCircle className="h-4 w-4" /></Button>
                                   </>

heritage_graph_ui/src/app/(dashboard)/curation/review/[id]/page.tsx

@@ -91,7 +91,7 @@ const API_BASE = process.env.NEXT_PUBLIC_API_URL || 'http://localhost:8000';
 
 export default function ReviewWorkspacePage() {
   const { data: session } = useSession();
-  const { isReviewer } = useUserRoles();
+  const { isReviewer, isLoading: rolesLoading } = useUserRoles();
   const router = useRouter();
   const params = useParams();
   const entityId = params.id as string;
@@ -100,11 +100,6 @@ export default function ReviewWorkspacePage() {
   const [isLoading, setIsLoading] = useState(true);
   const [isSubmitting, setIsSubmitting] = useState(false);
   const [error, setError] = useState<string | null>(null);
-
-  if (!isReviewer) {
-    return <AccessDenied requiredRole="reviewer" userEmail={session?.user?.email} />;
-  }
-
   const [verdict, setVerdict] = useState<Verdict | ''>('');
   const [conflictHandling, setConflictHandling] = useState<ConflictHandling>('not_applicable');
   const [confidenceOverride, setConfidenceOverride] = useState<Confidence>('');
@@ -135,7 +130,10 @@ export default function ReviewWorkspacePage() {
     finally { setIsLoading(false); }
   }, [entityId, getHeaders]);
 
-  useEffect(() => { if (session && entityId) fetchWorkspace(); }, [session, entityId, fetchWorkspace]);
+  useEffect(() => {
+    if (!session || !entityId || !isReviewer) return;
+    fetchWorkspace();
+  }, [session, entityId, isReviewer, fetchWorkspace]);
 
   const openSubmitDecisionConfirm = () => {
     if (!verdict) {
@@ -185,6 +183,21 @@ export default function ReviewWorkspacePage() {
     }
   };
 
+  if (rolesLoading) {
+    return (
+      <div className="flex items-center justify-center min-h-[60vh]">
+        <div className="text-center">
+          <Loader2 className="h-8 w-8 animate-spin mx-auto mb-2 text-blue-500" />
+          <p className="text-blue-700 dark:text-blue-300">Checking reviewer access…</p>
+        </div>
+      </div>
+    );
+  }
+
+  if (!isReviewer) {
+    return <AccessDenied requiredRole="reviewer" userEmail={session?.user?.email} />;
+  }
+
   if (isLoading) {
     return (
       <div className="flex items-center justify-center min-h-[60vh]">

heritage_graph_ui/src/app/(dashboard)/curation/review/page.tsx

@@ -70,18 +70,14 @@ export default function ReviewQueuePage() {
 
 function ReviewQueuePageInner() {
   const { data: session } = useSession();
-  const { isReviewer, isModerator } = useUserRoles();
+  const { isReviewer, isModerator, isLoading: rolesLoading } = useUserRoles();
   const router = useRouter();
   const pathname = usePathname();
   const searchParams = useSearchParams();
   const API_BASE = useMemo(() => getPublicApiUrl(), []);
   const [contributions, setContributions] = useState<Contribution[]>([]);
   const [isLoading, setIsLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
-
-  if (!isReviewer) {
-    return <AccessDenied requiredRole="reviewer" userEmail={session?.user?.email} />;
-  }
   const [currentPage, setCurrentPage] = useState(1);
   const [totalPages, setTotalPages] = useState(1);
   const [totalCount, setTotalCount] = useState(0);
@@ -110,6 +106,7 @@ function ReviewQueuePageInner() {
     [pathname, router, searchParams],
   );
 
+  // Hooks must run unconditionally — gate rendering after all hooks below.
   useEffect(() => {
     const qt = (searchParams.get('queue_type') || 'all') as QueueTab;
     if (['all', 'new_claims', 'conflicts', 'flagged', 'expiring'].includes(qt)) setActiveTab(qt);
@@ -189,10 +186,10 @@ function ReviewQueuePageInner() {
   }, [API_BASE, contradictionsOnly, getHeaders, minWorstSourceRank, myDomainOnly, ordering, staleDays]);
 
   useEffect(() => {
-    if (!session) return;
+    if (!session || !isReviewer) return;
     fetchContributions(currentPage, activeTab, selectedCategory, appliedSearch);
     fetchQueueCounts();
-  }, [session, currentPage, activeTab, selectedCategory, appliedSearch, ordering, staleDays, contradictionsOnly, minWorstSourceRank, myDomainOnly, fetchContributions, fetchQueueCounts]);
+  }, [session, isReviewer, currentPage, activeTab, selectedCategory, appliedSearch, ordering, staleDays, contradictionsOnly, minWorstSourceRank, myDomainOnly, fetchContributions, fetchQueueCounts]);
 
   const handleTabChange = (tab: string) => {
     setActiveTab(tab as QueueTab); setCurrentPage(1);
@@ -256,6 +253,15 @@ function ReviewQueuePageInner() {
   const formatUserName = (u: UserInfo) => `${u.first_name} ${u.last_name}`.trim() || u.username;
   const getRevisionInfo = (c: Contribution) => c.latest_revision ? `Rev. ${c.latest_revision.revision_number}` : '—';
 
+  if (rolesLoading) {
+    return (
+      <div className="p-8 text-center text-muted-foreground">Checking reviewer access…</div>
+    );
+  }
+  if (!isReviewer) {
+    return <AccessDenied requiredRole="reviewer" userEmail={session?.user?.email} />;
+  }
+
   return (
     <TooltipProvider>
 
@@ -273,7 +279,18 @@ function ReviewQueuePageInner() {
               <h1 className="text-3xl font-black text-white">
                 Review <span className="text-white/90">Queue</span>
               </h1>
-              <p className="text-blue-100 max-w-lg">Evaluate claims, resolve conflicts, maintain provenance</p>
+              <p className="text-blue-100 max-w-lg">
+                Evaluate claims, resolve conflicts, maintain provenance. Prefer this queue for
+                source-tier triage — use{" "}
+                <button
+                  type="button"
+                  className="underline underline-offset-2 hover:text-white"
+                  onClick={() => router.push("/curation/contributions")}
+                >
+                  Curation Queues
+                </button>{" "}
+                only for quick bulk accept/reject.
+              </p>
             </div>
             <div className="flex gap-2 flex-wrap">
               <Button onClick={() => router.push('/curation/dashboard')} variant="outline" className="border-white/30 text-white hover:bg-white/20">Dashboard</Button>