Commit graph

64 commits

Author SHA1 Message Date
John Cowen 7d6f5ef92a ui: refactor out the taglist component to use a recursive pattern (#7837)
* ui: refactor out the taglist component to use a recursive pattern

* Make sure simple rendering tests pass
2020-05-12 17:14:54 +00:00
Kenia 7c203a9220 ui: Create PopoverSelect, CatalogToolbar, and update tests (#7489)
* Create PopoverSelect component and styling

* Create CatalogToolbar component and Styling

* ui: Adds `selectable-key-values` helper (#7472)

Preferably we want all copy/text to live in the template. Whilst you can
achieve what we've done here with a combination of different helpers, as
we will be using this approach in various places it's probably best to
make a helper.

We also hit an ember bug related to using the `let` helper and trying to
access `thingThatWasLet.firstObject` (which can also be worked around
using `object-at`).

Moving everything to a helper 'sorted' everything.

Probably worthwhile noting that if the sort option themselves become
dynamic, I'm not sure if the helper here would actually react as you
would expect (I'm aware that ember helpers on react on the root
arguments, not necesarily sub properties of those arguments). If we get
to that point this helper could take the same approach as what I believe
ember-composable-helpers does to get around this, or move them to the
view controller. If we do ever moved this to the view controller, we
can still use the exported function from the new helper here to keep
using the same functionality and tests we have here.

* Create tests for sorting services with CatalogToolbar

* Add rule to print 'ember/no-global-jquery' as a warning

Co-authored-by: John Cowen <johncowen@users.noreply.github.com>
2020-05-12 17:14:48 +00:00
Kenia 15ff639b83 ui: Update Gateway headers to include Service Kind (#7805) 2020-05-12 17:14:46 +00:00
Kenia 093c353c4b ui: Redesign - Instance Detail Proxy Info tab (#7745)
* Fix clickFirstAnchor bug

* Create Proxy Info Tab for Instance Detail Page

* Create tests for ProxyInfo and update other scenarios with Proxy data

* ui: Refactors our app-view/%app-view component (#7752)

Co-authored-by: John Cowen <johncowen@users.noreply.github.com>
2020-05-12 17:14:46 +00:00
Kenia 697f1f56cf ui: Redesign - Gateway Instances List page (#7796)
* Hide Nav in Instances page for Gateway services

* Fix up tests to have mocked Services with no Kind attribute

* Upgrade consul-api-double to 2.14.4
2020-05-12 17:14:45 +00:00
John Cowen eedd062977 ui: Remove last instances of 'meta data', replace with 'metadata' (#7793) 2020-05-12 17:14:44 +00:00
John Cowen 4370e6a346 ui: Metadata cleanup (#7767)
* Use new ConsulMetadataList for service > instance > metadata tab

* Meta Data vs Metadata everywhere (Metadata is correct)

* Fix up wording in tests
2020-05-12 17:14:40 +00:00
Kenia f7de8dc665 ui: Remove headers from the Healthchecks tab (#7751) 2020-05-12 17:14:39 +00:00
Kenia 945342c367 ui: Update Breadcrumbs styling (#7687) 2020-05-12 17:14:30 +00:00
Kenia a350dda6a8 ui: Instance detail redesign (#7683)
* Remove Proxy link and add ExternalSource to instance detail page header

* Create HealthChecks tab with route and styling

* Fix up tests to fit redesign of Service Instances Detail page
2020-05-12 17:14:29 +00:00
Kenia 958991db94 ui: Redesign - Service Detail Page (#7655)
* 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
2020-05-12 17:14:27 +00:00
John Cowen 455dfe0a1b ui: Per Service Intentions Tab (#7615)
* Add model layer support for filtering intentions by service

* Add Route, Controller and template for services.show.intentions tab

We are still loading the intentions themselves in the parent Route for
the moment

* Load the intentions in in the parent route for the moment

* Temporarily add support for returning to history -1

Once we have an intention form underneath the service/intention tab this
will no longer be needed

* Add the new tab and enable blocking queries for it

* Add some further acceptance testing around intention listings
2020-05-12 17:14:26 +00:00
Kenia b43ecb8fa7 ui: Redesign - Create ConsulExternalSource (#7632)
* Create ConsulExternalSource with test and styling

* Implement ConsulExternalSource to Service list page

* Update icons for redesign

* Refactor ListCollection and CompositeRow styling
2020-05-12 17:14:25 +00:00
Kenia d0c4312923 ui: Redesign Service List page (#7605)
* 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
2020-05-12 17:14:25 +00:00
John Cowen e34c16a90c ui: Logout button (#7604)
* ui: Logout button

This commit adds an easier way to logout of the UI using a logout button

Notes:

- Added a Logout button to the main navigation when you are logged in,
meaning you have easy access to a way to log out of the UI.
- Changed all wording to use 'Log in/out' vocabulary instad of 'stop
using'.
- The logout button opens a panel to show you your current ACL
token and a logout button in order to logout.
- When using legacy ACLs we don't show the current ACL token as legacy
ACLs tokens only have secret values, whereas the new ACLs use a
non-secret ID plus a secret ID (that we don't show).
- We also added a new `<EmptyState />` component to use for all our
empty states. We currently only use this for the ACLs disabled screen to
provide more outgoing links to more readind material/documentation to
help you to understand and enable ACLs.
- The `<DataSink />` component is the sibling to our `<DataSource />`
component and whilst is much simpler (as it doesn't require polling
support), its tries to use the same code patterns for consistencies
sake.
- We had a fun problem with ember-data's `store.unloadAll` here, and in
the end went with `store.init` to empty the ember-data store instead due
to timing issues.
- We've tried to use already existing patterns in the Consul UI here
such as our preexisting `feedback` service, although these are likely to
change in the future. The thinking here is to add this feature with as
little change as possible.

Overall this is a precursor to a much larger piece of work centered on
auth in the UI. We figured this was a feature complete piece of work as
it is and thought it was worthwhile to PR as a feature on its own, which
also means the larger piece of work will be a smaller scoped PR also.
2020-05-12 17:14:24 +00:00
John Cowen 17f10ffd0d ui: Add tab navigation to the browser history/URLs (#7592)
* ui: Add tab navigation to the browser history/URLs

This commit changes all our tabbed UI interfaces in the catalog to use
actual URL changes rather than only updating the content in the page
using CSS.

Originally we had decided not to add tab clicks into the browser
history for a variety of reasons. As the UI has progressed these tabs
are a fairly common pattern we are using and as the UI grows and
stabilizes around certain UX patterns we've decided to make these tabs
'URL changing'.

Pros:

- Deeplinking
- Potentially smaller Route files with a more concentrated scope of the
contents of a tab rather than the entire page.
- Tab clicks now go into your history meaning backwards and forwards
buttons take you through the tabs not just the pages.
- The majority of our partials are now fully fledged templates (Octane
🎉)

Cons:

- Tab clicks now go into your history meaning backwards and forwards
buttons take you through the tabs not just the pages. (Could be good and
bad from a UX perspective)
- Many more Route and Controller files (yet as mentioned above each of these
have a more reduced scope)
- Moving around the contents of these tabs, or changing the visual names
of them means updates to the URL structure, which then should
potentially entail redirects, therefore what things that seem like
straightforwards design reorganizations are now a little more impactful.

It was getting to the point that the Pros outweight the Cons

Apart from moving some files around we made a few more tiny tweaks to
get this all working:

- Our freetext-filter component now performs the initial search rather
than this happening in the Controller (remove of the search method in
the Controllers and the new didInsertElement hook in the component)
- All of the <TabNav>'s were changed to use its alternative href
approach.
- <TabPanel>s usage was mostly removed. This is th thing I dislike the
most. I think this needs removing, but I'd also like to remove the HTML
it creates. You'll see that every new page is wrappe din the HTML for
the old <TabPanel>, this is to continue to use the same HTML structure
and id's as before to avoid making further changes to any CSS that might
use this and being able to target things during testing. We could have
also removed these here, but it would have meant a much larger changeset
and can just as easily be done at a later date.
- We made a new `tabgroup` page-object component, which is almost
identical to the previous `radiogroup` one and injected that instead
where needed during testing.

* Make sure we pick up indexed routes when nspaces are enabled

* Move session invalidation to the child (session) route

* Revert back to not using didInsertElement for updating the searching

This adds a way for the searchable to remember the last search result
instead, which changes less and stick to the previous method of
searching.
2020-05-12 17:14:23 +00:00
John Cowen c8f8814d03 ui: Add <ConsulMetadataList /> and use it in 2 places (#7568)
We previoulsy had some pretty straightforward duplicated code for
rendering our metadata list for both Service Metadata and Node Metadata.

This moves this code into a component.
2020-05-12 17:14:21 +00:00
John Cowen 4c3fbebefd ui: Move to new ember nested file structure for components (#7403)
* ui: Move components to the new nested structure

* Move data-test attribute to the correct HTML element

We don't currently rely on this, but was incorrectly placed on the input
rather than the label tag

* Fix up left over curly bracket components that were causing issues

For some reason the combination of:

1. Old style curly bracket components
2. data-test-* attributes
3. Moving to the new component file structure

Meant that our data-test-* selectors where no longer being rendered.
Whilst this had no effect on the app, it meant our tests suite could no
longer select DOM elements in order to assert various things.

Moving the old style curly bracket components to the new style XML/Angle
bracket format fixes the issue

* Update ui-v2/app/templates/dc/nodes/-services.hbs

Co-Authored-By: Greg Hoin <1416421+gregone@users.noreply.github.com>

* Update ui-v2/app/templates/dc/nodes/-services.hbs

Co-Authored-By: Greg Hoin <1416421+gregone@users.noreply.github.com>

Co-authored-by: Greg Hoin <1416421+gregone@users.noreply.github.com>
2020-05-12 17:14:15 +00:00
John Cowen 411fb2e25c ui: Move to angle brackets for ember components (#7321)
* Modify templates with codemods angle brackets

* ui: Fix up problem with intention filter action attribute

Co-authored-by: Kenia <19161242+kaxcode@users.noreply.github.com>
2020-05-12 17:14:05 +00:00
John Cowen f5ff096d78 ui: Add consul-service-list presentational component (#7279)
This commit moves our service list into a new presentational component,
and is therefore mainly just moving things around. The main thing moved
here is the logic required to resizing columns correctly is now moved to
a component instead of the controller
2020-05-12 17:13:56 +00:00
John Cowen 6e32498431 ui: Remove custom css-vars 'polyfill' and use native CSS props (#7249)
* 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.
2020-05-12 17:13:54 +00:00
John Cowen e4a00b39bf
ui: Use the each key="" parameter to force ember to reuse DOM (#7550)
Ember tries to reuse DOM elements when it can but as ember looks for
changes to objects rather than the DOM itself sometimes. This and the
fact that an objects identity may change even though its value hasn't,
results in ember occasionally re-mutating DOM when it doesn't need to.

The `each` helper includes a `key` attribute to hint to ember what it
should look for when deciding whether something has changed, rather than
the objects identity.

https://api.emberjs.com/ember/release/classes/Ember.Templates.helpers/methods/each#specifying-keys

We use this here to fix an issue where DOM was being redrawn after the
user had scrolled the page and was therefore resetting the scroll back
to 0 (the top of the page)
2020-03-31 14:58:59 +01:00
John Cowen 1fdf60234c
ui: Discovery chain improvements (#7222)
* ui: remove the default word when describing routes

* ui: Avoid mutating the chain and look for the default edges more safely

* ui: Use not null check instead of a truthy check for showing disco-chain

* ui: Upgrade consul-api-double for better disco-chain mocks/fixtures
2020-02-06 12:06:47 +00:00
Kenia ea5d2ef8b6
ui: Hides the Routing tab for a service proxy (#7195)
* Adds conditional in route to not make discovery-chain request if service kind is equal to `connect-proxy` or `mesh-gateway`

* Adds conditional in template to not show Routing tab if `chain` returns as null

* Creates a new acceptance test to test the Routing tab not being displayed for a service proxy

* Adds `tabs` to the services/show page object
2020-02-03 10:09:15 -05:00
Kenia f6a7164d10
ui: Implements the ember-page-title addon to the UI (#7118)
* Installs ember-page-title 5.x

* Adds a page title to all template files that need one

* Adds an assertion step to test the page titles
2020-01-28 09:25:52 -05:00
John Cowen 6bf6002ab0
ui: Move slots to use attributes over positional params (#7032)
* Change all instances of yield/block-slots to use attributes over positional arguments

* Remove the ability to use yield/block-slots with positional params
2020-01-15 09:15:54 +00:00
John Cowen e545c82e1e ui: Discovery Chain (#6746)
* Add data layer for discovery chain (model/adapter/serializer/repo)

* Add routing plus template for routing tab

* Add extra deps - consul-api-double upgrade plus ngraph for graphing

* Add discovery-chain and related components and helpers:

1. discovery-chain to orchestrate/view controller
2. route-card, splitter-card, resolver card to represent the 3 different
node types.
3. route-match helper for easy formatting of route rules
4. dom-position to figure out where things are in order to draw lines
5. svg-curve, simple wrapper around svg's <path d=""> attribute format.
6. data-structs service. This isn't super required but we are using
other data-structures provided by other third party npm modules in other
yet to be merged PRs. All of these types of things will live here for
easy access/injection/changability
7. Some additions to our css-var 'polyfill' for a couple of extra needed
rules

* Related CSS for discovery chain

1. We add a %card base component here, eventually this will go into our
base folder and %stats-card will also use it for a base component.
2. New icon for failovers

* ui: Discovery Chain Continued (#6939)

1. Add in the things we use for the animations
2 Use IntersectionObserver so we know when the tab is visible,
otherwise the dom-position helper won't work as the dom elements don't
have any display.
3. Add some base work for animations and use them a little
4. Try to detect if a resolver is a redirect. Right now this works for
datacenters and namespaces, but it can't work for services and subsets -
we are awaiting backend support for doing this properly.
5. Add a fake 'this service has no routes' route that says 'Default'
6. redirect icon
7. Add CSS.escape polyfill for Edge
2019-12-18 12:26:47 +00:00
John Cowen 31f36ce096 ui: Namespace Support (#6639)
Adds namespace support to the UI:

1. Namespace CRUD/management
2. Show Namespace in relevant areas (intentions, upstreams)
3. Main navigation bar improvements
4. Logic/integration to interact with a new `internal/acl/authorize` endpoint
2019-12-18 12:26:47 +00:00
John Cowen f52e1f607d ui: Expose checks (#6575)
Adds visibility for `Expose.Checks` config setting for proxies.

1. Adds an 'Exposed Path' tab to the proxy detail page to show the user information on exposed paths.
2. If the users has exposed their healthchecks we also add this information to the Service detail page for this proxy (only for http2 and gRPC checks)
2019-12-18 12:26:43 +00:00
John Cowen 0cc86d265e
ui: re-remove the Type header on the service listing page (#6439)
The `Type` column used for giving details on what type of a service each
item is was removed in https://github.com/hashicorp/consul/pull/6075.

As a result of keeping long running branches in sync, this change was
partly reverted in an earlier PR (the type header was re-added)
https://github.com/hashicorp/consul/pull/5913 following a rebase.

This commit re-removes the `Type` table header (the `<th>`)
2019-09-04 11:45:13 +01:00
John Cowen 2c5c84f9d2 ui: {{phrase-editor}} amends (#5991)
1. Re-focus the input element on phrase removal
2. Move all actions to `actions:`
3. Move to a form looking `value` rather than `items`
4. Move placeholder functionalit yinto the component
5. Force DDAU instead of two way binding with `slice` and `onchange`
6. Begin to deprecate the `searchable` interface
2019-09-04 08:35:07 +00:00
John Cowen 81637e2138 ui: CSS Components Migration (#5913)
Migrate roughly half of the base components into base
Adds a target for easily formatting CSS

Further CSS amends/migration (#5921)

1. tooltips within tables where a slightly bit troublesome due to a mix
of `inline-flex`, `overflow` and the need for truncation. This refineds
tooltips a slight bit more to work 'everywhere'.
2. We also move tooltip to use the correct color and min-width from
structure, but we overwrite the min-width here until we get confirmation
on widths/alignment of text within a tooltip.
3. Tiny fixes for breadcrumbs and toggle-buttons in tabular listings
4. Now we inline-flex our table cells, it means it is impossible to
truncate text without wrapping it in another element. This wraps all
Description like text in `<p>` tags. Generally the first column of text
is already wrapped in an `<a>` tag. Other items such as consul tags and
policy names etc get 'cutoff' rather than truncated.
5. We are now using all the icons from `@hashicorp/structure-icons`
2019-09-04 08:35:01 +00:00
John Cowen d3930d55aa
ui: Adds readonly meta data to the serviceInstance and node detail pages (#6196) 2019-08-02 13:53:52 +02:00
John Cowen b143a3bb66
ui: Gateway Addresses (#6075)
- Removes 'type' icons (basically the proxy icon, not the text itself)

- Add support for Mesh Gateways plus their addresses
This adds a 'Mesh Gateway' type label to service and service instance
pages, plus a new 'Addresses' tab if the service is a Mesh Gateway
showing a table of addresses for the service - plus tests
2019-07-05 09:07:25 +01:00
John Cowen 14c6152361
ui: Normal proxies link to services, sidecars to instances (#5944)
* ui: Normal proxies line to services, sidecars to instances

Following on from https://github.com/hashicorp/consul/pull/5933 we
noticed that 'normal' proxies should link to the service, rather than
the service instance. Additionally proxy 'searching' within the
repository should take into account the name of the node that the
originating service is on (sidecar proxies are generally co-located)

Added an additional test here to prove that a sidecar-proxy with the
same service id but on a different node does not show the sidecar proxy
link.
2019-06-20 09:37:17 +01:00
John Cowen 65cf56ad12
ui: Ensure Service Instance pages account for nodes (#5933)
Include node name in the URL for service instances
Integrate the node name slug into tests for service instance pages
2019-06-11 10:18:50 +01:00
John Cowen dc5d403c28 ui: Adds {{Datacenter}} keyword for URL template interpolation (#5768)
1. Includes Datacenter variable for intperolation
2. Amends text on the Settings page to reflect new keyword
3. Adds further acceptance testing around the new dashboard buttons
2019-05-02 18:29:43 +00:00
John Cowen 7021433185 ui: dashboard links (#5704)
This PR adds a new {{template-anchor}} component. This component lets you specify a 'href template' in a handlebars like format instead of a normal string href. This template will be interpolated with the contents of a vars="" attribute.

Also contains code to add an extra UI Setting to be able to store a template to be used for this anchor in localStorage
2019-05-01 18:22:38 +00:00
John Cowen 81f209d71e UI: ACL Roles (#5635)
Adds support for ACL Roles and Service Identities CRUD, along with necessary changes to Tokens, and the CSS improvements required.

Also includes refinements/improvements for easier testing of deeply nested components.

1. ember-data adapter/serializer/model triplet for Roles
2. repository, form/validations and searching filter for Roles
3. Moves potentially, repeated, or soon to to repeated functionality
into a mixin (mainly for 'many policy' relationships)
4. A few styling tweaks for little edge cases around roles
5. Router additions, Route, Controller and templates for Roles

Also see: 

* UI: ACL Roles cont. plus Service Identities (#5661 and #5720)
2019-05-01 18:22:37 +00:00
John Cowen 08c5b376e7 ui: Search improvements (#5540)
* ui: Replaces Service listing filterbar with a phrase-editor search (#5507)

1. New phrase-editor restricting search to whole phrases (acts on
enter key). Allows removal of previously entered phrases
2. Searching now allows arrays of terms, multiple terms work via AND
2019-05-01 18:22:36 +00:00
John Cowen 006b6000a8 UI: Add support for blocking queries on the service instance detail page (#5487)
This commit includes several pieces of functionality to enable services
to be removed and the page to present information that this has happened
but also keep the deleted information on the page. Along with the more
usual blocking query based listing.

To enable this:

1. Implements `meta` on the model (only available on collections in
ember)
2. Adds new `catchable` ComputedProperty alongside a `listen` helper for
working with specific errors that can be thrown from EventSources in an
ember-like way. Briefly, normal computed properties update when a
property changes, EventSources can additionally throw errors so we can
catch them and show different visuals based on that.

Also:

Add support for blocking queries on the service instance detail page

1. Previous we could return  undefined when a service instance has no
proxy, but this means we have nothing to attach `meta` to. We've changed
this to return an almost empty object, so with only a meta property.
At first glance there doesn't seem to be any way to provide a proxy
object to templates and be able to detect whether it is actually null
or not so we instead change some conditional logic in the templates to
detect the property we are using to generate the anchor.
2. Made a `pauseUntil` test helper function for steps where we wait for
things. This helps for DRYness but also means if we can move away from
setInterval to something else later, we can do it in one place
3. Whilst running into point 1 here, we managed to make the blocking
queries eternally loop. Whilst this is due to an error in the code and
shouldn't ever happen whilst in actual use, we've added an extra check
so that we only recur/loop the blocking query if the previous response has a
`meta.cursor`

Adds support for blocking queries on the node detail page (#5489)

1. Moves data re-shaping for the templates variables into a repository
so they are easily covered by blocking queries (into coordinatesRepo)
2. The node API returns a 404 as signal for deregistration, we also
close the sessions and coordinates blocking queries when this happens
2019-05-01 18:22:23 +00:00
John Cowen 1625a09372 ui: Adds blocking query support to the service detail page (#5479)
This commit includes several pieces of functionality to enable services
to be removed and the page to present information that this has happened
but also keep the deleted information on the page. Along with the more
usual blocking query based listing.

To enable this:

1. Implements `meta` on the model (only available on collections in
ember)
2. Adds new `catchable` ComputedProperty alongside a `listen` helper for
working with specific errors that can be thrown from EventSources in an
ember-like way. Briefly, normal computed properties update when a
property changes, EventSources can additionally throw errors so we can
catch them and show different visuals based on that.
2019-05-01 18:22:22 +00:00
John Cowen e615d9f7eb ui: Add proxy icons to proxy services and instances where appropriate (#5463) 2019-05-01 18:22:19 +00:00
John Cowen 75d8abd562 UI: Add forking based on service instance id existence (#5392)
* ui: Add forking based on service instance id existence

Proxies come in 2 flavours, 'normal' and sidecar. We know when a proxy
is a sidecar proxy based on whether a DestinationServiceID is set.

LocalServiceAddress and LocalServicePort are only relevant for sidecar
proxies.

This adds template logic to show different text depending on this
information.

Additionally adds test around connect proxies (#5418)

1. Adds page object for the instance detail page
2. Adds further scenario steps used in the tests
3. Adds acceptance testing around the instance detail page. Services
with proxies and the sidecar proxies and proxies themselves
4. Adds datacenter column for upstreams
5. Fixes bug routing bug for decision as to whether to request proxy
information or not
2019-05-01 18:22:15 +00:00
John Cowen b1d5409d1c UI: Service Numbers (#5348)
Add totals to some listing views, remove healthcheck totals

1. Adds markup to render totals for Services, Nodes, Intentions and v1
ACLs
2. Removes counts from healthcheck filters, and therefore simplify text,
moving the copy to the templates
3. Alter test to reflect the fact that the text of the buttons are no
static in the component template rather than a dynamic attribute
2019-05-01 18:22:11 +00:00
John Cowen e0326c3b0a UI: Service Instances (#5326)
This gives more prominence to 'Service Instances' as opposed to 'Services'. It also begins to surface Connect related 'nouns' such as 'Proxies' and 'Upstreams' and begins to interconnect them giving more visibility to operators.

Various smaller changes:

1. Move healthcheck-status component to healthcheck-output
2. Create a new healthcheck-status component for showing the number of
checks plus its icon
3. Create a new healthcheck-info component to group multiple statuses
plus a different view if there are no checks
4. Componentize tag-list
2019-05-01 18:22:10 +00:00
John Cowen 74390f2d24 ui: Async Search (#4859)
This does several things to make improving the search experience easier
moving forwards:

1. Separate searching off from filtering. 'Searching' can be thought of
as specifically 'text searching' whilst filtering is more of a
boolean/flag search.
2. Decouple the actual searching functionality to almost pure,
isolated / unit testable units and unit test. (I still import embers get
which, once I upgrade to 3.5, I shouldn't need)
3. Searching rules are now configurable from the outside, i.e. not
wrapped in Controllers or Components.
4. General searching itself now can use an asynchronous approach based on
events. This prepares for future possibilities of handing off the
searching to a web worker or elsewhere, which should aid in large scale
searching and prepares the way for other searching methods.
5. Adds the possibility of have multiple searches in one
template/route/page.

Additionally, this adds a WithSearching mixin to aid linking the
searching to ember in an ember-like way in a single place. Plus a
WithListeners mixin to aid with cleaning up of event listeners on
Controller/Component destruction.

Post-initial work I slightly changed the API of create listeners:

Returning the handler from a `remover` means you can re-add it again if you
want to, this avoids having to save a reference to the handler elsewhere
to do the same.

The `remove` method itself now returns an array of handlers, again you
might want to use these again or something, and its also more useful
then just returning an empty array.

The more I look at this the more I doubt that you'll ever use `remove`
to remove individual handlers, you may aswell just use the `remover`
returned from add. I've added some comments to reflect this, but they'll
likely be removed once I'm absolutely sure of this.

I also added some comments for WithSearching to explain possible further
work re: moving `searchParams` so it can be `hung` off the
controller object
2019-05-01 18:21:34 +00:00
John Cowen 5eb5065f70
UI: Text change and clarity Node Health > Health Checks (#5115)
Text change Node Health > Health Checks
Also adds an info icon and tooltip to Health Checks column header
2019-01-17 09:20:00 +00:00
John Cowen 77ad621c04
ui: If a service has no external-source, don't show the icon (#4996) 2018-11-26 17:34:00 +00:00
John Cowen ef891a23b5
ui: Improve layout of node cards on large and small screens (#4761)
1. The grid based unhealthy cards are now clamped to only four wide
maximum. This means that on larger screen the cards are much wider
meaning you can view more information. Grid gutters are also clamped at
a certain ideal width screen, remaining responsive for anything below
this.

2. The healthy node columns are finally responsive following the same
column rules as unhealthy nodes
2018-10-11 10:19:06 +01:00