add active state to comment cards in prompt input

This commit is contained in:
David Hill
2026-01-24 23:07:12 +00:00
parent 4ded06f05d
commit 8714b1a3ac
4 changed files with 20 additions and 5 deletions

View File

@@ -184,6 +184,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
if (!item.commentID) return
comments.setFocus({ file: item.path, id: item.commentID })
comments.setActive({ file: item.path, id: item.commentID })
view().reviewPanel.open()
if (item.commentOrigin === "review") {
@@ -1711,6 +1712,10 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
<div class="flex flex-nowrap items-start gap-2 p-2 overflow-x-auto no-scrollbar">
<For each={prompt.context.items()}>
{(item) => {
const active = () => {
const a = comments.active()
return !!item.commentID && item.commentID === a?.id && item.path === a?.file
}
return (
<Tooltip
value={
@@ -1729,8 +1734,11 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
>
<div
classList={{
"group shrink-0 flex flex-col rounded-[6px] bg-background-stronger pl-2 pr-1 py-1 max-w-[200px] h-12 transition-all shadow-xs-border hover:shadow-xs-border-hover": true,
"cursor-pointer hover:bg-surface-interactive-weak": !!item.commentID,
"group shrink-0 flex flex-col rounded-[6px] pl-2 pr-1 py-1 max-w-[200px] h-12 transition-all transition-transform shadow-xs-border hover:shadow-xs-border-hover": true,
"cursor-pointer hover:bg-surface-interactive-weak": !!item.commentID && !active(),
"cursor-pointer bg-surface-interactive-hover hover:bg-surface-interactive-hover shadow-xs-border-hover":
active(),
"bg-background-stronger": !active(),
}}
onClick={() => {
openComment(item)