diff --git a/web/src/components/chat/ChatEventThumbnailsRow.tsx b/web/src/components/chat/ChatEventThumbnailsRow.tsx
index da26f8dd6b..89f385d4de 100644
--- a/web/src/components/chat/ChatEventThumbnailsRow.tsx
+++ b/web/src/components/chat/ChatEventThumbnailsRow.tsx
@@ -1,5 +1,6 @@
import { useApiHost } from "@/api";
import { useTranslation } from "react-i18next";
+import { LuExternalLink } from "react-icons/lu";
import { cn } from "@/lib/utils";
type ChatEvent = { id: string; score?: number };
@@ -7,17 +8,21 @@ type ChatEvent = { id: string; score?: number };
type ChatEventThumbnailsRowProps = {
events: ChatEvent[];
anchor?: { id: string } | null;
+ onAttach?: (eventId: string) => void;
};
/**
* Horizontal scroll row of event thumbnail images for chat.
* Optionally renders an anchor thumbnail with a "reference" badge above the
* results, and per-event similarity scores when provided.
+ * Clicking a thumbnail calls onAttach; a small external-link overlay opens
+ * the event in Explore.
* Renders nothing when there is nothing to show.
*/
export function ChatEventThumbnailsRow({
events,
anchor = null,
+ onAttach,
}: ChatEventThumbnailsRowProps) {
const apiHost = useApiHost();
const { t } = useTranslation(["views/chat"]);
@@ -25,33 +30,47 @@ export function ChatEventThumbnailsRow({
if (events.length === 0 && !anchor) return null;
const renderThumb = (event: ChatEvent, isAnchor = false) => (
-
-
+
+ e.stopPropagation()}
+ className="absolute right-1 top-1 flex size-6 items-center justify-center rounded bg-black/60 text-white hover:bg-black/80"
+ aria-label={t("open_in_explore")}
+ >
+
+
{typeof event.score === "number" && !isAnchor && (
-
+
{Math.round(event.score * 100)}%
)}
{isAnchor && (
-
+
{t("anchor")}
)}
-
+
);
return (