[Epic] mark optional fields with (Optional) in the UI

[sherifnada]

Tell us about the problem you're trying to solve

In the UI today it's unclear which fields are optional and which are required. We put an asterisk * in front of required fields, but that's not visually sufficient to inform the user which fields are optional. We would like a stronger visual queue indicating whether a field is optional.

Describe the solution you’d like

• In the UI, append (Optional) after the title property of every optional field if it's optional. This should also handle recursive parameters e.g: if parameters are nested in the connector's spec, the same rules should apply to them.
• Adjust all existing connector specs which may already have (Optional) in the property titles, removing any (Optional) text, since the UI will be handling this automatically now. It may be acceptable in the meantime to have the UI first check if (optional) (case insensitive) exists in the param name to decide whether to append (Optional) to decouple the backend and frontend changes.

Describe the alternative you’ve considered or used

1. Doing this in every connector's spec. it's tedious and error prone
2. live in confusion

[octavia-squidington-iii]

cc @airbytehq/frontend

[krishnaglick]

Quoting Tim here, doing this in the frontend shouldn't be too difficult.

[edmundito]

Replaced by #12204