* Create ConsulServiceInstanceList with styling and test
* Implement ConsulServiceInstanceList to Service Detail page
* Implement ConsulExternalSource to Services Show page header
* Update services/show page object
* Update the styling of CompositeRow
* Refactor ConsulServiceList component and styling
* Update ConsulExternalSource to say 'Registered via...'
* Upgrade consul-api-double to patch 2.14.1
* Fix up tests to not use Kind in service models
* Update ListCollection with clickFirstAnchor action
* Add $typo-size-450 to typography base variables
* Create GridCollection for nodes page with styling
* Update ListCollection styling
* Update TagList styling
* Create CompositeRow styling component
* Update ConsulServiceList component with styling
* Create service health-checks helper
* Add InstanceCount to the service model
* Add tag-svg to codebase
* Create and update tests for service-list page
* Upgrade @hashicorp/consul-api-double to 2.14.0
* ui: Remove custom css-vars 'polyfill' and use native CSS props
Previously we used a sort of polyfill for certain places where we needed
CSS property-like behavior. This meant duplicating code between JS and
CSS, specifically some of our SVG icons.
We moved to CSS props only in the places where they are beneficial and
populated the variables with our already existing SASS variables.
This means we no longer have to duplicate CSS and we can remove our
custom css-var helper/polyfill.
1. Addition of external source icons for services marked as such.
2. New %with-tooltip css component (wip)
3. New 'no healthcheck' icon as external sources might not have
healthchecks, also minus icon on node cards in the service detail view
4. If a service doesn't have healthchecks, we use the [Services] tabs as the
default instead of the [Health Checks] tab in the Service detail page.
5. `css-var` helper. The idea here is that it will eventually be
replaced with pure css custom properties instead of having to use JS. It
would be nice to be able to build the css variables into the JS at build
time (you'd probably still want to specify in config which variables you
wanted available in JS), but that's possible future work.
Lastly there is probably a tiny bit more testing edits here than usual,
I noticed that there was an area where the dynamic mocking wasn't
happening, it was just using the mocks from consul-api-double, the mocks
I was 'dynamically' setting happened to be the same as the ones in
consul-api-double. I've fixed this here also but it wasn't effecting
anything until actually made certain values dynamic.
Kenia
John Cowen