bug #1479: Configuration UI overlaps Combined-Services-Badge and Show-Logs-Icon

[sbraitsch]

Closes #1479
Added a max width to the name template. Name + ID combinations that are too long will get ellipsized to prevent overlap.
I also moved the service-count badge statically next to the show log and show config icons to make the position consistent.
Added the name + id as a tooltip, so it can be seen fully even when it gets ellipsized.

---

This change is 

[heiko-holz]

Will be discussed in the week of 29.08-02.09.2022 when I'm in FFM

[danipaniii]

Reviewed 1 of 1 files at r2, all commit messages.
Reviewable status: complete! all files reviewed, all discussions resolved (waiting on @heiko-holz and @MariusBrill)

[danipaniii]

In order to always show the full name of the service name and not having to hover over it, there is the possibility to change the styling like this: .this :global(.might-overflow) { max-width: 19rem; display: inline-block; white-space: normal; overflow: visible; overflow-wrap: break-word; text-overflow: unset; }

[danipaniii]

The original solution:

When hovering over the name it looks like this:

The alternative:

[heiko-holz]

We discussed in the team and decided for the version with the line-break.
@danipaniii can you please implement and commit that version :)?

[heiko-holz]

Reviewed 1 of 2 files at r4, 1 of 1 files at r5, 2 of 2 files at r6, all commit messages.
Reviewable status: all files reviewed, 1 unresolved discussion (waiting on @MariusBrill and @sbraitsch)

---

components/inspectit-ocelot-configurationserver-ui/src/components/views/status/StatusTable.js line 188 at r6 (raw file):

          }

          .this :global(.might-overflow):hover {

do we even need the agent name on hover?
I.e., can we remove the title for the agent name?
Let's discuss this in today's sync

[heiko-holz]

Reviewed 1 of 1 files at r7, all commit messages.
Reviewable status: complete! all files reviewed, all discussions resolved (waiting on @MariusBrill)

---

components/inspectit-ocelot-configurationserver-ui/src/components/views/status/StatusTable.js line 188 at r6 (raw file):

Previously, heiko-holz (Heiko Holz) wrote…

do we even need the agent name on hover?
I.e., can we remove the title for the agent name?
Let's discuss this in today's sync

As discussed, I removed the hover attribute and related CSS class

[heiko-holz]

Reviewable status: complete! all files reviewed, all discussions resolved (waiting on @MariusBrill)