Editing topic config modal UI looks different after component migration

[weeco]

When we migrated components from AntD to redpanda-data/ui we prioritized getting components migrated over ui/ux. Editing topic configs was one of the modals that suffered.

Before component migration (screenshot from a video, hence low quality):

Today:

[ivpanda]

Design

After getting some feedback, this is the proposed design:

There is:

• A definition of retention.bytes (or retention.ms)
• A selection of default, infinite, or custom
• If default, then we state what the default is and where it's inherited from
• If infinite, we state what 'infinite' means: that a compaction will never be triggered
• If custom, we add a dropdown with the options: bytes, KiB, MiB, GiB, and TiB. 'infinite' is no longer here. The user can still use -1 to indicate infinite, but we won't advertise that.

Other options

Radio buttons:

The reason I didn't choose this one was because it's a lot of information to take in at the outset.

Default and custom:

This was initially desired, but the lack of clarity around the 'infinite' option made this less desirable.