* 6 new components for new login/logout flow, plus SSO support
UI Components:
1. AuthDialog: Wraps/orchestrates AuthForm and AuthProfile
2. AuthForm: Authorization form shown when logged out.
3. AuthProfile: Simple presentational component to show the users
'Profile'
4. OidcSelect: A 'select' component for selecting an OIDC provider,
dynamically uses either a single select menu or multiple buttons
depending on the amount of providers
Data Components:
1. JwtSource: Given an OIDC provider URL this component will request a
token from the provider and fire an donchange event when it has been
retrieved. Used by TokenSource.
2. TokenSource: Given a oidc provider name or a Consul SecretID,
TokenSource will use whichever method/API requests required to retrieve
Consul ACL Token, which is emitted to the onchange event handler.
Very basic README documentation included here, which is likely to be
refined somewhat.
* CSS required for new auth/SSO UI components
* Remaining app code required to tie the new auth/SSO work together
* CSS code required to help tie the auth/SSO work together
* Test code in order to get current tests passing with new auth/SSO flow
..plus extremely basics/skipped rendering tests for the new components
* Treat the secret received from the server as the truth
Previously we've always treated what the user typed as the truth, this
breaks down when using SSO as the user doesn't type anything to retrieve
a token. Therefore we change this so that we use the secret in the API
response as the truth.
* Make sure removing an dom tree from a buffer only removes its own tree
* 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>
* ui: Adds model layer required for SSO
1. oidc-provider ember-data triplet plus repo, plus addition of torii
addon
2. Make blocking queries support a Cache-Control: no-cache header
3. Tweaks to the token model layer in preparation for SSO work
* Fix up meta related Cache-Control tests
* Add tests adapter tests for URL shapes
* Reset Cache-Control to the original value, return something from logout
* ui: Add a way to reliably figure out where the UI is running
The main javascript that we use is at </where/the/ui/is>/ui/assets/consul-ui.js
This uses this fact to provide and base path 'environment' variable to
be used within the app. This is also overwritable via various methods
(testing/development) if we ever need to do that.
* Remove BASE_API_URL, the logic here isn't exactly correct
Right now the API always _has_ to be at http://domain/v1/ i.e. the root
of your domain /v1. If the URL of the ui is set differently to
http://root.com/somewhere/else/ui/ then the API is still at http://root.com/v1
There is definitely a plan to add this env var back in at some stage so
we can potentially allow this to be configured in other ways, but there
isn't a need to do it just yet so we don't need to worry about _how_ to do
this right now.
* Make datacenter queries use query vs findAll like the rest of the app
* Make sure we have an element to pass to isInViewport
* Make sure href-mut doesn't error even if the currentRoute === null
* More post test cleanup and Safari fix (safari requires http:// URLs)
* Reverse order of datasource nspace/dc's and add a namespace source
* Rearrange routes/templates/controllers to only use HashicorpConsul once
* Add datasources and correct token namespace detection/redirection
* Remove old dc findAll adapter method
* Add more comments around the 'child route/parent controller' vars
* 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.
This commit adds 2 ember component/helpers and a service to contain the
shared functionality for matching/rendering content dependent on state
identifiers. Currently a `service.state` method has been added to easily
make manual state objects, but these are built towards using `xstate` to
manage UI state in some of our future components.
We've added some tests here, and we aren't currently using these
components anywhere in this commit.
* ui: Add data-source component and related services (#6486)
* ui: Add data-source component and related services:
1. DataSource component
2. Repository manager for retrieving repositories based on URIs
3. Blocking data service for injection to the data-source component to
support blocking query types of data sources
4. 'Once' promise based data service for injection for potential
fallback to old style promise based data (would need to be injected via
an initial runtime variable)
5. Several utility functions taken from elsewhere
- maybeCall - a replication of code from elsewhere for condition
calling a function based on the result of a promise
- restartWhenAvailable - used for restarting blocking queries when a
tab is brought to the front
- ifNotBlocking - to check if blocking is NOT enabled
* Move to a different organization based on protocols
* Don't call open twice when eager
* Workaround new ember error for reading and writing at the same time
* Add first draft of a README.mdx file
* ui: Test Coverage Reporting (#7027)
* Serve up the /coverage folder whilst developing
* Upgrade ember-cli-api-double now it supports passthrough per url
* ui: make env into a service and use it where we need to be injectable
* Give http/client a body method so we can use it on its own for testing
* Add test helper for testing with and without nspaces enabled
* Add two tests, one thay needs nspaces and one that doesn't
* Keep cleaning up client/http, whilst figuring out a immutable bug
* Convert tests to new return format ([actual, leftovers])
When using namespaces, the 'default' namespace is a little special in
that we wanted the option for all our URLs to stay the same when using
namespaces if you are using the default namespace, with the option of
also being able to explicitly specify `~default` as a namespace.
In other words both `ui/services/service-name` and
`ui/~default/services/service-name` show the same thing.
This means that if you switch between OSS and Enterprise, all of your
URLs stay the same, but you can still specifically link to the default
namespace itself.
Our routing configuration is duplicated in order to achieve this:
```
- :dc
- :service
- :kv
- :edit
- :nspace
- :dc
- :service
- :kv
- :edit
```
Secondly, ember routing resolves/matches routes in the order that you specify
them, unless, its seems, when using wildcard routes, like we do in the
KV area.
When not using the wildcard routes the above routing configuration
resolves/matches a `/dc-1/kv/service` to the `dc.kv.edit` route correctly
(dc:dc-1, kv:services), that route having been configured in a higher
priority than the nspace routes.
However when configured with wildcards (required in the KV area), note
the asterisk below:
```
- :dc
:service
- :kv
- *edit
- :nspace
- :dc
- :service
- :kv
- *edit
```
Given something like `/dc-1/kv/services` the router instead matches the
`nspace.dc.service` (nspace:dc-1, dc:kv, service:services) route first even
though the `dc.kv.edit` route should still match first.
Changing the `dc.kv.edit` route back to use a non-wildcard route
(:edit instead of *edit), returns the router to match the routes in the
correct order.
In order to work around this, we catch any incorrectly matched routes
(those being directed to the nspace Route but not having a `~`
character in the nspace parameter), and then recalculate the correct
route name and parameters. Lastly we use this recalculated route to
direct the user/app to the correct route.
This route recalcation requires walking up the route to gather up all of
the required route parameters, and although this feels like something
that could already exist in ember, it doesn't seem to. We had already
done a lot of this work a while ago when implementing our `href-mut`
helper. This commit therefore repurposes that work slighlty and externalizes
it outside of the helper itself into a more usable util so we can import
it where we need it. Tests have been added before refactoring it down
to make the code easier to follow.
* Update search field placeholder to display `Search`
* Add an acceptance test to search node listings with node name and IP Address
* Update and add unit tests for filter/search node listing with IP Address
* ui: Discovery-Chain: Cope with redirects that have failovers
We found a few stranger configurations for discovery-chain, one of which
was redirects that can then failover.
We altered the parsing here to include 2 passes, one to organize the
nodes into resolvers and children/subsets based on the nodes themselves, which
includes adding the failovers to resolvers and subsets.
We then do a second pass which can more reliably figure out whether a
target is a redirect or a failover (target failovers don't have a
corresponding node), this then adds the redirect children to the already
exising resolver (from the first pass) and then checks if the redirect
also has failovers and adds those if so.
* ui: Check to see if we have a user configured default route or not
...if we don't add one so the visualization looks complete
* ui: Acceptance test improvements to prepare for more NS tests
* ui: Namespace acceptance testing (#7005)
* Update api-double and consul-api-double for http.body
* Adds places where we missed passing the nspace through
* Hardcode nspace CRUD to use the default nspace for policies and roles
* Alter test helpers to allow us to control nspaces from the outside
* Amends to allow tests to account for namespace, move ns from queryParam
1. We decided to move how we pass the namespace value through to the
backend when performing write actions (create, update). Previoulsy we
were using the queryParam although using the post body is the preferred
method to send the Namespace details through to the backend.
2. Other various amends to take into account testing across multiple
namespaced scenarios
* Enable nspace testing by default
* Remove last few occurances of old style http assertions
We had informally 'deprecated' our old style of http assertions that
relied on the order of http calls (even though that order was not
important for the assertion). Following on from our namespace work we
removed the majority of the old occrances of these old style assertions.
This commit removes the remaining few, and also then cleans up the
assertions/http.js file to only include the ones we are using.
This reduces our available step count further and prevents any confusion
over the usage of the old types and the new types.
* ui: Namespace CRUD acceptance tests (#7016)
* Upgrade consul-api-double
* Add all the things required for testing:
1. edit and index page objects
2. enable CONSUL_NSPACE_COUNT cookie setting
3. enable mutating HTTP response bodies based on URL
* Add acceptance test for nspace edit/delete/list and searching
* Reorganize resolvers so its clearer what's happening
* Use entire route definition for id
* Clean up a tiny bit more, use guid for ids instead of JSON
* ui: Externalize disco-chain utils and add initial unit testing
* Add some click outside-ness for de-highlighting things
* 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
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
## HTTPAdapter (#5637)
## Ember upgrade 2.18 > 3.12 (#6448)
### Proxies can no longer get away with not calling _super
This means that we can't use create anymore to define dynamic methods.
Therefore we dynamically make 2 extended Proxies on demand, and then
create from those. Therefore we can call _super in the init method of
the extended Proxies.
### We aren't allowed to reset a service anymore
We never actually need to now anyway, this is a remnant of the refactor
from browser based confirmations. We fix it as simply as possible here
but will revisit and remove the old browser confirm functionality at a
later date
### Revert classes to use ES5 style to workaround babel transp. probs
Using a mixture of ES6 classes (and hence super) and arrow functions
means that when babel transpiles the arrow functions down to ES5, a
reference to this is moved before the call to super, hence causing a js
error.
Furthermore, we the testing environment no longer lets use use
apply/call on the constructor.
These errors only manifests during testing (only in the testing
environment), the application itself runs fine with no problems without
this change.
Using ES5 style class definitions give us freedom to do all of the above
without causing any errors, so we reverted these classes back to ES5
class definitions
### Skip test that seems to have changed due to a change in RSVP timing
This test tests a usecase/area of the API that will probably never ever
be used, it was more testing out the API. We've skipped the test for now
as this doesn't affect the application itself, but left a note to come
back here later to investigate further
### Remove enumerableContentDidChange
Initial testing looks like we don't need to call this function anymore,
the function no longer exists
### Rework Changeset.isSaving to take into account new ember APIs
Setting/hanging a computedProperty of an instantiated object no longer
works. Move to setting it on the prototype/class definition instead
### Change how we detect whether something requires listening
New ember API's have changed how you can detect whether something is a
computedProperty or not. It's not immediately clear if its even possible
now. Therefore we change how we detect whether something should be
listened to or not by just looking for presence of `addEventListener`
### Potentially temporary change of ci test scripts to ensure deps exist
All our tooling scripts run through a Makefile (for people familiar with
only using those), which then call yarn scripts which can be called
independently (for people familar with only using yarn).
The Makefile targets always check to make sure all the dependencies are
installed before running anything that requires them (building, testing
etc).
The CI scripts/targets didn't follow this same route and called the yarn
scripts directly (usually CI builds a cache of the dependencies first).
For some reason this cache isn't doing what it usually does, and it
looks as though, in CI, ember isn't installed.
This commit makes the CI scripts consistently use the same method as all
of the other tooling scripts (Makefile target > Install Deps if
required > call yarn script). This should install the dependencies if
for some reason the CI cache building doesn't complete/isn't successful.
Potentially this commit may be reverted if, the root of the problem is
elsewhere, although consistency is always good, so it might be a good
idea to leave this commit as is even if we need to debug and fix things
elsewhere.
### Make test-parallel consistent with the rest of the tooling scripts
As we are here making changes for CI purposes (making test-ci
consistent), we spotted that test-parallel is also inconsistent and also
the README manual instructions won't work without `ember` installed
globally.
This commit makes everything consistent and changes the manual
instructions to use the local ember instance that gets installed via
yarn
### Re-wrangle catchable to fit with new ember 3.12 APIs
In the upgrade from ember 3.8 > 3.12 the public interfaces for
ComputedProperties have changed slightly. `meta` is no longer a public
property of ComputedProperty but of a ComputedDecoratorImpl mixin
instead.
7e4ba1096e/packages/%40ember/-internals/metal/lib/computed.ts (L725)
There seems to be no way, by just using publically available
methods, to replicate this behaviour so that we can create our own
'ComputedProperty` factory via injecting the ComputedProperty class as
we did previously.
3f333bada1/ui-v2/app/utils/computed/factory.js (L1-L18)
Instead we dynamically hang our `Catchable` `catch` method off the
instantiated ComputedProperty. In doing it like this `ComputedProperty`
has already has its `meta` method mixed in so we don't have to manually
mix it in ourselves (which doesn't seem possible)
This functionality is only used during our work in trying to ensure
our EventSource/BlockingQuery work was as 'ember-like' as possible (i.e.
using the traditional Route.model hooks and ember-like Controller
properties). Our ongoing/upcoming work on a componentized approach to
data a.k.a `<DataSource />` means we will be able to remove the majority
of the code involved here now that it seems to be under an amount of
flux in ember.
### Build bindata_assetfs.go with new UI changes
Makes listening to multiple events on one target slightly easier.
Adding events can be rolled up into passing through an object, and the
returned remove function removes all of the handlers in the object
For example:
```
//this.listen...
const remove = listeners.add(
{
'message': handler,
'error': handler
}
);
remove(); // removes all listeners in the object
```
The entire API for listeners is now becoming slightly overloaded, so
potentially we'd use this API always and remove the ability to use a
string/function pair.
You can potentially close an EventSource before its first tick by
immediately setting the readyState to a non-open state. Therefore it
never opens.
Calling `open` will then open it.
'Open' fits better than 'reopen' when taking the above into account
* ui: Allow text selection of clickable elements and their contents
This commit disables a click on mousedown be removing the `href`
attribute and moving it to a `data-href` attribute. On mouseup it will
only move it back if there is no selection. This means that an anchor
will only be followed on click _if_ there is no selection.
This fixes the fact that whenever you select some copy within a
clickable element it immediately throws you into the linked page when
you release your mouse.
Further notes:
We use the `isCollapsed` property here which 'seems' to be classed as
'experimental' in one place where I researched it:
https://developer.mozilla.org/en-US/docs/Web/API/Selection/isCollapsed
Although in others it makes no mention of this 'experimental' e.g:
- https://webplatform.github.io/docs/dom/Selection/isCollapsed/
- https://w3c.github.io/selection-api/#dom-selection-iscollapsed
I may have gone a little overboard in feature detection for this, but I
conscious of that fact that if `isCollapsed` doesn't exist at some point
in the future (something that seems unlikely). The code here will have
no effect on the UI. But I'd specifically like a second pair of eyes on
that.
* ui: Don't break right click, detects a secondary click on mousedown
* ui: Put anchor selection capability behind an ENV var
1. Adds a Listeners class, which lets us...
2. Add Listeners recursively. So you can
createListeners().add(createListeners())
3. Also add the ability to `.add` as a plain function
This moves the entire idea more towards a generic teardown utility
1. Remove ember-cli-clipboard dependency
2. Provide a new copy-button component implementing the same
interface as ^ but make the clipboard functionality injectable
3. Provide 2 implementations of a Clipboard. One using clipboard.js (as
previously) and an additional local storage 'clipboard'.
4. add a BDD step to assert whats in the clipboard (the fake one)
Main reason here is that `document.exec` must be called by a user
interaction
1. Amends our `base` animation placeholder to always reset
transition-duration. This has no effect on other components that are
already using this animation.
2. Adds a confirming class whenever a key is pressed, to show the green
tick. Uses CSS via `transition-delay` for debouncing.
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
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)
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
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.
More recommendations for blocking queries clients was added here:
https://github.com/hashicorp/consul/pull/5358
This commit mainly adds cursor/index validation/correction based on
these recommendations (plus tests)
The recommendations also suggest that clients should include rate
limiting. Because of this, we've moved the throttling out of Consul UI
specific code and into Blocking Query specific code. Currently the 'rate
limiting' in this commit only adds a sleep to every iteration of the
loop, which is not the recommended approach, but the code here organizes
the throttling functionality into something we can work with later to
provide something more apt.
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
- Maintain http headers as JSON-API meta for all API requests (#4946)
- Add EventSource ready for implementing blocking queries
- EventSource project implementation to enable blocking queries for service and node listings (#5267)
- Add setting to enable/disable blocking queries (#5352)
Adds xhr connection managment to http/1.1 installs
This includes various things:
1. An object pool to 'acquire', 'release' and 'dispose' of objects, also
a 'purge' to completely empty it
2. A `Request` data object, mainly for reasoning about the object better
3. A pseudo http 'client' which doens't actually control the request
itself but does help to manage the connections
An initializer is used to detect the script element of the consul-ui sourcecode
which we use later to sniff the protocol that we are most likely using for API access
1. Ensure any unexpected developer errors are passed through/shown
2. Previously when errors where returns/resolved the special
isEnabled/isAuthorized would never get resolved. This was fine as they
were set to false to start with anyway, but this resolves them again to
false for completeness
3. Improved unit testing coverage
Move all the dom-things to use the dom service in tabular-collection, feedback-dialog, list-collection and node show. Move get-component-factory into utils/dom and use dom.root() in a few more places
This includes an additional `dom.components` method which gives you a
list of components matching the selector instead of just one.
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
In 858b05fc31 (diff-46ef88aa04507fb9b039344277531584)
we removed encoding values in pathnames as we thought they were
eventually being encoded by `ember`. It looks like this isn't the case.
Turns out sometimes they are encoded sometimes they aren't. It's complicated.
If at all possible refer to the PR https://github.com/hashicorp/consul/pull/5206.
It's related to the difference between `dynamic` routes and `wildcard` routes.
Partly related to this is a decision on whether we urlencode the slashes within service names or not. Whilst historically we haven't done this, we feel its a good time to change this behaviour, so we'll also be changing services to use dynamic routes instead of wildcard routes. So service links will then look like /ui/dc-1/services/application%2Fservice rather than /ui/dc-1/services/application/service
Here, we define our routes in a declarative format (for the moment at least JSON) outside of Router.map, and loop through this within Router.map to set all our routes using the standard this.route method. We essentially configure our Router from the outside. As this configuration is now done declaratively outside of Router.map we can also make this data available to href-to and paramsFor, allowing us to detect wildcard routes and therefore apply urlencoding/decoding.
Where I mention 'conditionally' below, this is detection is what is used for the decision.
We conditionally add url encoding to the `{{href-to}}` helper/addon. The
reasoning here is, if we are asking for a 'href/url' then whatever we
receive back should always be urlencoded. We've done this by reusing as much
code from the original `ember-href-to` addon as possible, after this
change every call to the `{{href-to}}` helper will be urlencoded.
As all links using `{{href-to}}` are now properly urlencoded. We also
need to decode them in the correct place 'on the other end', so..
We also override the default `Route.paramsFor` method to conditionally decode all
params before passing them to the `Route.model` hook.
Lastly (the revert), as we almost consistently use url params to
construct API calls, we make sure we re-encode any slugs that have been
passed in by the user/developer. The original API for the `createURL`
function was to allow you to pass values that didn't need encoding,
values that **did** need encoding, followed by query params (which again
require url encoding)
All in all this should make the entire ember app url encode/decode safe.
In order to continue supporting the legacy ACL system, we replace
the 500 error from a non-existent `self` endpoint with a response of a
`null` `AccessorID` - which makes sense (a null AccessorID means old
API)
We then redirect the user to the old ACL pages which then gives a 403
if their token was wrong which then redirects them back to the login page.
Due to the multiple redirects and not wanting to test the validity of the token
before redirecting (thus calling the same API endpoint twice), it is not
straightforwards to turn the 'faked' response from the `self` endpoint
into an error (flash messages are 'lost' through multiple redirects).
In order to make this a slightly better experience, you can now return a
`false` during execution of an action requiring success/failure
feedback, this essentially skips the notification, so if the action is
'successful' but you don't want to show the notification, you can. This
resolves showing a successful notification when the `self` endpoint
response is faked. The last part of the puzzle is to make sure that the
global 403 catching error in the application Route also produces an
erroneous notification.
Please note this can only happen with a ui client using the new ACL
system when communicating with a cluster using the old ACL system, and
only when you enter the wrong token.
Lastly, further acceptance tests have been added around this
This commit also adds functionality to avoid any possible double
notification messages, to avoid UI overlapping
In some circumstances a consul 1.4 client could be running in an
un-upgraded 1.3 or lower cluster. Currently this gives a 500 error on
the new ACL token endpoint. Here we catch this specific 500 error/message
and set the users AccessorID to null. Elsewhere in the frontend we use
this fact (AccessorID being null) to decide whether to present the
legacy or the new ACL UI to the user.
Also:
- Re-adds in most of the old style ACL acceptance tests, now that we are keeping the old style UI
- Restricts code editors to HCL only mode for all `Rules` editing (legacy/'half legacy'/new style)
- Adds a [Stop using] button to the old style ACL rows so its possible to logout.
- Updates copy and documentation links for the upgrade notices
John Cowen