UI - Improve listing of relationships for a connection

Consider a RouteOnAttribute processor with "Route to Property name" with many dynamic properties. This will lead to many relationships (r1, r2, r3, etc). Now consider an UpdateAttribute processor.

Connect RouteOnAttribute to this UpdateAttribute processor and select r1 and r3.

If the two processors are stopped, opening the configuration of the connection will show an alphabetically sorted list of the ALL the relationships (of the RouteOnAttribute processor) with checkboxes and r1/r3 will show as checked.

Now, if one of the two processors is started, opening the configuration of the connection will show an alphabetically sorted list of the ALL the relationships (of the RouteOnAttribute processor) and the only distinction will be that r1 and r3 will be in bold.

When having many connections (think 50+), just showing the selected relationships in bold is not super user friendly. It's really hard to distinguish the bold names in a very long list of names.

When one of the processors is running and we're just showing the details of the connection without the option to change the list of selected relationships for that connection, I suggest that we only display the list of the selected relationships.

For reference, the related code is here:

https://github.com/apache/nifi/blob/main/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/nf-connection-details.js#L520