Horizontal overflow in tables

[weeco]

Tables that contain columns with very long values the table is overflowing and exceeds the panel in which it is wrapped. The horizontal scroll does not work. We should ensure that all tables (e.g. topics, schemas, connectors, ...) can handle long values. Specifically topic names can be up to 254 chars, and for other dynamic values such as the connector or schema name we should assume a similar max length that we should support.

Looks ok after adding overflow setting in chrome inspect:

Originally posted by @jseparovic in #1032 (comment) , I added more context.

[ghost]

A quick fix for this: it's OK to truncate the connector name here. A user's primary focus here is whether or not the connector is healthy or not. They can always click into it to see more information, including the full name.

Mo and I are looking into improving tables more holistically.

[jseparovic]

Can you make this a configurable setting? I’m not a fan of truncating the name. This is currently the only way I can find the connector I’m looking for. A filter at the top to search for a connector name would be useful too. Configurable columns too would be ideal, in my setup I would get rid of everything except connector name.

[weeco]

We should definetely add a quicksearch input for searching connectors. I'm surprised we do not already have one since we have community users running more than 1k connectors in their environment! (Issue for adding quicksearch: #1091)

Configurable columns should be possible too! For example on the "Topics > List messages" tab we have a cogwheel in the table header row where you can configure the table settings including what columns you want to see. We could do something similar for the connectors too!

[ghost]

To update this, we decided in a Slack discussion and through some feedback from CS to allow long table names to wrap instead of truncating:

Then, on the individual pages, we will show the names with the following pattern:

The title will be Topic or Connector with the full name underneath, copyable.

We can keep the truncation in breadcrumbs.

[weeco]

Fixed via #1159