Refactor components

[danielkestler]

Components are distributed across different React packages. This is in itself not a problem, but due to how they are used, the separation is not clear. Most „base“ components (like Buttons, Icons, all the different input fields, Dialogs) are in the React UI components package.

In the UI containers, they are often used wrong, not using their component APIs but overwriting e.g. colors in CSS. This leads to some unnecessary important statements and bloated, repetitive stylesheets in general. Alltogether leading to inconsistencies in the design.

I hereby propose to carefully refactor the component architecture and add missing, but often needed components to the React UI components base package.

[JamesAlias]

I can absolutely second this.
When I migrated components in the react-ui-components package to typescript I tried to understand how some of these components were used throughout the code base to make sure I typed their props properly. A lot of times I noticed that props were just forwarded and weren't really the API of those components (as in "listed as PropType").
I can absolutely see where this is coming from as it makes customization of those components much easier without "touching" them, but I think we can work out a better way. Maybe narrow down the interfaces of components and provide extension points for when it's really necessary to change something.

I also think we should wait with this until the migration to typescript is done, so we can make changes confidently, knowing that the type checker notices if we break something we did not meant to.

[danielkestler]

Thank you, okay, let's just wait for the finished TypeScript migration.