@burdenoff/microfe-subscriberbot 2026.1023.1 → 2026.1029.1

package/dist/subscriberbot/pages/DashboardPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"DashboardPage.js","names":[],"sources":["../../../src/subscriberbot/pages/DashboardPage.tsx"],"sourcesContent":["/**\n * Dashboard / Overview\n * @module subscriberbot/pages\n *\n * The Subscriber Bot landing page: a premium fintech console over every\n * recurring digital relationship — total recurring spend, portfolio-by-status,\n * upcoming renewals, the action-required inbox, and outstanding invoices. Every\n * number and chart is COMPUTED from real data returned by\n * `wspace-subscriberbot-svc` — nothing is mocked.\n */\n\nimport { useMemo } from 'react';\nimport {\n  Repeat2,\n  Wallet,\n  CalendarClock,\n  Inbox,\n  AlertTriangle,\n  ArrowRight,\n  ArrowUpRight,\n  Sparkles,\n  Bot,\n  ShieldCheck,\n} from 'lucide-react';\nimport { PagePurpose, GlassCard } from '@burdenoff/fe-libs/ui';\nimport {\n  PageLayout,\n  MetricsCard,\n  StatusBadge,\n  EmptyState,\n  LoadingView,\n  ErrorView,\n  Section,\n  Donut,\n  Legend,\n  Timeline,\n  type Segment,\n  type TimelineItem,\n} from '../components';\nimport { useSubscriberBot } from '../context/SubscriberBotContext';\nimport {\n  useRelationships,\n  useInvoices,\n  useInboxMessages,\n  useRenewalEvents,\n} from '../hooks/useSubscriberBotApi';\nimport { useTr } from '../hooks/useTr';\nimport { formatCurrency, formatRelativeTime, formatEnumLabel } from '../utils/formatters';\nimport type { SubBillingInterval, SubRelationship, SubRenewalEvent } from '../types';\n\n// Normalize any billing interval to an approximate monthly multiplier so we can\n// express total recurring spend as one comparable \"per month\" number.\nconst MONTHLY_FACTOR: Record<SubBillingInterval, number> = {\n  DAILY: 30,\n  WEEKLY: 4.345,\n  MONTHLY: 1,\n  QUARTERLY: 1 / 3,\n  YEARLY: 1 / 12,\n  LIFETIME: 0,\n  FREE: 0,\n  USAGE_BASED: 1,\n};\n\n// A single normalized \"what charges next\" row, sourced from real renewal events\n// when present, otherwise derived from each relationship's own `renewsAt`.\ninterface UpcomingRenewal {\n  id: string;\n  relationshipId: string;\n  title: string;\n  when: string;\n  amount: number | null;\n  currency: string | null;\n  soon: boolean;\n}\n\nconst MS_PER_DAY = 1000 * 60 * 60 * 24;\n\nexport function DashboardPage() {\n  const { navigateTo, currentUser } = useSubscriberBot();\n  const tr = useTr();\n\n  const relationshipsQ = useRelationships({ pagination: { limit: 100, offset: 0 } });\n  const invoicesQ = useInvoices({ pagination: { limit: 50, offset: 0 } });\n  const inboxQ = useInboxMessages({ pagination: { limit: 50, offset: 0 } });\n  const renewalsQ = useRenewalEvents({ upcomingOnly: true });\n\n  const relationships = useMemo(() => relationshipsQ.data?.items ?? [], [relationshipsQ.data]);\n  const invoices = useMemo(() => invoicesQ.data?.items ?? [], [invoicesQ.data]);\n  const messages = useMemo(() => inboxQ.data?.items ?? [], [inboxQ.data]);\n  const renewals = useMemo(() => renewalsQ.data ?? [], [renewalsQ.data]);\n\n  // Fast label lookup so renewal rows can name the relationship they belong to.\n  const relationshipById = useMemo(() => {\n    const map = new Map<string, SubRelationship>();\n    relationships.forEach((r) => map.set(r.id, r));\n    return map;\n  }, [relationships]);\n\n  const stats = useMemo(() => {\n    const active = relationships.filter((r) => r.status === 'ACTIVE' || r.status === 'TRIAL');\n    const monthlySpend = active.reduce(\n      (sum, r) => sum + r.amount * (MONTHLY_FACTOR[r.interval] ?? 1),\n      0\n    );\n    const primaryCurrency = active[0]?.currency ?? relationships[0]?.currency ?? 'USD';\n    // BOFF-8660 — KPI must match the Universal Inbox \"need action\" counter\n    // and the on-page Needs-attention list, both of which count by\n    // `actionRequired` alone (read state is irrelevant). The previous\n    // `&& !m.isRead` clause made the tile show 0 the moment the user read\n    // the only action-required message, contradicting the surfaces below.\n    const actionRequired = messages.filter((m) => m.actionRequired).length;\n    const openInvoices = invoices.filter(\n      (i) => i.status === 'ISSUED' || i.status === 'OVERDUE' || i.status === 'FAILED'\n    );\n    const openInvoiceTotal = openInvoices.reduce((sum, i) => sum + i.total, 0);\n    const atRisk = relationships.filter(\n      (r) => r.status === 'PAST_DUE' || r.status === 'LAPSED'\n    ).length;\n\n    return {\n      activeCount: active.length,\n      totalCount: relationships.length,\n      monthlySpend,\n      primaryCurrency,\n      actionRequired,\n      openInvoiceCount: openInvoices.length,\n      openInvoiceTotal,\n      atRisk,\n    };\n  }, [relationships, messages, invoices]);\n\n  // Portfolio-by-status → donut segments (grouped from real relationships).\n  const statusSegments = useMemo<Segment[]>(() => {\n    const counts = new Map<string, number>();\n    relationships.forEach((r) => counts.set(r.status, (counts.get(r.status) ?? 0) + 1));\n    return Array.from(counts.entries())\n      .sort((a, b) => b[1] - a[1])\n      .map(([status, value]) => ({ label: formatEnumLabel(status), value }));\n  }, [relationships]);\n\n  // Normalize upcoming renewals: prefer real renewal events, fall back to\n  // relationship `renewsAt` when the event stream is empty. Sorted soonest-first.\n  const upcoming = useMemo<UpcomingRenewal[]>(() => {\n    const now = Date.now();\n    const fromEvents: UpcomingRenewal[] = renewals.map((e: SubRenewalEvent) => {\n      const rel = relationshipById.get(e.relationshipId);\n      const t = new Date(e.occursAt).getTime();\n      return {\n        id: e.id,\n        relationshipId: e.relationshipId,\n        title: rel?.label ?? formatEnumLabel(e.eventType),\n        when: e.occursAt,\n        amount: e.amount ?? rel?.amount ?? null,\n        currency: e.currency ?? rel?.currency ?? null,\n        soon: !Number.isNaN(t) && t - now <= 7 * MS_PER_DAY,\n      };\n    });\n\n    if (fromEvents.length > 0) {\n      return fromEvents\n        .filter((u) => !Number.isNaN(new Date(u.when).getTime()))\n        .sort((a, b) => new Date(a.when).getTime() - new Date(b.when).getTime());\n    }\n\n    // Derive from relationships that carry a future renewal date.\n    return relationships\n      .filter((r) => {\n        if (!r.renewsAt) return false;\n        const t = new Date(r.renewsAt).getTime();\n        return !Number.isNaN(t) && t >= now;\n      })\n      .map((r) => {\n        const t = new Date(r.renewsAt as string).getTime();\n        return {\n          id: r.id,\n          relationshipId: r.id,\n          title: r.label,\n          when: r.renewsAt as string,\n          amount: r.amount,\n          currency: r.currency,\n          soon: t - now <= 7 * MS_PER_DAY,\n        };\n      })\n      .sort((a, b) => new Date(a.when).getTime() - new Date(b.when).getTime());\n  }, [renewals, relationships, relationshipById]);\n\n  const timelineItems = useMemo<TimelineItem[]>(\n    () =>\n      upcoming.slice(0, 6).map((u) => ({\n        title: u.title,\n        sub: formatRelativeTime(u.when),\n        tone: u.soon ? 'warning' : 'default',\n        meta:\n          u.amount != null\n            ? formatCurrency(u.amount, u.currency ?? stats.primaryCurrency, {\n                maximumFractionDigits: 0,\n              })\n            : undefined,\n      })),\n    [upcoming, stats.primaryCurrency]\n  );\n\n  const actionMessages = useMemo(() => messages.filter((m) => m.actionRequired), [messages]);\n\n  const isLoading =\n    relationshipsQ.isLoading || invoicesQ.isLoading || inboxQ.isLoading || renewalsQ.isLoading;\n  const isError =\n    relationshipsQ.isError && invoicesQ.isError && inboxQ.isError && renewalsQ.isError;\n\n  if (isLoading) {\n    return (\n      <PageLayout\n        title={tr('dashboard.title', 'Overview')}\n        description={tr(\n          'dashboard.description',\n          'Your recurring digital relationships at a glance'\n        )}\n      >\n        <LoadingView label={tr('dashboard.loading', 'Loading your subscription portfolio…')} />\n      </PageLayout>\n    );\n  }\n\n  if (isError) {\n    return (\n      <PageLayout\n        title={tr('dashboard.title', 'Overview')}\n        description={tr(\n          'dashboard.description',\n          'Your recurring digital relationships at a glance'\n        )}\n      >\n        <ErrorView\n          message={tr(\n            'dashboard.error',\n            \"We couldn't reach the Subscriber Bot service. Please try again.\"\n          )}\n          onRetry={() => {\n            void relationshipsQ.refetch();\n            void invoicesQ.refetch();\n            void inboxQ.refetch();\n            void renewalsQ.refetch();\n          }}\n        />\n      </PageLayout>\n    );\n  }\n\n  const greetingName = currentUser?.firstName || currentUser?.name?.split(' ')[0];\n\n  const quickActions = [\n    {\n      labelKey: 'dashboard.quickActions.addRelationship.label',\n      descriptionKey: 'dashboard.quickActions.addRelationship.description',\n      fallbackLabel: 'Add a relationship',\n      fallbackDescription: 'Track a new subscription',\n      icon: <Repeat2 className=\"h-5 w-5\" />,\n      path: '/relationships/new',\n    },\n    {\n      labelKey: 'dashboard.quickActions.discoverProviders.label',\n      descriptionKey: 'dashboard.quickActions.discoverProviders.description',\n      fallbackLabel: 'Discover providers',\n      fallbackDescription: 'Browse the registry',\n      icon: <Sparkles className=\"h-5 w-5\" />,\n      path: '/providers',\n    },\n    {\n      labelKey: 'dashboard.quickActions.openInbox.label',\n      descriptionKey: 'dashboard.quickActions.openInbox.description',\n      fallbackLabel: 'Open inbox',\n      fallbackDescription: 'Merged communications',\n      icon: <Inbox className=\"h-5 w-5\" />,\n      path: '/inbox',\n    },\n    {\n      labelKey: 'dashboard.quickActions.configureAgents.label',\n      descriptionKey: 'dashboard.quickActions.configureAgents.description',\n      fallbackLabel: 'Configure agents',\n      fallbackDescription: 'Automate your portfolio',\n      icon: <Bot className=\"h-5 w-5\" />,\n      path: '/agents',\n    },\n  ];\n\n  return (\n    <PageLayout\n      title={\n        greetingName\n          ? tr('dashboard.welcomeBack', 'Welcome back, {{name}}', { name: greetingName })\n          : tr('dashboard.title', 'Overview')\n      }\n      description={tr(\n        'dashboard.description',\n        'Everything you pay for on repeat — in one intelligent console.'\n      )}\n    >\n      <PagePurpose className=\"mb-6\">\n        {tr(\n          'dashboard.purpose',\n          'Subscriber Bot is your system of record for every recurring digital relationship. See total recurring spend, what renews next, what needs action, and what to optimize — all from real data across your providers.'\n        )}\n      </PagePurpose>\n\n      {/* KPI tiles */}\n      <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n        <MetricsCard\n          featured\n          icon={<Wallet />}\n          value={formatCurrency(stats.monthlySpend, stats.primaryCurrency, {\n            maximumFractionDigits: 0,\n          })}\n          label={tr('dashboard.metrics.recurringSpend', 'Recurring spend / month')}\n        />\n        <MetricsCard\n          icon={<Repeat2 />}\n          value={stats.activeCount}\n          label={tr('dashboard.metrics.activeRelationships', 'Active relationships')}\n        />\n        <MetricsCard\n          icon={<CalendarClock />}\n          value={upcoming.length}\n          label={tr('dashboard.metrics.upcomingRenewals', 'Upcoming renewals')}\n        />\n        <MetricsCard\n          icon={<AlertTriangle />}\n          value={stats.actionRequired}\n          label={tr('dashboard.metrics.needsAction', 'Need your action')}\n          trend={stats.actionRequired > 0 ? 'down' : undefined}\n        />\n      </div>\n\n      {/* Main console: renewals (left) + portfolio donut & needs-attention (right) */}\n      <div className=\"mt-8 grid grid-cols-1 gap-6 lg:grid-cols-3\">\n        {/* Upcoming renewals timeline — spans two columns on desktop */}\n        <div className=\"lg:col-span-2\">\n          <Section\n            title={tr('dashboard.renewals.title', 'Upcoming renewals')}\n            description={tr(\n              'dashboard.renewals.description',\n              \"What's charging next across your portfolio\"\n            )}\n            className=\"mt-0\"\n            action={\n              <button\n                type=\"button\"\n                onClick={() => navigateTo('/relationships')}\n                className=\"inline-flex items-center gap-1 text-sm font-medium text-text-link hover:underline\"\n              >\n                {tr('common.viewAll', 'View all')} <ArrowUpRight className=\"h-3.5 w-3.5\" />\n              </button>\n            }\n          >\n            <GlassCard treatment=\"plain\" className=\"p-5\">\n              {timelineItems.length === 0 ? (\n                <EmptyState\n                  illustration=\"empty-calendar\"\n                  title={tr('dashboard.renewals.emptyTitle', 'No upcoming renewals')}\n                  description={tr(\n                    'dashboard.renewals.emptyDescription',\n                    'Renewals you track will appear here ahead of time.'\n                  )}\n                />\n              ) : (\n                <Timeline items={timelineItems} />\n              )}\n            </GlassCard>\n          </Section>\n        </div>\n\n        {/* Right rail: portfolio-by-status donut + needs-attention panel */}\n        <div className=\"flex flex-col gap-6\">\n          <Section\n            title={tr('dashboard.portfolio.title', 'Portfolio by status')}\n            description={tr('dashboard.portfolio.description', 'Where your relationships stand')}\n            className=\"mt-0\"\n          >\n            <GlassCard treatment=\"glass\" className=\"p-5\">\n              {statusSegments.length === 0 ? (\n                <EmptyState\n                  illustration=\"empty-data\"\n                  title={tr('dashboard.portfolio.emptyTitle', 'No relationships yet')}\n                  description={tr(\n                    'dashboard.portfolio.emptyDescription',\n                    'Add your first subscription to see the breakdown.'\n                  )}\n                  action={\n                    <button\n                      type=\"button\"\n                      onClick={() => navigateTo('/relationships/new')}\n                      className=\"rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:opacity-90\"\n                    >\n                      {tr('dashboard.portfolio.addRelationship', 'Add relationship')}\n                    </button>\n                  }\n                />\n              ) : (\n                <div className=\"flex flex-col items-center gap-5 sm:flex-row sm:items-center lg:flex-col xl:flex-row\">\n                  <Donut\n                    data={statusSegments}\n                    size={148}\n                    thickness={20}\n                    centerLabel={String(stats.totalCount)}\n                    centerSub={tr(\n                      stats.totalCount === 1\n                        ? 'dashboard.portfolio.relationshipSingular'\n                        : 'dashboard.portfolio.relationshipPlural',\n                      stats.totalCount === 1 ? 'relationship' : 'relationships'\n                    )}\n                    className=\"shrink-0\"\n                  />\n                  <Legend data={statusSegments} className=\"w-full min-w-0 flex-1\" />\n                </div>\n              )}\n            </GlassCard>\n          </Section>\n\n          <Section\n            title={tr('dashboard.needsAttention.title', 'Needs attention')}\n            description={tr(\n              'dashboard.needsAttention.description',\n              'Required actions from the Universal Inbox'\n            )}\n            className=\"mt-0\"\n            action={\n              <button\n                type=\"button\"\n                onClick={() => navigateTo('/inbox')}\n                className=\"text-sm font-medium text-text-link hover:underline\"\n              >\n                {tr('dashboard.needsAttention.openInbox', 'Open inbox')}\n              </button>\n            }\n          >\n            <GlassCard treatment=\"plain\" className=\"p-3\">\n              {actionMessages.length === 0 ? (\n                <div className=\"flex items-center gap-3 px-2 py-4\">\n                  <span className=\"flex size-10 shrink-0 items-center justify-center rounded-lg bg-status-success-bg-subtle text-status-success-text\">\n                    <ShieldCheck className=\"h-5 w-5\" />\n                  </span>\n                  <div className=\"min-w-0\">\n                    <p className=\"text-sm font-medium text-text-primary\">\n                      {tr('dashboard.needsAttention.allCaughtUp', \"You're all caught up\")}\n                    </p>\n                    <p className=\"text-xs text-text-secondary\">\n                      {tr(\n                        'dashboard.needsAttention.allCaughtUpDescription',\n                        'Required actions across your channels will surface here.'\n                      )}\n                    </p>\n                  </div>\n                </div>\n              ) : (\n                <ul className=\"space-y-1\">\n                  {actionMessages.slice(0, 5).map((message) => (\n                    <li key={message.id}>\n                      <button\n                        type=\"button\"\n                        onClick={() => navigateTo('/inbox')}\n                        className=\"flex w-full items-center gap-3 rounded-lg border-l-2 border-status-warning-text/60 bg-status-warning-bg-subtle/50 p-3 text-left transition-colors hover:bg-status-warning-bg-subtle\"\n                      >\n                        <div className=\"min-w-0 flex-1\">\n                          <p className=\"truncate text-sm font-medium text-text-primary\">\n                            {message.subject ||\n                              tr('dashboard.needsAttention.noSubject', '(no subject)')}\n                          </p>\n                          {message.preview && (\n                            <p className=\"truncate text-xs text-text-secondary\">\n                              {message.preview}\n                            </p>\n                          )}\n                        </div>\n                        <StatusBadge status={message.category} className=\"shrink-0\" />\n                      </button>\n                    </li>\n                  ))}\n                </ul>\n              )}\n            </GlassCard>\n          </Section>\n        </div>\n      </div>\n\n      {/* Open-invoice call-out (only when there is real outstanding balance) */}\n      {stats.openInvoiceCount > 0 && (\n        <button\n          type=\"button\"\n          onClick={() => navigateTo('/invoices')}\n          className=\"mt-6 flex w-full items-center justify-between gap-3 rounded-xl border border-status-warning-text/30 bg-status-warning-bg-subtle px-5 py-4 text-left transition-shadow hover:shadow-md\"\n        >\n          <div className=\"flex items-center gap-3\">\n            <AlertTriangle className=\"h-5 w-5 shrink-0 text-status-warning-text\" />\n            <span className=\"text-sm font-medium text-status-warning-text\">\n              {tr(\n                'dashboard.openInvoices.label',\n                '{{count}} open invoice · {{amount}} outstanding',\n                {\n                  count: stats.openInvoiceCount,\n                  amount: formatCurrency(stats.openInvoiceTotal, stats.primaryCurrency),\n                }\n              )}\n            </span>\n          </div>\n          <ArrowRight className=\"h-4 w-4 shrink-0 text-status-warning-text\" />\n        </button>\n      )}\n\n      {/* Quick actions */}\n      <Section\n        title={tr('dashboard.quickActions.title', 'Quick actions')}\n        description={tr('dashboard.quickActions.description', 'Jump straight into your workflow')}\n      >\n        <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4\">\n          {quickActions.map((qa) => (\n            <button\n              key={qa.path}\n              type=\"button\"\n              onClick={() => navigateTo(qa.path)}\n              className=\"group flex items-center gap-3 rounded-xl border border-border-subtle bg-bg-surface p-4 text-left transition-all hover:-translate-y-0.5 hover:border-border-seam hover:shadow-md\"\n            >\n              <span className=\"flex size-10 shrink-0 items-center justify-center rounded-lg bg-[var(--color-accent-soft)] text-text-primary\">\n                {qa.icon}\n              </span>\n              <span className=\"min-w-0 flex-1\">\n                <span className=\"block text-sm font-medium text-text-primary\">\n                  {tr(qa.labelKey, qa.fallbackLabel)}\n                </span>\n                <span className=\"block text-xs text-text-secondary\">\n                  {tr(qa.descriptionKey, qa.fallbackDescription)}\n                </span>\n              </span>\n              <ArrowRight className=\"h-4 w-4 shrink-0 text-text-secondary transition-transform group-hover:translate-x-0.5\" />\n            </button>\n          ))}\n        </div>\n      </Section>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"DashboardPage.js","names":[],"sources":["../../../src/subscriberbot/pages/DashboardPage.tsx"],"sourcesContent":["/**\n * Dashboard / Overview\n * @module subscriberbot/pages\n *\n * The Subscriber Bot landing page: a premium fintech console over every\n * recurring digital relationship — total recurring spend, portfolio-by-status,\n * upcoming renewals, the action-required inbox, and outstanding invoices. Every\n * number and chart is COMPUTED from real data returned by\n * `wspace-subscriberbot-svc` — nothing is mocked.\n */\n\nimport { useMemo } from 'react';\nimport {\n  Repeat2,\n  Wallet,\n  CalendarClock,\n  Inbox,\n  AlertTriangle,\n  ArrowRight,\n  ArrowUpRight,\n  Sparkles,\n  Bot,\n  ShieldCheck,\n} from 'lucide-react';\nimport { PagePurpose, GlassCard } from '@burdenoff/fe-libs/ui';\nimport {\n  PageLayout,\n  MetricsCard,\n  StatusBadge,\n  EmptyState,\n  LoadingView,\n  ErrorView,\n  Section,\n  Donut,\n  Legend,\n  Timeline,\n  type Segment,\n  type TimelineItem,\n} from '../components';\nimport { useSubscriberBot } from '../context/SubscriberBotContext';\nimport {\n  useRelationships,\n  useInvoices,\n  useInboxMessages,\n  useRenewalEvents,\n} from '../hooks/useSubscriberBotApi';\nimport { useTr } from '../hooks/useTr';\nimport { formatCurrency, formatRelativeTime, formatEnumLabel } from '../utils/formatters';\nimport type { SubBillingInterval, SubRelationship, SubRenewalEvent } from '../types';\n\n// Normalize any billing interval to an approximate monthly multiplier so we can\n// express total recurring spend as one comparable \"per month\" number.\nconst MONTHLY_FACTOR: Record<SubBillingInterval, number> = {\n  DAILY: 30,\n  WEEKLY: 4.345,\n  MONTHLY: 1,\n  QUARTERLY: 1 / 3,\n  YEARLY: 1 / 12,\n  LIFETIME: 0,\n  FREE: 0,\n  USAGE_BASED: 1,\n};\n\n// A single normalized \"what charges next\" row, sourced from real renewal events\n// when present, otherwise derived from each relationship's own `renewsAt`.\ninterface UpcomingRenewal {\n  id: string;\n  relationshipId: string;\n  title: string;\n  when: string;\n  amount: number | null;\n  currency: string | null;\n  soon: boolean;\n}\n\nconst MS_PER_DAY = 1000 * 60 * 60 * 24;\n\nexport function DashboardPage() {\n  const { navigateTo, currentUser } = useSubscriberBot();\n  const tr = useTr();\n\n  const relationshipsQ = useRelationships({ pagination: { limit: 100, offset: 0 } });\n  const invoicesQ = useInvoices({ pagination: { limit: 50, offset: 0 } });\n  const inboxQ = useInboxMessages({ pagination: { limit: 50, offset: 0 } });\n  const renewalsQ = useRenewalEvents({ upcomingOnly: true });\n\n  const relationships = useMemo(() => relationshipsQ.data?.items ?? [], [relationshipsQ.data]);\n  const invoices = useMemo(() => invoicesQ.data?.items ?? [], [invoicesQ.data]);\n  const messages = useMemo(() => inboxQ.data?.items ?? [], [inboxQ.data]);\n  const renewals = useMemo(() => renewalsQ.data ?? [], [renewalsQ.data]);\n\n  // Fast label lookup so renewal rows can name the relationship they belong to.\n  const relationshipById = useMemo(() => {\n    const map = new Map<string, SubRelationship>();\n    relationships.forEach((r) => map.set(r.id, r));\n    return map;\n  }, [relationships]);\n\n  const stats = useMemo(() => {\n    const active = relationships.filter((r) => r.status === 'ACTIVE' || r.status === 'TRIAL');\n    const monthlySpend = active.reduce(\n      (sum, r) => sum + r.amount * (MONTHLY_FACTOR[r.interval] ?? 1),\n      0\n    );\n    const primaryCurrency = active[0]?.currency ?? relationships[0]?.currency ?? 'USD';\n    // BOFF-8660 — KPI must match the Universal Inbox \"need action\" counter\n    // and the on-page Needs-attention list, both of which count by\n    // `actionRequired` alone (read state is irrelevant). The previous\n    // `&& !m.isRead` clause made the tile show 0 the moment the user read\n    // the only action-required message, contradicting the surfaces below.\n    const actionRequired = messages.filter((m) => m.actionRequired).length;\n    const openInvoices = invoices.filter(\n      (i) => i.status === 'ISSUED' || i.status === 'OVERDUE' || i.status === 'FAILED'\n    );\n    const openInvoiceTotal = openInvoices.reduce((sum, i) => sum + i.total, 0);\n    const atRisk = relationships.filter(\n      (r) => r.status === 'PAST_DUE' || r.status === 'LAPSED'\n    ).length;\n\n    return {\n      activeCount: active.length,\n      totalCount: relationships.length,\n      monthlySpend,\n      primaryCurrency,\n      actionRequired,\n      openInvoiceCount: openInvoices.length,\n      openInvoiceTotal,\n      atRisk,\n    };\n  }, [relationships, messages, invoices]);\n\n  // Portfolio-by-status → donut segments (grouped from real relationships).\n  const statusSegments = useMemo<Segment[]>(() => {\n    const counts = new Map<string, number>();\n    relationships.forEach((r) => counts.set(r.status, (counts.get(r.status) ?? 0) + 1));\n    return Array.from(counts.entries())\n      .sort((a, b) => b[1] - a[1])\n      .map(([status, value]) => ({ label: formatEnumLabel(status), value }));\n  }, [relationships]);\n\n  // Normalize upcoming renewals: prefer real renewal events, fall back to\n  // relationship `renewsAt` when the event stream is empty. Sorted soonest-first.\n  const upcoming = useMemo<UpcomingRenewal[]>(() => {\n    const now = Date.now();\n    const fromEvents: UpcomingRenewal[] = renewals.map((e: SubRenewalEvent) => {\n      const rel = relationshipById.get(e.relationshipId);\n      const t = new Date(e.occursAt).getTime();\n      return {\n        id: e.id,\n        relationshipId: e.relationshipId,\n        title: rel?.label ?? formatEnumLabel(e.eventType),\n        when: e.occursAt,\n        amount: e.amount ?? rel?.amount ?? null,\n        currency: e.currency ?? rel?.currency ?? null,\n        soon: !Number.isNaN(t) && t - now <= 7 * MS_PER_DAY,\n      };\n    });\n\n    if (fromEvents.length > 0) {\n      return fromEvents\n        .filter((u) => !Number.isNaN(new Date(u.when).getTime()))\n        .sort((a, b) => new Date(a.when).getTime() - new Date(b.when).getTime());\n    }\n\n    // Derive from relationships that carry a future renewal date.\n    return relationships\n      .filter((r) => {\n        if (!r.renewsAt) return false;\n        const t = new Date(r.renewsAt).getTime();\n        return !Number.isNaN(t) && t >= now;\n      })\n      .map((r) => {\n        const t = new Date(r.renewsAt as string).getTime();\n        return {\n          id: r.id,\n          relationshipId: r.id,\n          title: r.label,\n          when: r.renewsAt as string,\n          amount: r.amount,\n          currency: r.currency,\n          soon: t - now <= 7 * MS_PER_DAY,\n        };\n      })\n      .sort((a, b) => new Date(a.when).getTime() - new Date(b.when).getTime());\n  }, [renewals, relationships, relationshipById]);\n\n  const timelineItems = useMemo<TimelineItem[]>(\n    () =>\n      upcoming.slice(0, 6).map((u) => ({\n        title: u.title,\n        sub: formatRelativeTime(u.when),\n        tone: u.soon ? 'warning' : 'default',\n        meta:\n          u.amount != null\n            ? formatCurrency(u.amount, u.currency ?? stats.primaryCurrency, {\n                maximumFractionDigits: 0,\n              })\n            : undefined,\n      })),\n    [upcoming, stats.primaryCurrency]\n  );\n\n  const actionMessages = useMemo(() => messages.filter((m) => m.actionRequired), [messages]);\n\n  const isLoading =\n    relationshipsQ.isLoading || invoicesQ.isLoading || inboxQ.isLoading || renewalsQ.isLoading;\n  const isError =\n    relationshipsQ.isError && invoicesQ.isError && inboxQ.isError && renewalsQ.isError;\n\n  if (isLoading) {\n    return (\n      <PageLayout\n        title={tr('dashboard.title', 'Overview')}\n        description={tr(\n          'dashboard.description',\n          'Your recurring digital relationships at a glance'\n        )}\n      >\n        <LoadingView label={tr('dashboard.loading', 'Loading your subscription portfolio…')} />\n      </PageLayout>\n    );\n  }\n\n  if (isError) {\n    return (\n      <PageLayout\n        title={tr('dashboard.title', 'Overview')}\n        description={tr(\n          'dashboard.description',\n          'Your recurring digital relationships at a glance'\n        )}\n      >\n        <ErrorView\n          message={tr(\n            'dashboard.error',\n            \"We couldn't reach the Subscriber Bot service. Please try again.\"\n          )}\n          onRetry={() => {\n            void relationshipsQ.refetch();\n            void invoicesQ.refetch();\n            void inboxQ.refetch();\n            void renewalsQ.refetch();\n          }}\n        />\n      </PageLayout>\n    );\n  }\n\n  const greetingName = currentUser?.firstName || currentUser?.name?.split(' ')[0];\n\n  const quickActions = [\n    {\n      labelKey: 'dashboard.quickActions.addRelationship.label',\n      descriptionKey: 'dashboard.quickActions.addRelationship.description',\n      fallbackLabel: 'Add a relationship',\n      fallbackDescription: 'Track a new subscription',\n      icon: <Repeat2 className=\"h-5 w-5\" />,\n      path: '/relationships/new',\n    },\n    {\n      labelKey: 'dashboard.quickActions.discoverProviders.label',\n      descriptionKey: 'dashboard.quickActions.discoverProviders.description',\n      fallbackLabel: 'Discover providers',\n      fallbackDescription: 'Browse the registry',\n      icon: <Sparkles className=\"h-5 w-5\" />,\n      path: '/providers',\n    },\n    {\n      labelKey: 'dashboard.quickActions.openInbox.label',\n      descriptionKey: 'dashboard.quickActions.openInbox.description',\n      fallbackLabel: 'Open inbox',\n      fallbackDescription: 'Merged communications',\n      icon: <Inbox className=\"h-5 w-5\" />,\n      path: '/inbox',\n    },\n    {\n      labelKey: 'dashboard.quickActions.configureAgents.label',\n      descriptionKey: 'dashboard.quickActions.configureAgents.description',\n      fallbackLabel: 'Configure agents',\n      fallbackDescription: 'Automate your portfolio',\n      icon: <Bot className=\"h-5 w-5\" />,\n      path: '/agents',\n    },\n  ];\n\n  return (\n    <PageLayout\n      title={\n        greetingName\n          ? tr('dashboard.welcomeBack', 'Welcome back, {{name}}', { name: greetingName })\n          : tr('dashboard.title', 'Overview')\n      }\n      description={tr(\n        'dashboard.description',\n        'Everything you pay for on repeat — in one intelligent console.'\n      )}\n    >\n      <PagePurpose className=\"mb-6\">\n        {tr(\n          'dashboard.purpose',\n          'Subscriber Bot is your system of record for every recurring digital relationship. See total recurring spend, what renews next, what needs action, and what to optimize — all from real data across your providers.'\n        )}\n      </PagePurpose>\n\n      {/* KPI tiles */}\n      <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n        <MetricsCard\n          featured\n          icon={<Wallet />}\n          value={formatCurrency(stats.monthlySpend, stats.primaryCurrency, {\n            maximumFractionDigits: 0,\n          })}\n          label={tr('dashboard.metrics.recurringSpend', 'Recurring spend / month')}\n        />\n        <MetricsCard\n          icon={<Repeat2 />}\n          value={stats.activeCount}\n          label={tr('dashboard.metrics.activeRelationships', 'Active relationships')}\n        />\n        <MetricsCard\n          icon={<CalendarClock />}\n          value={upcoming.length}\n          label={tr('dashboard.metrics.upcomingRenewals', 'Upcoming renewals')}\n        />\n        <MetricsCard\n          icon={<AlertTriangle />}\n          value={stats.actionRequired}\n          label={tr('dashboard.metrics.needsAction', 'Need your action')}\n          trend={stats.actionRequired > 0 ? 'down' : undefined}\n        />\n      </div>\n\n      {/* Main console: renewals (left) + portfolio donut & needs-attention (right) */}\n      <div className=\"mt-8 grid grid-cols-1 gap-6 lg:grid-cols-3\">\n        {/* Upcoming renewals timeline — spans two columns on desktop */}\n        <div className=\"lg:col-span-2\">\n          <Section\n            title={tr('dashboard.renewals.title', 'Upcoming renewals')}\n            description={tr(\n              'dashboard.renewals.description',\n              \"What's charging next across your portfolio\"\n            )}\n            className=\"mt-0\"\n            action={\n              <button\n                type=\"button\"\n                onClick={() => navigateTo('/relationships')}\n                className=\"inline-flex items-center gap-1 text-sm font-medium text-text-link hover:underline\"\n              >\n                {tr('common.viewAll', 'View all')} <ArrowUpRight className=\"h-3.5 w-3.5\" />\n              </button>\n            }\n          >\n            <GlassCard treatment=\"plain\" className=\"p-5\">\n              {timelineItems.length === 0 ? (\n                <EmptyState\n                  illustration=\"empty-calendar\"\n                  title={tr('dashboard.renewals.emptyTitle', 'No upcoming renewals')}\n                  description={tr(\n                    'dashboard.renewals.emptyDescription',\n                    'Renewals you track will appear here ahead of time.'\n                  )}\n                />\n              ) : (\n                <Timeline items={timelineItems} />\n              )}\n            </GlassCard>\n          </Section>\n        </div>\n\n        {/* Right rail: portfolio-by-status donut + needs-attention panel */}\n        <div className=\"flex flex-col gap-6\">\n          <Section\n            title={tr('dashboard.portfolio.title', 'Portfolio by status')}\n            description={tr('dashboard.portfolio.description', 'Where your relationships stand')}\n            className=\"mt-0\"\n          >\n            <GlassCard treatment=\"glass\" className=\"p-5\">\n              {statusSegments.length === 0 ? (\n                <EmptyState\n                  illustration=\"empty-data\"\n                  title={tr('dashboard.portfolio.emptyTitle', 'No relationships yet')}\n                  description={tr(\n                    'dashboard.portfolio.emptyDescription',\n                    'Add your first subscription to see the breakdown.'\n                  )}\n                  action={\n                    <button\n                      type=\"button\"\n                      onClick={() => navigateTo('/relationships/new')}\n                      className=\"rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:opacity-90\"\n                    >\n                      {tr('dashboard.portfolio.addRelationship', 'Add relationship')}\n                    </button>\n                  }\n                />\n              ) : (\n                <div className=\"flex flex-col items-center gap-5 sm:flex-row sm:items-center lg:flex-col xl:flex-row\">\n                  <Donut\n                    data={statusSegments}\n                    size={148}\n                    thickness={20}\n                    centerLabel={String(stats.totalCount)}\n                    centerSub={tr(\n                      stats.totalCount === 1\n                        ? 'dashboard.portfolio.relationshipSingular'\n                        : 'dashboard.portfolio.relationshipPlural',\n                      stats.totalCount === 1 ? 'relationship' : 'relationships'\n                    )}\n                    className=\"shrink-0\"\n                  />\n                  <Legend data={statusSegments} className=\"w-full min-w-0 flex-1\" />\n                </div>\n              )}\n            </GlassCard>\n          </Section>\n\n          <Section\n            title={tr('dashboard.needsAttention.title', 'Needs attention')}\n            description={tr(\n              'dashboard.needsAttention.description',\n              'Required actions from the Universal Inbox'\n            )}\n            className=\"mt-0\"\n            action={\n              <button\n                type=\"button\"\n                onClick={() => navigateTo('/inbox')}\n                className=\"text-sm font-medium text-text-link hover:underline\"\n              >\n                {tr('dashboard.needsAttention.openInbox', 'Open inbox')}\n              </button>\n            }\n          >\n            <GlassCard treatment=\"plain\" className=\"p-3\">\n              {actionMessages.length === 0 ? (\n                <div className=\"flex items-center gap-3 px-2 py-4\">\n                  <span className=\"flex size-10 shrink-0 items-center justify-center rounded-lg bg-status-success-bg-subtle text-status-success-text\">\n                    <ShieldCheck className=\"h-5 w-5\" />\n                  </span>\n                  <div className=\"min-w-0\">\n                    <p className=\"text-sm font-medium text-text-primary\">\n                      {tr('dashboard.needsAttention.allCaughtUp', \"You're all caught up\")}\n                    </p>\n                    <p className=\"text-xs text-text-secondary\">\n                      {tr(\n                        'dashboard.needsAttention.allCaughtUpDescription',\n                        'Required actions across your channels will surface here.'\n                      )}\n                    </p>\n                  </div>\n                </div>\n              ) : (\n                <ul className=\"space-y-1\">\n                  {actionMessages.slice(0, 5).map((message) => (\n                    <li key={message.id}>\n                      <button\n                        type=\"button\"\n                        onClick={() => navigateTo('/inbox')}\n                        className=\"flex w-full items-center gap-3 rounded-lg border-l-2 border-status-warning-text/60 bg-status-warning-bg-subtle/50 p-3 text-left transition-colors hover:bg-status-warning-bg-subtle\"\n                      >\n                        <div className=\"min-w-0 flex-1\">\n                          <p className=\"truncate text-sm font-medium text-text-primary\">\n                            {message.subject ||\n                              tr('dashboard.needsAttention.noSubject', '(no subject)')}\n                          </p>\n                          {message.preview && (\n                            <p className=\"truncate text-xs text-text-secondary\">\n                              {message.preview}\n                            </p>\n                          )}\n                        </div>\n                        <StatusBadge status={message.category} className=\"shrink-0\" />\n                      </button>\n                    </li>\n                  ))}\n                </ul>\n              )}\n            </GlassCard>\n          </Section>\n        </div>\n      </div>\n\n      {/* Open-invoice call-out (only when there is real outstanding balance) */}\n      {stats.openInvoiceCount > 0 && (\n        <button\n          type=\"button\"\n          onClick={() => navigateTo('/invoices')}\n          className=\"mt-6 flex w-full items-center justify-between gap-3 rounded-xl border border-status-warning-text/30 bg-status-warning-bg-subtle px-5 py-4 text-left transition-shadow hover:shadow-md\"\n        >\n          <div className=\"flex items-center gap-3\">\n            <AlertTriangle className=\"h-5 w-5 shrink-0 text-status-warning-text\" />\n            <span className=\"text-sm font-medium text-status-warning-text\">\n              {tr(\n                'dashboard.openInvoices.label',\n                '{{count}} open invoice · {{amount}} outstanding',\n                {\n                  count: stats.openInvoiceCount,\n                  amount: formatCurrency(stats.openInvoiceTotal, stats.primaryCurrency),\n                }\n              )}\n            </span>\n          </div>\n          <ArrowRight className=\"h-4 w-4 shrink-0 text-status-warning-text\" />\n        </button>\n      )}\n\n      {/* Quick actions */}\n      <Section\n        title={tr('dashboard.quickActions.title', 'Quick actions')}\n        description={tr('dashboard.quickActions.description', 'Jump straight into your workflow')}\n      >\n        <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4\">\n          {quickActions.map((qa) => (\n            <button\n              key={qa.path}\n              type=\"button\"\n              onClick={() => navigateTo(qa.path)}\n              className=\"group flex items-center gap-3 rounded-xl border border-border-subtle bg-bg-surface p-4 text-left transition-all hover:-translate-y-0.5 hover:border-border-seam hover:shadow-md\"\n            >\n              <span className=\"flex size-10 shrink-0 items-center justify-center rounded-lg bg-[var(--color-accent-soft)] text-text-primary\">\n                {qa.icon}\n              </span>\n              <span className=\"min-w-0 flex-1\">\n                <span className=\"block text-sm font-medium text-text-primary\">\n                  {tr(qa.labelKey, qa.fallbackLabel)}\n                </span>\n                <span className=\"block text-xs text-text-secondary\">\n                  {tr(qa.descriptionKey, qa.fallbackDescription)}\n                </span>\n              </span>\n              <ArrowRight className=\"h-4 w-4 shrink-0 text-text-secondary transition-transform group-hover:translate-x-0.5\" />\n            </button>\n          ))}\n        </div>\n      </Section>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}

package/dist/subscriberbot/pages/InboxPage.js

@@ -5,10 +5,10 @@ import { formatDateTime as r, formatEnumLabel as i, formatRelativeTime as a } fr
 import { StatusBadge as o } from "../components/StatusBadge.js";
 import { EmptyState as s } from "../components/EmptyState.js";
 import { Modal as c } from "../components/Modal.js";
-import { ErrorView as l, LoadingView as u, Section as d } from "../components/StateViews.js";
-import { MiniProgress as f } from "../components/viz.js";
-import { useChannels as p, useCreateChannel as m, useInboxMessages as h, useIngestMessage as g, useMarkMessageRead as _, useVerifyChannel as v } from "../hooks/useSubscriberBotApi.js";
-import { useTr as y } from "../hooks/useTr.js";
+import { useTr as l } from "../hooks/useTr.js";
+import { ErrorView as u, LoadingView as d, Section as f } from "../components/StateViews.js";
+import { MiniProgress as p } from "../components/viz.js";
+import { useChannels as m, useCreateChannel as h, useInboxMessages as g, useIngestMessage as _, useMarkMessageRead as v, useVerifyChannel as y } from "../hooks/useSubscriberBotApi.js";
 import { useState as b } from "react";
 import { AlertTriangle as x, BadgeCheck as S, Bell as C, ChevronRight as w, Hash as T, Inbox as E, Mail as D, MailOpen as O, MessageSquare as k, MessagesSquare as A, MousePointerClick as j, Phone as M, Plus as N, Radio as P, Send as F, ShieldAlert as I, Sparkles as L, Webhook as R } from "lucide-react";
 import { Fragment as z, jsx as B, jsxs as V } from "react/jsx-runtime";
@@ -103,7 +103,7 @@ function Z({ category: e }) {
 	});
 }
 function Q({ className: e }) {
-	let n = y();
+	let n = l();
 	return /* @__PURE__ */ V("span", {
 		title: n("inbox.message.actionRequiredTitle", "Action required"),
 		className: t("inline-flex items-center gap-1 rounded-full bg-status-warning-bg-subtle px-2 py-0.5 text-[10px] font-medium text-status-warning-text", e),
@@ -115,32 +115,32 @@ function Q({ className: e }) {
 	});
 }
 function ne({ onClose: e }) {
-	let t = y(), n = m(), [r, a] = b("EMAIL"), [o, s] = b(""), [l, u] = b(""), [d, f] = b(!0), [p, h] = b(null);
+	let t = l(), n = h(), [r, a] = b("EMAIL"), [o, s] = b(""), [u, d] = b(""), [f, p] = b(!0), [m, g] = b(null);
 	return /* @__PURE__ */ B(c, {
 		title: t("inbox.addChannelModal.title", "Add channel"),
 		onClose: e,
 		maxWidthClassName: "max-w-xl",
 		children: /* @__PURE__ */ V("form", {
 			onSubmit: (i) => {
-				if (i.preventDefault(), h(null), !o.trim()) {
-					h(t("inbox.addChannelModal.addressRequired", "An address is required."));
+				if (i.preventDefault(), g(null), !o.trim()) {
+					g(t("inbox.addChannelModal.addressRequired", "An address is required."));
 					return;
 				}
 				n.mutate({
 					type: r,
 					address: o.trim(),
-					ingestEnabled: d,
-					...l.trim() ? { label: l.trim() } : {}
+					ingestEnabled: f,
+					...u.trim() ? { label: u.trim() } : {}
 				}, {
 					onSuccess: () => e(),
-					onError: (e) => h(e instanceof Error ? e.message : t("inbox.addChannelModal.error", "Could not add channel."))
+					onError: (e) => g(e instanceof Error ? e.message : t("inbox.addChannelModal.error", "Could not add channel."))
 				});
 			},
 			className: "space-y-4",
 			children: [
-				p && /* @__PURE__ */ B("div", {
+				m && /* @__PURE__ */ B("div", {
 					className: "rounded-lg border border-status-error-text/30 bg-status-error-bg-subtle px-4 py-2 text-sm text-status-error-text",
-					children: p
+					children: m
 				}),
 				/* @__PURE__ */ V("div", {
 					className: "grid grid-cols-1 gap-4 sm:grid-cols-2",
@@ -164,8 +164,8 @@ function ne({ onClose: e }) {
 					}), /* @__PURE__ */ B("input", {
 						id: "ch-label",
 						type: "text",
-						value: l,
-						onChange: (e) => u(e.target.value),
+						value: u,
+						onChange: (e) => d(e.target.value),
 						placeholder: t("inbox.addChannelModal.labelPlaceholder", "e.g. Billing inbox"),
 						className: G
 					})] })]
@@ -194,8 +194,8 @@ function ne({ onClose: e }) {
 					className: "flex items-center gap-2 text-sm text-text-primary",
 					children: [/* @__PURE__ */ B("input", {
 						type: "checkbox",
-						checked: d,
-						onChange: (e) => f(e.target.checked),
+						checked: f,
+						onChange: (e) => p(e.target.checked),
 						className: "size-4 rounded border-border-subtle"
 					}), t("inbox.addChannelModal.ingestLabel", "Ingest messages from this channel")]
 				}),
@@ -218,30 +218,30 @@ function ne({ onClose: e }) {
 	});
 }
 function re({ channel: e, onClose: t }) {
-	let n = y(), r = g(), [a, o] = b(""), [s, l] = b(""), [u, d] = b("OTHER"), [f, p] = b(!1), [m, h] = b(null);
+	let n = l(), r = _(), [a, o] = b(""), [s, u] = b(""), [d, f] = b("OTHER"), [p, m] = b(!1), [h, g] = b(null);
 	return /* @__PURE__ */ B(c, {
 		title: n("inbox.logMessageModal.title", "Log test message"),
 		description: n("inbox.logMessageModal.description", "Simulate an ingested message from {channel}.", { channel: e.label || e.address }),
 		onClose: t,
 		children: /* @__PURE__ */ V("form", {
 			onSubmit: (i) => {
-				i.preventDefault(), h(null), r.mutate({
+				i.preventDefault(), g(null), r.mutate({
 					channelId: e.id,
 					receivedAt: (/* @__PURE__ */ new Date()).toISOString(),
-					category: u,
-					actionRequired: f,
+					category: d,
+					actionRequired: p,
 					...a.trim() ? { subject: a.trim() } : {},
 					...s.trim() ? { preview: s.trim() } : {}
 				}, {
 					onSuccess: () => t(),
-					onError: (e) => h(e instanceof Error ? e.message : n("inbox.logMessageModal.error", "Could not log the message."))
+					onError: (e) => g(e instanceof Error ? e.message : n("inbox.logMessageModal.error", "Could not log the message."))
 				});
 			},
 			className: "space-y-4",
 			children: [
-				m && /* @__PURE__ */ B("div", {
+				h && /* @__PURE__ */ B("div", {
 					className: "rounded-lg border border-status-error-text/30 bg-status-error-bg-subtle px-4 py-2 text-sm text-status-error-text",
-					children: m
+					children: h
 				}),
 				/* @__PURE__ */ V("div", { children: [/* @__PURE__ */ B("label", {
 					htmlFor: "msg-subject",
@@ -262,7 +262,7 @@ function re({ channel: e, onClose: t }) {
 				}), /* @__PURE__ */ B("textarea", {
 					id: "msg-preview",
 					value: s,
-					onChange: (e) => l(e.target.value),
+					onChange: (e) => u(e.target.value),
 					rows: 2,
 					className: G
 				})] }),
@@ -272,8 +272,8 @@ function re({ channel: e, onClose: t }) {
 					children: n("inbox.logMessageModal.categoryLabel", "Category")
 				}), /* @__PURE__ */ B("select", {
 					id: "msg-category",
-					value: u,
-					onChange: (e) => d(e.target.value),
+					value: d,
+					onChange: (e) => f(e.target.value),
 					className: G,
 					children: q.map((e) => /* @__PURE__ */ B("option", {
 						value: e,
@@ -284,8 +284,8 @@ function re({ channel: e, onClose: t }) {
 					className: "flex items-center gap-2 text-sm text-text-primary",
 					children: [/* @__PURE__ */ B("input", {
 						type: "checkbox",
-						checked: f,
-						onChange: (e) => p(e.target.checked),
+						checked: p,
+						onChange: (e) => m(e.target.checked),
 						className: "size-4 rounded border-border-subtle"
 					}), n("inbox.logMessageModal.actionRequired", "Requires action")]
 				}),
@@ -308,7 +308,7 @@ function re({ channel: e, onClose: t }) {
 	});
 }
 function ie({ channel: e, onVerify: t, verifying: n, onLog: r }) {
-	let a = y(), s = X[e.type] ?? P, c = e.status === "VERIFIED";
+	let a = l(), s = X[e.type] ?? P, c = e.status === "VERIFIED";
 	return /* @__PURE__ */ V(H, {
 		treatment: "metric",
 		className: "flex flex-col p-4",
@@ -377,8 +377,8 @@ function ie({ channel: e, onVerify: t, verifying: n, onLog: r }) {
 	});
 }
 function ae() {
-	let e = y(), { data: t, isLoading: n, isError: r, refetch: i } = p(), a = v(), [o, c] = b(!1), [f, m] = b(null), h = t ?? [], g = h.filter((e) => e.status === "VERIFIED").length, _ = h.filter((e) => e.status === "PENDING").length;
-	return /* @__PURE__ */ V(d, {
+	let e = l(), { data: t, isLoading: n, isError: r, refetch: i } = m(), a = y(), [o, c] = b(!1), [p, h] = b(null), g = t ?? [], _ = g.filter((e) => e.status === "VERIFIED").length, v = g.filter((e) => e.status === "PENDING").length;
+	return /* @__PURE__ */ V(f, {
 		title: e("inbox.channels.title", "Ingest channels"),
 		description: e("inbox.channels.description", "The sources the Universal Inbox pulls subscription communication from"),
 		action: /* @__PURE__ */ V("button", {
@@ -392,48 +392,48 @@ function ae() {
 			]
 		}),
 		children: [
-			n ? /* @__PURE__ */ B(u, { label: e("inbox.channels.loading", "Loading channels…") }) : r ? /* @__PURE__ */ B(l, {
+			n ? /* @__PURE__ */ B(d, { label: e("inbox.channels.loading", "Loading channels…") }) : r ? /* @__PURE__ */ B(u, {
 				message: e("inbox.channels.error", "Could not load channels."),
 				onRetry: () => void i()
-			}) : h.length === 0 ? /* @__PURE__ */ B(s, {
+			}) : g.length === 0 ? /* @__PURE__ */ B(s, {
 				illustration: "empty-data",
 				icon: /* @__PURE__ */ B(P, { className: "h-12 w-12" }),
 				title: e("inbox.channels.emptyTitle", "No channels yet"),
 				description: e("inbox.channels.emptyDescription", "Add an email, SMS, Slack or webhook channel to start ingesting subscription communication.")
-			}) : /* @__PURE__ */ V(z, { children: [(g > 0 || _ > 0) && /* @__PURE__ */ V("div", {
+			}) : /* @__PURE__ */ V(z, { children: [(_ > 0 || v > 0) && /* @__PURE__ */ V("div", {
 				className: "mb-3 flex flex-wrap items-center gap-x-4 gap-y-1 text-xs text-text-secondary",
 				children: [/* @__PURE__ */ V("span", {
 					className: "inline-flex items-center gap-1.5",
 					children: [/* @__PURE__ */ B("span", {
 						className: "size-1.5 rounded-full bg-status-success-text",
 						"aria-hidden": !0
-					}), e("inbox.channels.verified", "{{count}} verified", { count: g })]
-				}), _ > 0 && /* @__PURE__ */ V("span", {
+					}), e("inbox.channels.verified", "{{count}} verified", { count: _ })]
+				}), v > 0 && /* @__PURE__ */ V("span", {
 					className: "inline-flex items-center gap-1.5",
 					children: [/* @__PURE__ */ B("span", {
 						className: "size-1.5 rounded-full bg-status-warning-text",
 						"aria-hidden": !0
-					}), e("inbox.channels.pending", "{{count}} pending verification", { count: _ })]
+					}), e("inbox.channels.pending", "{{count}} pending verification", { count: v })]
 				})]
 			}), /* @__PURE__ */ B("div", {
 				className: "grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-3",
-				children: h.map((e) => /* @__PURE__ */ B(ie, {
+				children: g.map((e) => /* @__PURE__ */ B(ie, {
 					channel: e,
 					verifying: a.isPending,
 					onVerify: (e) => a.mutate(e),
-					onLog: (e) => m(e)
+					onLog: (e) => h(e)
 				}, e.id))
 			})] }),
 			o && /* @__PURE__ */ B(ne, { onClose: () => c(!1) }),
-			f && /* @__PURE__ */ B(re, {
-				channel: f,
-				onClose: () => m(null)
+			p && /* @__PURE__ */ B(re, {
+				channel: p,
+				onClose: () => h(null)
 			})
 		]
 	});
 }
 function oe({ message: e, active: n, onSelect: r, onMarkRead: i, markPending: o, onViewRelationship: s }) {
-	let c = y(), l = !e.isRead;
+	let c = l(), u = !e.isRead;
 	return /* @__PURE__ */ V("div", {
 		role: "button",
 		tabIndex: 0,
@@ -442,15 +442,15 @@ function oe({ message: e, active: n, onSelect: r, onMarkRead: i, markPending: o,
 		onKeyDown: (e) => {
 			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), r());
 		},
-		className: t("relative flex cursor-pointer items-start gap-3 p-4 transition-colors", "focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-focus-ring)] focus-visible:ring-inset", n ? "bg-bg-sunken" : l ? "bg-accent-wash" : "hover:bg-bg-sunken/60"),
+		className: t("relative flex cursor-pointer items-start gap-3 p-4 transition-colors", "focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-focus-ring)] focus-visible:ring-inset", n ? "bg-bg-sunken" : u ? "bg-accent-wash" : "hover:bg-bg-sunken/60"),
 		children: [
-			l && /* @__PURE__ */ B("span", {
+			u && /* @__PURE__ */ B("span", {
 				"aria-hidden": !0,
 				className: "absolute inset-y-0 left-0 w-0.5 bg-text-link"
 			}),
 			/* @__PURE__ */ B("span", {
 				className: "mt-0.5 shrink-0 text-text-secondary",
-				children: l ? /* @__PURE__ */ B(D, { className: "h-4 w-4 text-text-link" }) : /* @__PURE__ */ B(O, { className: "h-4 w-4" })
+				children: u ? /* @__PURE__ */ B(D, { className: "h-4 w-4 text-text-link" }) : /* @__PURE__ */ B(O, { className: "h-4 w-4" })
 			}),
 			/* @__PURE__ */ V("div", {
 				className: "min-w-0 flex-1",
@@ -458,12 +458,12 @@ function oe({ message: e, active: n, onSelect: r, onMarkRead: i, markPending: o,
 					/* @__PURE__ */ V("div", {
 						className: "flex items-center gap-2",
 						children: [
-							l && /* @__PURE__ */ B("span", {
+							u && /* @__PURE__ */ B("span", {
 								"aria-label": c("inbox.message.unreadAria", "Unread"),
 								className: "size-1.5 shrink-0 rounded-full bg-text-link"
 							}),
 							/* @__PURE__ */ B("p", {
-								className: t("min-w-0 flex-1 truncate text-sm", l ? "font-semibold text-text-primary" : "font-normal text-text-primary"),
+								className: t("min-w-0 flex-1 truncate text-sm", u ? "font-semibold text-text-primary" : "font-normal text-text-primary"),
 								children: e.subject || c("inbox.message.noSubject", "(no subject)")
 							}),
 							/* @__PURE__ */ B("span", {
@@ -489,7 +489,7 @@ function oe({ message: e, active: n, onSelect: r, onMarkRead: i, markPending: o,
 								className: "text-xs font-medium text-text-link hover:underline",
 								children: c("inbox.message.viewRelationship", "View relationship")
 							}),
-							l && /* @__PURE__ */ B("button", {
+							u && /* @__PURE__ */ B("button", {
 								type: "button",
 								disabled: o,
 								onClick: (e) => {
@@ -506,7 +506,7 @@ function oe({ message: e, active: n, onSelect: r, onMarkRead: i, markPending: o,
 	});
 }
 function se({ message: e, channel: t, onMarkRead: n, markPending: i, onViewRelationship: a }) {
-	let o = y();
+	let o = l();
 	if (!e) return /* @__PURE__ */ V(H, {
 		treatment: "metric",
 		className: "flex min-h-[20rem] flex-col items-center justify-center p-8 text-center",
@@ -574,7 +574,7 @@ function se({ message: e, channel: t, onMarkRead: n, markPending: i, onViewRelat
 						className: "tabular-nums text-text-secondary",
 						children: o("inbox.readingPane.confidence", "{{pct}}% confidence", { pct: c })
 					})]
-				}), /* @__PURE__ */ B(f, {
+				}), /* @__PURE__ */ B(p, {
 					value: c,
 					max: 100,
 					tone: c >= 66 ? "positive" : c >= 33 ? "accent" : "warning",
@@ -621,14 +621,14 @@ function $({ active: e, onClick: n, children: r, tone: i = "default" }) {
 	});
 }
 function ce() {
-	let r = y(), { navigateTo: i } = e(), [a, o] = b(0), [c, d] = b(""), [f, m] = b(!1), [g, v] = b(!1), [S, C] = b(null), { data: w, isLoading: T, isError: O, refetch: k, isFetching: A } = h({
+	let r = l(), { navigateTo: i } = e(), [a, o] = b(0), [c, f] = b(""), [p, h] = b(!1), [_, y] = b(!1), [S, C] = b(null), { data: w, isLoading: T, isError: O, refetch: k, isFetching: A } = g({
 		category: c || void 0,
-		unreadOnly: f || void 0,
+		unreadOnly: p || void 0,
 		pagination: {
 			limit: W,
 			offset: a * W
 		}
-	}), { data: j } = p(), M = _(), N = w?.items ?? [], P = w?.pageInfo.hasMore ?? !1, F = g ? N.filter((e) => e.actionRequired) : N, I = N.filter((e) => !e.isRead).length, L = N.filter((e) => e.actionRequired).length, R = new Map((j ?? []).map((e) => [e.id, e])), z = F.find((e) => e.id === S) ?? null, H = z ? R.get(z.channelId) : void 0, G = () => {
+	}), { data: j } = m(), M = v(), N = w?.items ?? [], P = w?.pageInfo.hasMore ?? !1, F = _ ? N.filter((e) => e.actionRequired) : N, I = N.filter((e) => !e.isRead).length, L = N.filter((e) => e.actionRequired).length, R = new Map((j ?? []).map((e) => [e.id, e])), z = F.find((e) => e.id === S) ?? null, H = z ? R.get(z.channelId) : void 0, G = () => {
 		o(0), C(null);
 	};
 	return /* @__PURE__ */ V(n, {
@@ -646,7 +646,7 @@ function ce() {
 					children: /* @__PURE__ */ B($, {
 						active: c === e.value,
 						onClick: () => {
-							d(e.value), G();
+							f(e.value), G();
 						},
 						children: r(e.key, e.fallback)
 					})
@@ -656,10 +656,10 @@ function ce() {
 				className: "mt-3 flex flex-wrap items-center gap-2",
 				children: [
 					/* @__PURE__ */ V($, {
-						active: g,
+						active: _,
 						tone: "warning",
 						onClick: () => {
-							v((e) => !e), C(null);
+							y((e) => !e), C(null);
 						},
 						children: [
 							/* @__PURE__ */ B(x, { className: "h-3.5 w-3.5" }),
@@ -668,9 +668,9 @@ function ce() {
 						]
 					}),
 					/* @__PURE__ */ V($, {
-						active: f,
+						active: p,
 						onClick: () => {
-							m((e) => !e), G();
+							h((e) => !e), G();
 						},
 						children: [
 							/* @__PURE__ */ B(D, { className: "h-3.5 w-3.5" }),
@@ -689,7 +689,7 @@ function ce() {
 					})
 				]
 			}),
-			T ? /* @__PURE__ */ B(u, { label: r("inbox.loading", "Loading inbox…") }) : O ? /* @__PURE__ */ B(l, {
+			T ? /* @__PURE__ */ B(d, { label: r("inbox.loading", "Loading inbox…") }) : O ? /* @__PURE__ */ B(u, {
 				message: r("inbox.error", "Could not load the inbox."),
 				onRetry: () => void k()
 			}) : N.length === 0 ? /* @__PURE__ */ B("div", {
@@ -698,7 +698,7 @@ function ce() {
 					illustration: "empty-inbox",
 					icon: /* @__PURE__ */ B(E, { className: "h-12 w-12" }),
 					title: r("inbox.emptyTitle", "Inbox is empty"),
-					description: f || c ? r("inbox.emptyDescriptionFiltered", "No messages match these filters.") : r("inbox.emptyDescription", "Merged subscription communications will appear here once channels start ingesting.")
+					description: p || c ? r("inbox.emptyDescriptionFiltered", "No messages match these filters.") : r("inbox.emptyDescription", "Merged subscription communications will appear here once channels start ingesting.")
 				})
 			}) : /* @__PURE__ */ V("div", {
 				className: "mt-5 grid grid-cols-1 gap-5 lg:grid-cols-[minmax(0,1fr)_380px]",

package/dist/subscriberbot/pages/InsightsPage.js

@@ -3,11 +3,11 @@ import { PageLayout as t } from "../components/PageLayout.js";
 import { MetricsCard as n } from "../components/MetricsCard.js";
 import { formatCurrency as r, formatEnumLabel as i } from "../utils/formatters.js";
 import { EmptyState as a } from "../components/EmptyState.js";
-import { ErrorView as o, LoadingView as s, Section as c } from "../components/StateViews.js";
-import { BarList as l, Donut as u, Legend as d, MiniProgress as f } from "../components/viz.js";
+import { useTr as o } from "../hooks/useTr.js";
+import { ErrorView as s, LoadingView as c, Section as l } from "../components/StateViews.js";
+import { BarList as u, Donut as d, Legend as f, MiniProgress as p } from "../components/viz.js";
 import "../components/index.js";
-import { useRelationships as p } from "../hooks/useSubscriberBotApi.js";
-import { useTr as m } from "../hooks/useTr.js";
+import { useRelationships as m } from "../hooks/useSubscriberBotApi.js";
 import { useMemo as h } from "react";
 import { CalendarClock as g, HeartPulse as _, Layers as v, TrendingUp as y, Wallet as b } from "lucide-react";
 import { Fragment as x, jsx as S, jsxs as C } from "react/jsx-runtime";
@@ -23,7 +23,7 @@ var E = {
 	FREE: 0,
 	USAGE_BASED: 1
 }, D = (e) => e.amount * (E[e.interval] ?? 1), O = (e) => e.status === "ACTIVE", k = () => {
-	let E = p({ pagination: { limit: 100 } }), k = m(), A = h(() => E.data?.items ?? [], [E.data]), j = h(() => {
+	let E = m({ pagination: { limit: 100 } }), k = o(), A = h(() => E.data?.items ?? [], [E.data]), j = h(() => {
 		let e = A.filter(O), t = e[0]?.currency ?? A[0]?.currency ?? "USD", n = e.reduce((e, t) => e + D(t), 0), r = A.filter((e) => e.healthScore != null), a = r.length ? r.reduce((e, t) => e + (t.healthScore ?? 0), 0) / r.length : null, o = /* @__PURE__ */ new Map();
 		for (let e of A) o.set(e.status, (o.get(e.status) ?? 0) + 1);
 		let s = /* @__PURE__ */ new Map();
@@ -67,8 +67,8 @@ var E = {
 			total: A.length
 		};
 	}, [A]);
-	if (E.isLoading) return /* @__PURE__ */ S(s, { label: k("insights.loading", "Crunching your spend insights…") });
-	if (E.isError) return /* @__PURE__ */ S(o, {
+	if (E.isLoading) return /* @__PURE__ */ S(c, { label: k("insights.loading", "Crunching your spend insights…") });
+	if (E.isError) return /* @__PURE__ */ S(s, {
 		message: k("insights.error", "Could not load insights."),
 		onRetry: () => void E.refetch()
 	});
@@ -121,11 +121,11 @@ var E = {
 							children: k("insights.portfolioByStatus", "Portfolio by status")
 						}), /* @__PURE__ */ C("div", {
 							className: "flex flex-col items-center gap-6 sm:flex-row",
-							children: [/* @__PURE__ */ S(u, {
+							children: [/* @__PURE__ */ S(d, {
 								data: j.statusData,
 								centerLabel: String(j.total),
 								centerSub: k("insights.subscriptions", "subscriptions")
-							}), /* @__PURE__ */ S(d, {
+							}), /* @__PURE__ */ S(f, {
 								className: "w-full sm:flex-1",
 								data: j.statusData
 							})]
@@ -137,7 +137,7 @@ var E = {
 						children: [/* @__PURE__ */ S("h3", {
 							className: "mb-4 text-sm font-semibold text-text-primary",
 							children: k("insights.spendByType", "Monthly spend by type")
-						}), j.kindData.length ? /* @__PURE__ */ S(l, {
+						}), j.kindData.length ? /* @__PURE__ */ S(u, {
 							data: j.kindData,
 							valueFormat: M
 						}) : /* @__PURE__ */ S("p", {
@@ -151,7 +151,7 @@ var E = {
 						children: [/* @__PURE__ */ S("h3", {
 							className: "mb-4 text-sm font-semibold text-text-primary",
 							children: k("insights.renewalForecast", "Renewal forecast (6 mo)")
-						}), j.forecast.some((e) => e.value > 0) ? /* @__PURE__ */ S(l, {
+						}), j.forecast.some((e) => e.value > 0) ? /* @__PURE__ */ S(u, {
 							data: j.forecast,
 							valueFormat: M
 						}) : /* @__PURE__ */ S("p", {
@@ -163,7 +163,7 @@ var E = {
 			}),
 			/* @__PURE__ */ C("div", {
 				className: "grid grid-cols-1 gap-4 lg:grid-cols-2",
-				children: [/* @__PURE__ */ S(c, {
+				children: [/* @__PURE__ */ S(l, {
 					title: k("insights.topCosts", "Top monthly costs"),
 					children: /* @__PURE__ */ S(w, {
 						treatment: "plain",
@@ -182,7 +182,7 @@ var E = {
 							})]
 						}, e.id))
 					})
-				}), /* @__PURE__ */ S(c, {
+				}), /* @__PURE__ */ S(l, {
 					title: k("insights.healthWatchlist", "Health watchlist"),
 					children: j.watchlist.length ? /* @__PURE__ */ S(w, {
 						treatment: "plain",
@@ -194,7 +194,7 @@ var E = {
 									className: "w-32 shrink-0 truncate text-sm text-text-primary",
 									children: t.label
 								}),
-								/* @__PURE__ */ S(f, {
+								/* @__PURE__ */ S(p, {
 									className: "flex-1",
 									value: t.healthScore ?? 0,
 									tone: "negative"