diff --git a/CHANGELOG.md b/CHANGELOG.md index 6084a3cf658..3ff13afb96e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -5,6 +5,7 @@ ### Fixes - Onboarding/Configure: refuse to proceed with invalid configs; run `clawdbot doctor` first to avoid wiping custom fields. (#764 — thanks @mukhtharcm) - Anthropic: merge consecutive user turns (preserve newest metadata) before validation to avoid “Incorrect role information” errors. (#804 — thanks @ThomsenDrake) +- Connections UI: show account counts for multi-account providers and keep Telegram per-account cards. (#813 — thanks @dbhurley) - Discord/Slack: centralize reply-thread planning so auto-thread replies stay in the created thread without parent reply refs. - Update: run `clawdbot doctor --non-interactive` during updates to avoid TTY hangs. (#781 — thanks @ronyrus) - Tools: allow Claude/Gemini tool param aliases (`file_path`, `old_string`, `new_string`) while enforcing required params at runtime. (#793 — thanks @hsrvc) diff --git a/ui/src/ui/views/connections.ts b/ui/src/ui/views/connections.ts index 095006ab85b..c7ddb017754 100644 --- a/ui/src/ui/views/connections.ts +++ b/ui/src/ui/views/connections.ts @@ -208,6 +208,26 @@ function providerEnabled(key: ProviderKey, props: ConnectionsProps) { } } +function getProviderAccountCount( + key: ProviderKey, + providerAccounts?: Record | null, +): number { + return providerAccounts?.[key]?.length ?? 0; +} + +function renderProviderAccountCount( + key: ProviderKey, + providerAccounts?: Record | null, +) { + const count = getProviderAccountCount(key, providerAccounts); + if (count < 2) return nothing; + return html` +
+ Accounts (${count}) +
+ `; +} + function renderProvider( key: ProviderKey, props: ConnectionsProps, @@ -221,13 +241,18 @@ function renderProvider( providerAccounts?: Record | null; }, ) { + const accountCountLabel = renderProviderAccountCount( + key, + data.providerAccounts, + ); switch (key) { case "whatsapp": { const whatsapp = data.whatsapp; return html` -
-
WhatsApp
-
Link WhatsApp Web and monitor connection health.
+
+
WhatsApp
+
Link WhatsApp Web and monitor connection health.
+ ${accountCountLabel}
@@ -326,9 +351,11 @@ function renderProvider( const telegram = data.telegram; const telegramAccounts = data.providerAccounts?.telegram ?? []; const hasMultipleAccounts = telegramAccounts.length > 1; - + const renderAccountCard = (account: ProviderAccountSnapshot) => { - const probe = account.probe as { bot?: { username?: string } } | undefined; + const probe = + (account.probe as { bot?: { username?: string } } | undefined) ?? + undefined; const botUsername = probe?.bot?.username; const label = account.name || account.accountId; return html` @@ -350,50 +377,54 @@ function renderProvider( Last inbound ${account.lastInboundAt ? formatAgo(account.lastInboundAt) : "n/a"}
- ${account.lastError ? html` -
- ${account.lastError} -
- ` : nothing} + ${account.lastError + ? html` +
+ ${account.lastError} +
+ ` + : nothing}
`; }; - + return html`
Telegram
Bot token and delivery options.
+ ${accountCountLabel} - ${hasMultipleAccounts ? html` -
-
Accounts (${telegramAccounts.length})
- ${telegramAccounts.map((account) => renderAccountCard(account))} -
- ` : html` -
-
- Configured - ${telegram?.configured ? "Yes" : "No"} -
-
- Running - ${telegram?.running ? "Yes" : "No"} -
-
- Mode - ${telegram?.mode ?? "n/a"} -
-
- Last start - ${telegram?.lastStartAt ? formatAgo(telegram.lastStartAt) : "n/a"} -
-
- Last probe - ${telegram?.lastProbeAt ? formatAgo(telegram.lastProbeAt) : "n/a"} -
-
- `} + ${hasMultipleAccounts + ? html` +
+ ${telegramAccounts.map((account) => renderAccountCard(account))} +
+ ` + : html` +
+
+ Configured + ${telegram?.configured ? "Yes" : "No"} +
+
+ Running + ${telegram?.running ? "Yes" : "No"} +
+
+ Mode + ${telegram?.mode ?? "n/a"} +
+
+ Last start + ${telegram?.lastStartAt ? formatAgo(telegram.lastStartAt) : "n/a"} +
+
+ Last probe + ${telegram?.lastProbeAt ? formatAgo(telegram.lastProbeAt) : "n/a"} +
+
+ `} ${telegram?.lastError ? html`
@@ -559,9 +590,10 @@ function renderProvider( const discord = data.discord; const botName = discord?.probe?.bot?.username; return html` -
-
Discord
-
Bot connection and probe status.
+
+
Discord
+
Bot connection and probe status.
+ ${accountCountLabel}
@@ -1083,9 +1115,10 @@ function renderProvider( const botName = slack?.probe?.bot?.name; const teamName = slack?.probe?.team?.name; return html` -
-
Slack
-
Socket mode status and bot details.
+
+
Slack
+
Socket mode status and bot details.
+ ${accountCountLabel}
@@ -1464,9 +1497,10 @@ function renderProvider( case "signal": { const signal = data.signal; return html` -
-
Signal
-
REST daemon status and probe details.
+
+
Signal
+
REST daemon status and probe details.
+ ${accountCountLabel}
@@ -1693,9 +1727,10 @@ function renderProvider( case "imessage": { const imessage = data.imessage; return html` -
-
iMessage
-
imsg CLI and database availability.
+
+
iMessage
+
imsg CLI and database availability.
+ ${accountCountLabel}