From 7ca7b5a264e9cb68e000aeb7df331f53624677a4 Mon Sep 17 00:00:00 2001 From: Michael Matloka Date: Tue, 14 Apr 2026 15:47:10 +0200 Subject: [PATCH 1/4] feat: Add configure sources button to signals toolbar and update signal source labels Generated-By: PostHog Code Task-Id: 803dc85f-9d49-4870-a412-8173043572b3 --- .../inbox/components/InboxSignalsTab.tsx | 2 + .../features/inbox/components/InboxView.tsx | 21 +-- .../inbox/components/SignalSourceToggles.tsx | 65 ++++++++-- .../list/GitHubConnectionBanner.tsx | 4 +- .../inbox/components/list/SignalsToolbar.tsx | 122 ++++++++++-------- .../components/utils/ReportCardContent.tsx | 3 +- .../utils/SignalReportActionabilityBadge.tsx | 5 +- .../onboarding/components/SignalsStep.tsx | 13 +- .../sections/SignalSourcesSettings.tsx | 13 +- .../sidebar/components/SidebarMenu.tsx | 5 +- .../sidebar/components/items/HomeItem.tsx | 28 +++- 11 files changed, 181 insertions(+), 100 deletions(-) diff --git a/apps/code/src/renderer/features/inbox/components/InboxSignalsTab.tsx b/apps/code/src/renderer/features/inbox/components/InboxSignalsTab.tsx index 61e0be4ff..74515f2c5 100644 --- a/apps/code/src/renderer/features/inbox/components/InboxSignalsTab.tsx +++ b/apps/code/src/renderer/features/inbox/components/InboxSignalsTab.tsx @@ -481,6 +481,7 @@ export function InboxSignalsTab() { reports={reports} effectiveBulkIds={selectedReportIds} onToggleSelectAll={handleToggleSelectAll} + onConfigureSources={() => setSourcesDialogOpen(true)} /> setSourcesDialogOpen(true)} /> diff --git a/apps/code/src/renderer/features/inbox/components/InboxView.tsx b/apps/code/src/renderer/features/inbox/components/InboxView.tsx index 8c5b9948b..4c691f854 100644 --- a/apps/code/src/renderer/features/inbox/components/InboxView.tsx +++ b/apps/code/src/renderer/features/inbox/components/InboxView.tsx @@ -1,13 +1,10 @@ -import { useInboxSourcesDialogStore } from "@features/inbox/stores/inboxSourcesDialogStore"; import { useSetHeaderContent } from "@hooks/useSetHeaderContent"; -import { EnvelopeSimpleIcon, GearSixIcon } from "@phosphor-icons/react"; -import { Box, Flex, Text } from "@radix-ui/themes"; +import { EnvelopeSimpleIcon } from "@phosphor-icons/react"; +import { Flex, Text } from "@radix-ui/themes"; import { useMemo } from "react"; import { InboxSignalsTab } from "./InboxSignalsTab"; export function InboxView() { - const openSourcesDialog = useInboxSourcesDialogStore((s) => s.setOpen); - const headerContent = useMemo( () => ( @@ -20,24 +17,16 @@ export function InboxView() { > Inbox - ), - [openSourcesDialog], + [], ); useSetHeaderContent(headerContent); return ( - +
- +
); } diff --git a/apps/code/src/renderer/features/inbox/components/SignalSourceToggles.tsx b/apps/code/src/renderer/features/inbox/components/SignalSourceToggles.tsx index 8c9bc349b..fd5af0a2f 100644 --- a/apps/code/src/renderer/features/inbox/components/SignalSourceToggles.tsx +++ b/apps/code/src/renderer/features/inbox/components/SignalSourceToggles.tsx @@ -34,6 +34,7 @@ export interface SignalSourceValues { interface SignalSourceToggleCardProps { icon: React.ReactNode; label: string; + labelSuffix?: React.ReactNode; description: string; checked: boolean; onCheckedChange: (checked: boolean) => void; @@ -47,6 +48,7 @@ interface SignalSourceToggleCardProps { const SignalSourceToggleCard = memo(function SignalSourceToggleCard({ icon, label, + labelSuffix, description, checked, onCheckedChange, @@ -77,9 +79,16 @@ const SignalSourceToggleCard = memo(function SignalSourceToggleCard({ {icon} - - {label} - + + + {label} + + {labelSuffix} + {description} @@ -174,9 +183,25 @@ export const EvaluationsSection = memo(function EvaluationsSection({ - - LLM evaluations - + + + PostHog LLM Analytics + + + Internal + + Ongoing evaluation of how your AI features are performing based on defined criteria @@ -295,9 +320,29 @@ export function SignalSourceToggles({ return ( + } + label="PostHog Error Tracking" + description="Surface new issues, reopenings, and volume spikes" + checked={value.error_tracking} + onCheckedChange={toggleErrorTracking} + disabled={disabled} + /> } label="PostHog Session Replay" + labelSuffix={ + + Alpha + + } description="Analyze session recordings and event data for UX issues" checked={value.session_replay} onCheckedChange={toggleSessionReplay} @@ -311,14 +356,6 @@ export function SignalSourceToggles({ ) : undefined } /> - } - label="PostHog Error Tracking" - description="Surface new issues, reopenings, and volume spikes" - checked={value.error_tracking} - onCheckedChange={toggleErrorTracking} - disabled={disabled} - /> {evaluations && evaluationsUrl && onToggleEvaluation && ( - - {`Connect your GitHub profile to highlight what's relevant to you`} + + Connect your GitHub profile to highlight what's relevant to you diff --git a/apps/code/src/renderer/features/inbox/components/list/SignalsToolbar.tsx b/apps/code/src/renderer/features/inbox/components/list/SignalsToolbar.tsx index 580c0ec3a..6921e40b3 100644 --- a/apps/code/src/renderer/features/inbox/components/list/SignalsToolbar.tsx +++ b/apps/code/src/renderer/features/inbox/components/list/SignalsToolbar.tsx @@ -5,6 +5,7 @@ import { INBOX_REFETCH_INTERVAL_MS } from "@features/inbox/utils/inboxConstants" import { ArrowClockwiseIcon, EyeSlashIcon, + GearSixIcon, MagnifyingGlass, PauseIcon, TrashIcon, @@ -40,6 +41,8 @@ interface SignalsToolbarProps { effectiveBulkIds?: string[]; /** Called when the select-all checkbox is toggled. Parent owns all state transitions. */ onToggleSelectAll?: (checked: boolean) => void; + /** Called when the "Configure sources" button is clicked. */ + onConfigureSources?: () => void; } function formatPauseRemaining(pausedUntil: string): string { @@ -83,6 +86,7 @@ export function SignalsToolbar({ reports = [], effectiveBulkIds = [], onToggleSelectAll, + onConfigureSources, }: SignalsToolbarProps) { const searchQuery = useInboxSignalsFilterStore((s) => s.searchQuery); const setSearchQuery = useInboxSignalsFilterStore((s) => s.setSearchQuery); @@ -115,7 +119,7 @@ export function SignalsToolbar({ : null, pipelinePausedUntil ? `Pipeline paused · resumes in ${formatPauseRemaining(pipelinePausedUntil)}` - : "Pipeline running", + : null, ].filter(Boolean); const pipelineHint = @@ -188,6 +192,16 @@ export function SignalsToolbar({ ) : null} + {onConfigureSources ? ( + + ) : null} @@ -218,7 +232,7 @@ export function SignalsToolbar({ )} - + @@ -248,64 +262,70 @@ export function SignalsToolbar({ - - - - {IS_DEV && ( + + - )} + + {IS_DEV && ( + + )} + diff --git a/apps/code/src/renderer/features/inbox/components/utils/ReportCardContent.tsx b/apps/code/src/renderer/features/inbox/components/utils/ReportCardContent.tsx index 7e07e6935..81c7632d3 100644 --- a/apps/code/src/renderer/features/inbox/components/utils/ReportCardContent.tsx +++ b/apps/code/src/renderer/features/inbox/components/utils/ReportCardContent.tsx @@ -51,10 +51,11 @@ export function ReportCardContent({ > {report.title ?? "Untitled signal"} - + {!isReady && } {report.is_suggested_reviewer && ( diff --git a/apps/code/src/renderer/features/inbox/components/utils/SignalReportActionabilityBadge.tsx b/apps/code/src/renderer/features/inbox/components/utils/SignalReportActionabilityBadge.tsx index 3dbba2846..c5955c2c8 100644 --- a/apps/code/src/renderer/features/inbox/components/utils/SignalReportActionabilityBadge.tsx +++ b/apps/code/src/renderer/features/inbox/components/utils/SignalReportActionabilityBadge.tsx @@ -27,10 +27,13 @@ const ACTIONABILITY_CHIP_STYLE: Record< interface SignalReportActionabilityBadgeProps { actionability: SignalReportActionability | null | undefined; + /** When true, prefix the label with "Researched ·" to signal that research is complete. */ + researched?: boolean; } export function SignalReportActionabilityBadge({ actionability, + researched, }: SignalReportActionabilityBadgeProps): ReactNode { if (actionability == null) { return null; @@ -51,7 +54,7 @@ export function SignalReportActionabilityBadge({ }} title="Actionability assessment from research" > - {s.label} + {researched ? `Researched · ${s.label}` : s.label} ); } diff --git a/apps/code/src/renderer/features/onboarding/components/SignalsStep.tsx b/apps/code/src/renderer/features/onboarding/components/SignalsStep.tsx index 934f91232..561ab992b 100644 --- a/apps/code/src/renderer/features/onboarding/components/SignalsStep.tsx +++ b/apps/code/src/renderer/features/onboarding/components/SignalsStep.tsx @@ -1,6 +1,7 @@ import { DataSourceSetup } from "@features/inbox/components/DataSourceSetup"; import { SignalSourceToggles } from "@features/inbox/components/SignalSourceToggles"; import { useSignalSourceManager } from "@features/inbox/hooks/useSignalSourceManager"; +import { useMeQuery } from "@hooks/useMeQuery"; import { ArrowLeft, ArrowRight } from "@phosphor-icons/react"; import { Button, Flex, Text } from "@radix-ui/themes"; import codeLogo from "@renderer/assets/images/code.svg"; @@ -27,6 +28,8 @@ export function SignalsStep({ onNext, onBack }: SignalsStepProps) { evaluationsUrl, handleToggleEvaluation, } = useSignalSourceManager(); + const { data: me } = useMeQuery(); + const isStaff = me?.is_staff ?? false; const anyEnabled = displayValues.session_replay || @@ -105,10 +108,12 @@ export function SignalsStep({ onNext, onBack }: SignalsStepProps) { disabled={isLoading} sourceStates={sourceStates} onSetup={handleSetup} - evaluations={evaluations} - evaluationsUrl={evaluationsUrl} - onToggleEvaluation={(id, enabled) => - void handleToggleEvaluation(id, enabled) + evaluations={isStaff ? evaluations : undefined} + evaluationsUrl={isStaff ? evaluationsUrl : undefined} + onToggleEvaluation={ + isStaff + ? (id, enabled) => void handleToggleEvaluation(id, enabled) + : undefined } /> )} diff --git a/apps/code/src/renderer/features/settings/components/sections/SignalSourcesSettings.tsx b/apps/code/src/renderer/features/settings/components/sections/SignalSourcesSettings.tsx index 1c16a70d4..53fe39ce9 100644 --- a/apps/code/src/renderer/features/settings/components/sections/SignalSourcesSettings.tsx +++ b/apps/code/src/renderer/features/settings/components/sections/SignalSourcesSettings.tsx @@ -1,6 +1,7 @@ import { DataSourceSetup } from "@features/inbox/components/DataSourceSetup"; import { SignalSourceToggles } from "@features/inbox/components/SignalSourceToggles"; import { useSignalSourceManager } from "@features/inbox/hooks/useSignalSourceManager"; +import { useMeQuery } from "@hooks/useMeQuery"; import { Flex, Text } from "@radix-ui/themes"; export function SignalSourcesSettings() { @@ -18,6 +19,8 @@ export function SignalSourcesSettings() { evaluationsUrl, handleToggleEvaluation, } = useSignalSourceManager(); + const { data: me } = useMeQuery(); + const isStaff = me?.is_staff ?? false; if (isLoading) { return ( @@ -47,10 +50,12 @@ export function SignalSourcesSettings() { sourceStates={sourceStates} sessionAnalysisStatus={sessionAnalysisStatus} onSetup={handleSetup} - evaluations={evaluations} - evaluationsUrl={evaluationsUrl} - onToggleEvaluation={(id, enabled) => - void handleToggleEvaluation(id, enabled) + evaluations={isStaff ? evaluations : undefined} + evaluationsUrl={isStaff ? evaluationsUrl : undefined} + onToggleEvaluation={ + isStaff + ? (id, enabled) => void handleToggleEvaluation(id, enabled) + : undefined } /> )} diff --git a/apps/code/src/renderer/features/sidebar/components/SidebarMenu.tsx b/apps/code/src/renderer/features/sidebar/components/SidebarMenu.tsx index 9e0eb6fb4..c36a746f8 100644 --- a/apps/code/src/renderer/features/sidebar/components/SidebarMenu.tsx +++ b/apps/code/src/renderer/features/sidebar/components/SidebarMenu.tsx @@ -64,7 +64,10 @@ function SidebarMenuComponent() { ); const inboxResults = inboxProbe?.results ?? []; const inboxSignalCount = inboxResults.filter( - (r) => r.status === "ready", + (r) => + r.status === "ready" && + r.is_suggested_reviewer && + r.actionability === "immediately_actionable", ).length; const taskMap = new Map(); diff --git a/apps/code/src/renderer/features/sidebar/components/items/HomeItem.tsx b/apps/code/src/renderer/features/sidebar/components/items/HomeItem.tsx index 8c201eca9..a6f736b52 100644 --- a/apps/code/src/renderer/features/sidebar/components/items/HomeItem.tsx +++ b/apps/code/src/renderer/features/sidebar/components/items/HomeItem.tsx @@ -51,15 +51,31 @@ export function InboxItem({ isActive, onClick, signalCount }: InboxItemProps) { isActive={isActive} onClick={onClick} endContent={ - signalCount && signalCount > 0 ? ( + <> + {signalCount && signalCount > 0 ? ( + + {formatSignalCount(signalCount)} + + ) : null} - {formatSignalCount(signalCount)} + Beta - ) : undefined + } /> From 1544ed5543eaca2cf8505677b90a7d79e3ad6062 Mon Sep 17 00:00:00 2001 From: Michael Matloka Date: Wed, 15 Apr 2026 02:01:27 +0200 Subject: [PATCH 2/4] Tweak the badges --- .../components/detail/ReportDetailPane.tsx | 31 +++++----- .../components/utils/ReportCardContent.tsx | 20 +++---- .../utils/SignalReportActionabilityBadge.tsx | 48 +++++----------- .../utils/SignalReportPriorityBadge.tsx | 56 +++++-------------- .../utils/SignalReportStatusBadge.tsx | 47 +++++++++------- .../features/inbox/utils/inboxSort.ts | 54 ------------------ .../sidebar/components/SidebarItem.tsx | 6 +- .../sidebar/components/items/HomeItem.tsx | 39 +++++++------ 8 files changed, 109 insertions(+), 192 deletions(-) diff --git a/apps/code/src/renderer/features/inbox/components/detail/ReportDetailPane.tsx b/apps/code/src/renderer/features/inbox/components/detail/ReportDetailPane.tsx index 405235164..69ef5861a 100644 --- a/apps/code/src/renderer/features/inbox/components/detail/ReportDetailPane.tsx +++ b/apps/code/src/renderer/features/inbox/components/detail/ReportDetailPane.tsx @@ -18,13 +18,13 @@ import { Cloud as CloudIcon, CommandIcon, EyeIcon, - GithubLogoIcon, KeyReturnIcon, WarningIcon, XIcon, } from "@phosphor-icons/react"; import { AlertDialog, + Badge, Box, Button, Flex, @@ -469,9 +469,12 @@ export function ReportDetailPane({ report, onClose }: ReportDetailPaneProps) { gap="2" wrap="wrap" > - e.currentTarget.classList.add("loaded")} /> {reviewer.user?.first_name ?? @@ -480,16 +483,18 @@ export function ReportDetailPane({ report, onClose }: ReportDetailPaneProps) { {isMe && ( - - - + + )} {report.is_suggested_reviewer && ( - - - + + )} diff --git a/apps/code/src/renderer/features/inbox/components/utils/SignalReportActionabilityBadge.tsx b/apps/code/src/renderer/features/inbox/components/utils/SignalReportActionabilityBadge.tsx index c5955c2c8..64da98555 100644 --- a/apps/code/src/renderer/features/inbox/components/utils/SignalReportActionabilityBadge.tsx +++ b/apps/code/src/renderer/features/inbox/components/utils/SignalReportActionabilityBadge.tsx @@ -1,60 +1,40 @@ +import { Badge } from "@radix-ui/themes"; import type { SignalReportActionability } from "@shared/types"; import type { ReactNode } from "react"; -const ACTIONABILITY_CHIP_STYLE: Record< +const ACTIONABILITY_STYLE: Record< SignalReportActionability, - { color: string; backgroundColor: string; borderColor: string; label: string } + { color: "green" | "amber" | "gray"; label: string } > = { - immediately_actionable: { - color: "var(--green-11)", - backgroundColor: "var(--green-3)", - borderColor: "var(--green-6)", - label: "Actionable", - }, - requires_human_input: { - color: "var(--amber-11)", - backgroundColor: "var(--amber-3)", - borderColor: "var(--amber-6)", - label: "Needs input", - }, - not_actionable: { - color: "var(--gray-11)", - backgroundColor: "var(--gray-3)", - borderColor: "var(--gray-6)", - label: "Not actionable", - }, + immediately_actionable: { color: "green", label: "Actionable" }, + requires_human_input: { color: "amber", label: "Needs input" }, + not_actionable: { color: "gray", label: "Not actionable" }, }; interface SignalReportActionabilityBadgeProps { actionability: SignalReportActionability | null | undefined; - /** When true, prefix the label with "Researched ·" to signal that research is complete. */ - researched?: boolean; } export function SignalReportActionabilityBadge({ actionability, - researched, }: SignalReportActionabilityBadgeProps): ReactNode { if (actionability == null) { return null; } - const s = ACTIONABILITY_CHIP_STYLE[actionability]; + const s = ACTIONABILITY_STYLE[actionability]; if (!s) { return null; } return ( - - {researched ? `Researched · ${s.label}` : s.label} - + {s.label} + ); } diff --git a/apps/code/src/renderer/features/inbox/components/utils/SignalReportPriorityBadge.tsx b/apps/code/src/renderer/features/inbox/components/utils/SignalReportPriorityBadge.tsx index 027219a4c..0af07c614 100644 --- a/apps/code/src/renderer/features/inbox/components/utils/SignalReportPriorityBadge.tsx +++ b/apps/code/src/renderer/features/inbox/components/utils/SignalReportPriorityBadge.tsx @@ -1,36 +1,15 @@ +import { Badge } from "@radix-ui/themes"; import type { SignalReportPriority } from "@shared/types"; import type { ReactNode } from "react"; -/** Matches `ReportCard` status chip: `rounded-sm px-1 py-px text-[9px] uppercase tracking-wider` + 1px border */ -const PRIORITY_CHIP_STYLE: Record< - SignalReportPriority, - { color: string; backgroundColor: string; borderColor: string } -> = { - P0: { - color: "var(--red-11)", - backgroundColor: "var(--red-3)", - borderColor: "var(--red-6)", - }, - P1: { - color: "var(--orange-11)", - backgroundColor: "var(--orange-3)", - borderColor: "var(--orange-6)", - }, - P2: { - color: "var(--amber-11)", - backgroundColor: "var(--amber-3)", - borderColor: "var(--amber-6)", - }, - P3: { - color: "var(--gray-11)", - backgroundColor: "var(--gray-3)", - borderColor: "var(--gray-6)", - }, - P4: { - color: "var(--gray-11)", - backgroundColor: "var(--gray-3)", - borderColor: "var(--gray-6)", - }, +type BadgeColor = "red" | "orange" | "amber" | "gray"; + +const PRIORITY_COLOR: Record = { + P0: "red", + P1: "orange", + P2: "amber", + P3: "gray", + P4: "gray", }; interface SignalReportPriorityBadgeProps { @@ -44,19 +23,14 @@ export function SignalReportPriorityBadge({ return null; } - const s = PRIORITY_CHIP_STYLE[priority]; - return ( - {priority} - + ); } diff --git a/apps/code/src/renderer/features/inbox/components/utils/SignalReportStatusBadge.tsx b/apps/code/src/renderer/features/inbox/components/utils/SignalReportStatusBadge.tsx index 4f30cf2d0..d91c1a4b4 100644 --- a/apps/code/src/renderer/features/inbox/components/utils/SignalReportStatusBadge.tsx +++ b/apps/code/src/renderer/features/inbox/components/utils/SignalReportStatusBadge.tsx @@ -1,10 +1,5 @@ -import { - inboxStatusBgCss, - inboxStatusBorderCss, - inboxStatusLabel, - inboxStatusTextCss, -} from "@features/inbox/utils/inboxSort"; -import { Tooltip } from "@radix-ui/themes"; +import { inboxStatusLabel } from "@features/inbox/utils/inboxSort"; +import { Badge, Tooltip } from "@radix-ui/themes"; import type { SignalReportStatus } from "@shared/types"; const STATUS_TOOLTIPS: Record = { @@ -20,6 +15,25 @@ const STATUS_TOOLTIPS: Record = { deleted: "This report has been deleted.", }; +type BadgeColor = "green" | "violet" | "amber" | "cyan" | "gray" | "red"; + +function inboxStatusBadgeColor(status: SignalReportStatus): BadgeColor { + switch (status) { + case "ready": + return "green"; + case "pending_input": + return "violet"; + case "in_progress": + return "amber"; + case "candidate": + return "cyan"; + case "failed": + return "red"; + default: + return "gray"; + } +} + interface SignalReportStatusBadgeProps { status: SignalReportStatus; } @@ -28,24 +42,19 @@ export function SignalReportStatusBadge({ status, }: SignalReportStatusBadgeProps) { const label = inboxStatusLabel(status); - const textColor = inboxStatusTextCss(status); const tooltip = STATUS_TOOLTIPS[status] ?? status; - - const bgColor = inboxStatusBgCss(status); - const borderColor = inboxStatusBorderCss(status); + const color = inboxStatusBadgeColor(status); return ( - {label} - + ); } diff --git a/apps/code/src/renderer/features/inbox/utils/inboxSort.ts b/apps/code/src/renderer/features/inbox/utils/inboxSort.ts index 47c29005d..58c821a64 100644 --- a/apps/code/src/renderer/features/inbox/utils/inboxSort.ts +++ b/apps/code/src/renderer/features/inbox/utils/inboxSort.ts @@ -41,57 +41,3 @@ export function inboxStatusAccentCss(status: SignalReportStatus): string { return "var(--gray-8)"; } } - -/** Higher-contrast text color for status badges (step 11 instead of 9). */ -export function inboxStatusTextCss(status: SignalReportStatus): string { - switch (status) { - case "ready": - return "var(--green-11)"; - case "pending_input": - return "var(--violet-11)"; - case "in_progress": - return "var(--amber-11)"; - case "candidate": - return "var(--cyan-11)"; - case "potential": - return "var(--gray-11)"; - case "failed": - return "var(--red-11)"; - default: - return "var(--gray-11)"; - } -} - -export function inboxStatusBgCss(status: SignalReportStatus): string { - switch (status) { - case "ready": - return "var(--green-3)"; - case "pending_input": - return "var(--violet-3)"; - case "in_progress": - return "var(--amber-3)"; - case "candidate": - return "var(--cyan-3)"; - case "failed": - return "var(--red-3)"; - default: - return "var(--gray-3)"; - } -} - -export function inboxStatusBorderCss(status: SignalReportStatus): string { - switch (status) { - case "ready": - return "var(--green-6)"; - case "pending_input": - return "var(--violet-6)"; - case "in_progress": - return "var(--amber-6)"; - case "candidate": - return "var(--cyan-6)"; - case "failed": - return "var(--red-6)"; - default: - return "var(--gray-6)"; - } -} diff --git a/apps/code/src/renderer/features/sidebar/components/SidebarItem.tsx b/apps/code/src/renderer/features/sidebar/components/SidebarItem.tsx index 5cfc98dd6..41d6d3b84 100644 --- a/apps/code/src/renderer/features/sidebar/components/SidebarItem.tsx +++ b/apps/code/src/renderer/features/sidebar/components/SidebarItem.tsx @@ -5,7 +5,7 @@ const INDENT_SIZE = 8; interface SidebarItemProps { depth: number; icon?: React.ReactNode; - label: string; + label: React.ReactNode; subtitle?: React.ReactNode; isActive?: boolean; isDimmed?: boolean; @@ -59,10 +59,10 @@ export function SidebarItem({ {icon} )} - + {label} diff --git a/apps/code/src/renderer/features/sidebar/components/items/HomeItem.tsx b/apps/code/src/renderer/features/sidebar/components/items/HomeItem.tsx index a6f736b52..9fd4db8af 100644 --- a/apps/code/src/renderer/features/sidebar/components/items/HomeItem.tsx +++ b/apps/code/src/renderer/features/sidebar/components/items/HomeItem.tsx @@ -1,5 +1,6 @@ import { Tooltip } from "@components/ui/Tooltip"; import { EnvelopeSimple, Plus } from "@phosphor-icons/react"; +import { Badge } from "@radix-ui/themes"; import { formatHotkey, SHORTCUTS, @@ -37,7 +38,11 @@ function formatSignalCount(count: number): string { export function InboxItem({ isActive, onClick, signalCount }: InboxItemProps) { return ( 0 + ? `${signalCount} actionable report${signalCount === 1 ? "" : "s"} assigned to you` + : "No actionable reports assigned to you yet" + } shortcut={formatHotkey(SHORTCUTS.INBOX)} side="right" > @@ -47,16 +52,14 @@ export function InboxItem({ isActive, onClick, signalCount }: InboxItemProps) { icon={ } - label="Inbox" - isActive={isActive} - onClick={onClick} - endContent={ + label={ <> + Inbox {signalCount && signalCount > 0 ? ( ) : null} - - Beta - } + isActive={isActive} + onClick={onClick} + endContent={ + + Beta + + } /> From da1ed7790cc34920a21b2d3bd06d15ad0896a602 Mon Sep 17 00:00:00 2001 From: Michael Matloka Date: Wed, 15 Apr 2026 02:03:53 +0200 Subject: [PATCH 3/4] Make the dot indicate actual loading --- .../features/inbox/components/list/SignalsToolbar.tsx | 10 ++++++++-- apps/code/src/renderer/styles/globals.css | 11 ----------- 2 files changed, 8 insertions(+), 13 deletions(-) diff --git a/apps/code/src/renderer/features/inbox/components/list/SignalsToolbar.tsx b/apps/code/src/renderer/features/inbox/components/list/SignalsToolbar.tsx index 6921e40b3..aaa8688f9 100644 --- a/apps/code/src/renderer/features/inbox/components/list/SignalsToolbar.tsx +++ b/apps/code/src/renderer/features/inbox/components/list/SignalsToolbar.tsx @@ -31,6 +31,7 @@ interface SignalsToolbarProps { filteredCount: number; isSearchActive: boolean; livePolling?: boolean; + isFetching?: boolean; readyCount?: number; processingCount?: number; pipelinePausedUntil?: string | null; @@ -71,13 +72,14 @@ function formatPauseRemaining(pausedUntil: string): string { return remainingHours > 0 ? `${days}d ${remainingHours}h` : `${days}d`; } -const inboxLivePollingTooltip = `Inbox is focused – syncing reports every ${(INBOX_REFETCH_INTERVAL_MS / 1000).toFixed(1)} s…`; +const inboxLivePollingTooltip = `Inbox is focused – syncing reports every ${Math.round(INBOX_REFETCH_INTERVAL_MS / 1000)}s…`; export function SignalsToolbar({ totalCount, filteredCount, isSearchActive, livePolling = false, + isFetching = false, readyCount, processingCount = 0, pipelinePausedUntil, @@ -179,7 +181,11 @@ export function SignalsToolbar({ style={{ backgroundColor: "var(--red-9)", boxShadow: "0 0 8px var(--red-9)", - animation: "inboxToolbarPulse 1.4s ease-in-out infinite", + opacity: isFetching ? 1 : 0.55, + transform: isFetching ? "scale(1)" : "scale(0.92)", + transition: isFetching + ? "opacity 0.1s ease-out, transform 0.1s ease-out" + : "opacity 0.4s ease-in, transform 0.4s ease-in", }} aria-label="Live inbox refresh active" /> diff --git a/apps/code/src/renderer/styles/globals.css b/apps/code/src/renderer/styles/globals.css index f17026338..bb75c7208 100644 --- a/apps/code/src/renderer/styles/globals.css +++ b/apps/code/src/renderer/styles/globals.css @@ -897,17 +897,6 @@ button, transition: none; } -/* Inbox toolbar polling indicator pulse */ -@keyframes inboxToolbarPulse { - 0%, - 100% { - opacity: 0.35; - transform: scale(0.92); - } - 50% { - opacity: 1; - transform: scale(1); - } } /* Inbox warming-up ellipsis wave */ From 78b79be7c01a2d659c952bcde3b479f7101fdb38 Mon Sep 17 00:00:00 2001 From: Michael Matloka Date: Wed, 15 Apr 2026 02:07:25 +0200 Subject: [PATCH 4/4] Also tweak SignalSourceToggles badges --- .../inbox/components/SignalSourceToggles.tsx | 39 +++++++++---------- apps/code/src/renderer/styles/globals.css | 2 - 2 files changed, 19 insertions(+), 22 deletions(-) diff --git a/apps/code/src/renderer/features/inbox/components/SignalSourceToggles.tsx b/apps/code/src/renderer/features/inbox/components/SignalSourceToggles.tsx index fd5af0a2f..394fbfdba 100644 --- a/apps/code/src/renderer/features/inbox/components/SignalSourceToggles.tsx +++ b/apps/code/src/renderer/features/inbox/components/SignalSourceToggles.tsx @@ -9,6 +9,7 @@ import { VideoIcon, } from "@phosphor-icons/react"; import { + Badge, Box, Button, Flex, @@ -16,6 +17,7 @@ import { Spinner, Switch, Text, + Tooltip, } from "@radix-ui/themes"; import type { Evaluation, @@ -99,13 +101,12 @@ const SignalSourceToggleCard = memo(function SignalSourceToggleCard({ ) : requiresSetup ? ( ) : ( PostHog LLM Analytics - - Internal - + + + Internal + + Ongoing evaluation of how your AI features are performing based on @@ -332,16 +333,14 @@ export function SignalSourceToggles({ icon={} label="PostHog Session Replay" labelSuffix={ - Alpha - + } description="Analyze session recordings and event data for UX issues" checked={value.session_replay} diff --git a/apps/code/src/renderer/styles/globals.css b/apps/code/src/renderer/styles/globals.css index bb75c7208..8193f1328 100644 --- a/apps/code/src/renderer/styles/globals.css +++ b/apps/code/src/renderer/styles/globals.css @@ -897,8 +897,6 @@ button, transition: none; } -} - /* Inbox warming-up ellipsis wave */ @keyframes inboxEllipsisWave { 0%,