salvacybersec/CodeNomad
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Group message action buttons

Browse Source
This commit is contained in:
Shantur Rathore
2025-12-01 23:42:01 +00:00
parent 5384ff8e80
commit 1a1aee8f91
2 changed files with 42 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
packages/ui/src/components/message-item.tsx
View File

@@ -196,28 +196,33 @@ interface MessageItemProps {
<Show when={agentMeta()}>{(meta) => <span class="message-agent-meta">{meta()}</span>}</Show> <Show when={agentMeta()}>{(meta) => <span class="message-agent-meta">{meta()}</span>}</Show>
</div> </div>
<div class="message-item-actions"> <div class="message-item-actions">
<Show when={isUser() && props.onRevert}> <Show when={isUser()}>
<button <div class="message-action-group">
class="bg-transparent border border-[var(--border-base)] text-[var(--text-muted)] cursor-pointer px-3 py-0.5 rounded text-xs font-semibold leading-none transition-all duration-200 flex items-center justify-center h-6 hover:bg-[var(--surface-hover)] hover:border-[var(--accent-primary)] hover:text-[var(--accent-primary)] active:scale-95" <Show when={props.onRevert}>
onClick={handleRevert} <button
title="Revert to this message" class="message-action-button"
aria-label="Revert to this message" onClick={handleRevert}
> title="Revert to this message"
Revert to aria-label="Revert to this message"
</button> >
</Show> Revert
<Show when={isUser() && props.onFork}> </button>
<button </Show>
class="bg-transparent border border-[var(--border-base)] text-[var(--text-muted)] cursor-pointer px-3 py-0.5 rounded text-xs font-semibold leading-none transition-all duration-200 flex items-center justify-center h-6 hover:bg-[var(--surface-hover)] hover:border-[var(--accent-primary)] hover:text-[var(--accent-primary)] active:scale-95" <Show when={props.onFork}>
onClick={() => props.onFork?.(props.record.id)} <button
title="Fork from this message" class="message-action-button"
aria-label="Fork from this message" onClick={() => props.onFork?.(props.record.id)}
> title="Fork from this message"
Fork aria-label="Fork from this message"
</button> >
Fork
</button>
</Show>
</div>
</Show> </Show>
<time class="message-timestamp" dateTime={timestampIso()}>{timestamp()}</time> <time class="message-timestamp" dateTime={timestampIso()}>{timestamp()}</time>
</div> </div>
</header> </header>
<div class="pt-1 whitespace-pre-wrap break-words leading-[1.1]"> <div class="pt-1 whitespace-pre-wrap break-words leading-[1.1]">

18
packages/ui/src/styles/messaging/message-base.css
View File

@@ -31,6 +31,24 @@
@apply flex items-center gap-2; @apply flex items-center gap-2;
} }
.message-action-group {
@apply flex items-center gap-2;
}
.message-action-button {
@apply bg-transparent border border-[var(--border-base)] text-[var(--text-muted)] cursor-pointer px-3 py-0.5 rounded text-xs font-semibold leading-none transition-all duration-200 flex items-center justify-center h-6;
}
.message-action-button:hover {
background-color: var(--surface-hover);
border-color: var(--accent-primary);
color: var(--accent-primary);
}
.message-action-button:active {
transform: scale(0.95);
}
.message-timestamp { .message-timestamp {
@apply text-[11px] text-[var(--text-muted)]; @apply text-[11px] text-[var(--text-muted)];
} }