diff --git a/.copier-answers.yml b/.copier-answers.yml
index 9d6de00..4a13511 100644
--- a/.copier-answers.yml
+++ b/.copier-answers.yml
@@ -1,3 +1,3 @@
 # Changes here will be overwritten by Copier; NEVER EDIT MANUALLY
-_commit: v0.3.4
+_commit: v0.4.0
 _src_path: https://github.com/run-llama/template-workflow-data-extraction
diff --git a/README.md b/README.md
index 53d862b..8a857cb 100644
--- a/README.md
+++ b/README.md
@@ -26,7 +26,7 @@ For more complex customizations, you can edit the rest of the application. For e
 
 ## Linting and type checking
 
-Python and javascript pacakges contain helpful scripts to lint, format, and type check the code.
+Python and javascript packages contain helpful scripts to lint, format, and type check the code.
 
 To check and fix python code:
 
diff --git a/src/extraction_review/config.py b/src/extraction_review/config.py
index 4d5b0e6..22e377c 100644
--- a/src/extraction_review/config.py
+++ b/src/extraction_review/config.py
@@ -38,7 +38,8 @@ EXTRACT_CONFIG = ExtractConfig(
     extraction_mode=ExtractMode.PREMIUM,
     system_prompt=None,
     # advanced. Only compatible with Premium mode.
+    citation_bbox=True,
     use_reasoning=False,
-    cite_sources=False,
+    cite_sources=True,
     confidence_scores=True,
 )
diff --git a/ui/package.json b/ui/package.json
index 387be60..ba61f02 100644
--- a/ui/package.json
+++ b/ui/package.json
@@ -21,7 +21,7 @@
     "@radix-ui/themes": "^3.2.1",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
-    "llama-cloud-services": "^0.3.4",
+    "llama-cloud-services": "^0.5.2",
     "lucide-react": "^0.514.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
diff --git a/ui/src/lib/utils.ts b/ui/src/lib/utils.ts
index a5ef193..b433ecd 100644
--- a/ui/src/lib/utils.ts
+++ b/ui/src/lib/utils.ts
@@ -1,6 +1,43 @@
 import { clsx, type ClassValue } from "clsx";
 import { twMerge } from "tailwind-merge";
+import type { Highlight } from "@llamaindex/ui";
+import type { FieldCitation } from "llama-cloud-services/beta/agent";
 
 export function cn(...inputs: ClassValue[]) {
   return twMerge(clsx(inputs));
 }
+
+export function convertBoundingBoxesToHighlights(
+  citations: FieldCitation[] | undefined,
+): Highlight[] {
+  if (!citations || citations.length === 0) return [];
+
+  const highlights: Highlight[] = [];
+
+  for (const citation of citations) {
+    const page = citation.page ?? 1;
+    const boundingBoxes = citation.bounding_boxes;
+
+    if (boundingBoxes && boundingBoxes.length > 0) {
+      for (const bbox of boundingBoxes) {
+        highlights.push({
+          page,
+          x: bbox.x,
+          y: bbox.y,
+          width: bbox.w,
+          height: bbox.h,
+        });
+      }
+    } else if (citation.page !== undefined) {
+      highlights.push({
+        page,
+        x: 0,
+        y: 0,
+        width: 0,
+        height: 0,
+      });
+    }
+  }
+
+  return highlights;
+}
diff --git a/ui/src/pages/HomePage.tsx b/ui/src/pages/HomePage.tsx
index df62135..ef75739 100644
--- a/ui/src/pages/HomePage.tsx
+++ b/ui/src/pages/HomePage.tsx
@@ -30,7 +30,7 @@ function TaskList() {
           <ItemCount
             title="Reviewed"
             filter={{
-              status: { eq: "approved" },
+              status: { includes: ["approved", "rejected"] },
             }}
             key={`reviewed-${reloadSignal}`}
           />
diff --git a/ui/src/pages/ItemPage.tsx b/ui/src/pages/ItemPage.tsx
index 19493f0..01edb7a 100644
--- a/ui/src/pages/ItemPage.tsx
+++ b/ui/src/pages/ItemPage.tsx
@@ -15,6 +15,7 @@ import { modifyJsonSchema } from "@llamaindex/ui/lib";
 import { APP_TITLE } from "@/lib/config";
 import { downloadExtractedDataItem } from "@/lib/export";
 import { useMetadataContext } from "@/lib/MetadataProvider";
+import { convertBoundingBoxesToHighlights } from "@/lib/utils";
 
 export default function ItemPage() {
   const { itemId } = useParams<{ itemId: string }>();
@@ -111,7 +112,7 @@ export default function ItemPage() {
   return (
     <div className="flex h-full bg-gray-50">
       {/* Left Side - File Preview */}
-      <div className="w-1/2 border-r border-gray-200 bg-white">
+      <div className="w-1/2 border-r h-full border-gray-200 bg-white">
         {itemData.data.file_id && (
           <FilePreview
             fileId={itemData.data.file_id}
@@ -133,15 +134,11 @@ export default function ItemPage() {
             onChange={(updatedData) => {
               updateData(updatedData);
             }}
-            onClickField={(args) => {
-              // TODO: set multiple highlights
-              setHighlight({
-                page: args.metadata?.citation?.[0]?.page ?? 1,
-                x: 100,
-                y: 100,
-                width: 0,
-                height: 0,
-              });
+            onHoverField={(args) => {
+              const highlights = convertBoundingBoxesToHighlights(
+                args?.metadata?.citation,
+              );
+              setHighlight(highlights[0]);
             }}
             jsonSchema={itemHookData.jsonSchema}
           />