ti.sil/sourcebot
1
0
Fork 0
mirror of https://github.com/sourcebot-dev/sourcebot.git synced 2025-12-12 12:25:22 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

make inline citations pop

Browse source
This commit is contained in:
msukkari 2025-07-29 18:15:44 -07:00
parent 5faf29ab6a
commit 5efe6a8721
3 changed files with 40 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
packages/web/src/app/globals.css
View file

@ -100,8 +100,12 @@
--chat-reference: #02255f11; --chat-reference: #02255f11;
--chat-reference-hover: #02225f22; --chat-reference-hover: #02225f22;
--chat-reference-selected: #3b83f640; --chat-reference-selected: hsl(217, 91%, 78%);
--chat-reference-selected-border: #e052b8; --chat-reference-selected-border: hsl(217, 91%, 60%);
--chat-citation: #3b83f640;
--chat-citation-hover: hsl(217, 91%, 70%);
--chat-citation-border: hsl(217, 91%, 60%);
--warning: #ca8a04; --warning: #ca8a04;
} }
@ -187,8 +191,12 @@
--chat-reference: #2c313aad; --chat-reference: #2c313aad;
--chat-reference-hover: #374151; --chat-reference-hover: #374151;
--chat-reference-selected: #1e3b8a87; --chat-reference-selected: hsl(217, 40%, 30%);
--chat-reference-selected-border: #60a5fa; --chat-reference-selected-border: hsl(217, 91%, 60%);
--chat-citation: #1e3b8a87;
--chat-citation-hover: hsl(217, 91%, 55%);
--chat-citation-border: hsl(217, 91%, 60%);
--warning: #fde047; --warning: #fde047;
} }
@ -261,6 +269,27 @@
background-color: var(--chat-reference-hover) !important; background-color: var(--chat-reference-hover) !important;
} }
/* Separate hover class for inline chat citations */
.chat-citation--hover {
background-color: var(--chat-citation-hover) !important;
}
/* Chat citation styling for inline citations in chat responses */
.bg-chat-citation {
background-color: var(--chat-citation);
border: 1px solid var(--chat-citation-border);
font-weight: 500;
}
.bg-chat-citation:hover,
.hover\:bg-chat-citation-hover:hover {
background-color: var(--chat-citation-hover);
}
.bg-chat-citation-hover {
background-color: var(--chat-citation-hover);
}
.cm-editor.cm-focused { .cm-editor.cm-focused {
outline: none !important; outline: none !important;
} }

7
packages/web/src/features/chat/components/chatThread/chatThreadListItem.tsx
View file

@ -259,12 +259,17 @@ export const ChatThreadListItem = forwardRef<HTMLDivElement, ChatThreadListItemP
} }
referenceElements.forEach(element => { referenceElements.forEach(element => {
element.classList.add('chat-reference--hover'); // Check if it's an inline chat citation or code viewer element
const isInlineCitation = element.classList.contains('bg-chat-citation');
const hoverClass = isInlineCitation ? 'chat-citation--hover' : 'chat-reference--hover';
element.classList.add(hoverClass);
}); });
return () => { return () => {
referenceElements.forEach(element => { referenceElements.forEach(element => {
// Remove both possible hover classes
element.classList.remove('chat-reference--hover'); element.classList.remove('chat-reference--hover');
element.classList.remove('chat-citation--hover');
}); });
}; };
}, [hoveredReference]); }, [hoveredReference]);

2
packages/web/src/features/chat/components/chatThread/markdownRenderer.tsx
View file

@ -69,7 +69,7 @@ function remarkReferencesPlugin() {
value: `<span value: `<span
role="button" role="button"
class="${fileReference.id}" class="${fileReference.id}"
className="font-mono cursor-pointer text-xs border px-1 py-[1.5px] rounded-md transition-all duration-150 bg-chat-reference" className="font-mono cursor-pointer text-xs px-1 py-[1.5px] rounded-md transition-all duration-150 bg-chat-citation"
title="Click to navigate to code" title="Click to navigate to code"
${REFERENCE_PAYLOAD_ATTRIBUTE}="${encodeURIComponent(JSON.stringify(fileReference))}" ${REFERENCE_PAYLOAD_ATTRIBUTE}="${encodeURIComponent(JSON.stringify(fileReference))}"
>${displayText}</span>` >${displayText}</span>`