# PR#68: One Logo per Tool in the Connection Bar, a Menu Names Its Sources

> **WARNING:** This document describes only the change applied in this PR.
> It may already be outdated once the next PR is merged.
> Historic PR documentation is not maintained along with new PRs; treat it as a snapshot.

## Problem

The connection bar of the overview shows a logo per connection.
A tool with several instances or relays shows its logo several times,
e.g. Werkator javagil and vm4006, or Claude Code via three relays.
On a phone, the logos stand without names, so the user cannot tell which logo stands for which instance.
And the row of logos is too wide for a phone.

## Non-Goals

- No change to the tab "Quellen", which lists each connection in full.
- No change to the headline "Alle {n} Quellen verbunden"; it still counts each connection.

## Specification

### Feature: one logo per tool, a menu names its connections

#### Scenario#68.01: a tool with several connections shows one logo

… so that the bar fits on a phone.

- **Given** the connections Werkator javagil and Werkator vm4006
- **When** the overview shows the connection bar
- **Then** the bar shows the logo of Werkator once, without a name

##### Verified by

- manual check in the browser, see "Solution"

#### Scenario#68.02: a tap on a logo opens a menu of its connections

… so that the user sees which instance or relay stands behind the logo.

- **Given** the connections Werkator javagil and Werkator vm4006
- **When** the user taps or clicks the logo of Werkator
- **Then** a menu lists "Werkator javagil" and "Werkator vm4006", each with its state and a link where it has one

##### Verified by

- manual check in the browser, see "Solution"

#### Scenario#68.03: the logo shows the worst state of its connections

… so that a failing instance stays visible without opening the menu.

- **Given** Werkator javagil connected and Werkator vm4006 with an error
- **When** the overview shows the connection bar
- **Then** the logo of Werkator shows the error state

##### Verified by

- manual check in the browser, see "Solution"

#### Scenario#68.04: the menu closes

… so that an open menu does not stay in the way.

- **Given** an open menu
- **When** the user taps outside of it, taps its logo again, or presses Escape
- **Then** the menu closes

##### Verified by

- manual check in the browser, see "Solution"

## Solution

- The connection bar groups the connections by tool and shows each logo once.
  The logo takes the worst state of its connections; the bar shows logos only, also on a desktop, the names stand in the menu.
- The logo is a button; it opens a menu below it with one line per instance or relay:
  status dot, name, e.g. "Werkator javagil" or "Claude Code via think", and the error, the number of entries or "verbunden".
  A line with a link, e.g. to Werkator or Gitea, follows it.
- The page keeps the open menu, so the render every 5 s does not close it.
  A tap on the logo again, a tap elsewhere or Escape closes it.
- On a phone the menu spans the bar; on a desktop it opens to the left of its logo where it would leave the page.
- The repository has no tests of the page; a local check in the browser with the configuration of think,
  two Werkators and two Giteas, at 375 px and at 1024 px width, showed:
  one logo per tool without text, the menu with both instances, the menu open across the render every 5 s,
  and the closing by a second tap, a tap elsewhere and Escape.
  Two relays added in the browser showed "Claude Code via think" and the silent "Claude Code via sat-werk1" in one menu,
  and the logo of Claude Code in the error state.
- Version 0.42.0.

## Open Questions

None.