feat(desktop): pinned-messages pill in conv header

2026-05-16 17:45:43 +02:00
parent 7e85ffe548
commit ddeedeb71d
2 changed files with 35 additions and 0 deletions
@@ -0,0 +1,23 @@
+import { PinIcon } from './icons';
+
+interface Props {
+  count: number;
+  onClick: () => void;
+}
+
+// Compact chip rendered in the conv header that opens the pinned panel.
+// Renders nothing when count is 0 so a fresh conv shows no clutter.
+export function PinnedMessagesPill({ count, onClick }: Props) {
+  if (count === 0) return null;
+  return (
+    <button
+      type="button"
+      onClick={onClick}
+      className="inline-flex h-7 cursor-pointer items-center gap-1.5 rounded-full border border-line bg-surface-3 px-2.5 text-xs font-medium text-fg-muted transition hover:bg-surface-2 hover:text-fg focus:outline-none focus-visible:ring-2 focus-visible:ring-accent/40"
+      title="Angepinnte Nachrichten anzeigen"
+    >
+      <PinIcon className="h-3 w-3 text-accent" />
+      <span>{count} angepinnt</span>
+    </button>
+  );
+}