diff --git a/frontend/src/settings/Tools.test.tsx b/frontend/src/settings/Tools.test.tsx index dc9180f9..cf5a4384 100644 --- a/frontend/src/settings/Tools.test.tsx +++ b/frontend/src/settings/Tools.test.tsx @@ -88,6 +88,7 @@ vi.mock('../api/services/connectorsService', () => ({ icon: 'tool_telegram', status: 'connected', account_label: '…abcd', + account_name: 'Alerts bot', }, { id: 'conn-2', @@ -203,7 +204,7 @@ describe('Tools page', () => { const telegram = card('Telegram'); expect(telegram.querySelector('[role="switch"]')).not.toBeNull(); // Which account this card is, and the catalog's plain description. - expect(telegram.textContent).toContain('…abcd'); + expect(telegram.textContent).toContain('Alerts bot'); expect(telegram.textContent).toContain( 'settings.connectors.descriptions.telegram', ); diff --git a/frontend/src/settings/Tools.tsx b/frontend/src/settings/Tools.tsx index 82e38d50..7da79a46 100644 --- a/frontend/src/settings/Tools.tsx +++ b/frontend/src/settings/Tools.tsx @@ -275,14 +275,17 @@ export default function Tools() { const { launch, modals } = useConnectorLauncher({ onConnected: () => getUserTools(), }); - // What tells two accounts of one service apart on their cards. + // What tells two accounts of one service apart on their cards: the name + // the owner gave it, else what identifies it. const accountLine = (connection: Connection) => - connection.auth_kind === 'api_key' - ? t('settings.connectors.detail.keyEnding', { - hint: connection.account_label, - interpolation: { escapeValue: false }, - }) - : connection.account_label; + connection.account_name + ? connection.account_name + : connection.auth_kind === 'api_key' + ? t('settings.connectors.detail.keyEnding', { + hint: connection.account_label, + interpolation: { escapeValue: false }, + }) + : connection.account_label; const handleGoBack = () => { setSelectedTool(null);