Commit Graph

19 Commits

Author SHA1 Message Date
Paul Banks 27048a0612
Add metrics rendering to the new topology view. (#8858)
* Remove unused StatsCard component

* Create Card and Stats contextual components with styling

* Send endpoint, item, and protocol to Stats as props

* WIP basic plumbing for metrics in Ember

* WIP metrics data source now works for different protocols and produces reasonable mock responses

* WIP sparkline component

* Mostly working metrics and graphs in topology

* Fix date in tooltip to actually be correct

* Clean up console.log

* Add loading frame and create a style sheet for Stats

* Various polish fixes:

 - Loading state for graph
 - Added fake latency cookie value to test loading
 - If metrics provider has no series/stats for the service show something that doesn't look broken
 - Graph hover works right to the edge now
 - Stats boxes now wrap so they are either shown or not as will fit not cut off
 - Graph resizes when browser window size changes
 - Some tweaks to number formats and stat metrics to make them more compact/useful

* Thread Protocol through topology model correctly

* Rebuild assetfs

* Fix failing tests and remove stats-card now it's changed and become different

* Fix merge conflict

* Update api doublt

* more merge fixes

* Add data-permission and id attr to Card

* Run JS linter

* Move things around so the tests run with everything available

* Get tests passing:

1. Remove fakeLatency setTimeout (will be replaced with CONSUL_LATENCY
in mocks)
2. Make sure any event handlers are removed

* Make sure the Consul/scripts are available before the app

* Make sure interval gets set if there is no cookie value

* Upgrade mocks so we can use CONSUL_LATENCY

* Fix handling of no series values from Prometheus

* Update assetfs and fix a comment

* Rebase and rebuild assetfs; fix tcp metric series units to be bits not bytes

* Rebuild assetfs

* Hide stats when provider is not configured

Co-authored-by: kenia <keniavalladarez@gmail.com>
Co-authored-by: John Cowen <jcowen@hashicorp.com>
2020-10-09 21:31:15 +01:00
Kenia 766b28b8ed
ui: Send kind query to the service-topology endpoint (#8909) 2020-10-09 14:39:16 -04:00
John Cowen 1d324b726f
ui: Leader API polling (#8814)
* Allow configuring a datasource to poll instead of block

* Add 30 second polling to the leader API request
2020-10-06 14:26:44 +01:00
John Cowen e4a0dcf10e
Allow configuring a datasource to poll instead of block (#8805) 2020-10-06 09:31:01 +01:00
Kenia f26201a7a4
ui: Service Mesh - Topology tab and basic layout (#8788)
* Create Topology Tab with foundational layout and styling

* Create Toplogy Metrics component with dynamic SVG

* Add ember-render-modifiers addon

* Implement Topology Metrics comp and fix up styling

* Create topology endpoint with tests

* Move arrow drawing to index.js file

* Add topology to show controller

* Fix up conditional wrapper, tabs positioning, links, and styling

* Group upstreams by dc and fix up styling

* Create service/health-percentage helper

* Add health check percentages to upstreams and downstreams

* Basic Layout

* Upgrade @hashicorp/consul-api-double to v5.2.3

* Renamed endpoint to be service-topology

* Refactor styling

* Update to only show Topology tab when Connect is enabled

* Fix bug and changes from review notes

* Remove unused functions that are replaced with SVG markers

* Refactor to resuse svg-curve helper

* Use the render-template helper for the metrics link

* Add topology default null to services show route

* Removed unused ID

* Fix up tests broken by redirect to /topology
2020-10-05 13:07:35 -04:00
John Cowen 1846e6316c
ui: Split ember-data service model into service/service-instance (#8557) 2020-08-26 15:24:30 +01:00
John Cowen 77b4d8f42a
ui: Use X-Range header as a signal as to whether to reconcile the ember-data store (#8384)
* ui: Use `X-Range` header/meta to decide whether to reconcile or not

Previously we used a `shouldReconcile` method in order to decide whether
a response should trigger a reconciliation of the frontend ember-data
'source of truth' or not. It's a lot nicer/clearer if this 'flag' can be set
alongside the HTTP request information, moreover we almost have the same
functionality in `If-Range`/`Partial Content` HTTP functionality.

Here we partly follow this HTTP semantics but use a custom `X-Range` header
instead.
2020-07-29 10:16:09 +02:00
John Cowen e83c31b070 Revert "ui: Use `X-Range` header/meta to decide whether to reconcile or not"
This reverts commit e9f6361d26.
2020-07-27 09:41:16 +00:00
John Cowen e9f6361d26 ui: Use `X-Range` header/meta to decide whether to reconcile or not
Previously we used a `shouldReconcile` method in order to decide whether
a response should trigger a reconciliation of the frontend ember-data
'source of truth' or not. It's a lot nicer/clearer if this 'flag' can be set
alongside the HTTP request information, moreover we almost have the same
functionality in `If-Range`/`Partial Content` HTTP functionality.

Here we partly follow this HTTP semantics but use a custom `X-Range` header
instead.
2020-07-27 09:30:52 +00:00
John Cowen 5a5f87e5a7
ui: KV Form and List Components (#8307)
* Add components for KV form, KV list and Session form

* Pass through a @label attribute for a human label + don't require error

* Ignore transition aborted errors for if you are re-transitioning

* Make old confirmation dialog more ember-like and tagless

* Make sure data-source and data-sink supports KV and sessions

* Use new components and delete all the things

* Fix up tests

* Make list component tagless

* Add component pageobject and fixup tests from that

* Add eslint warning back in
2020-07-20 18:04:43 +01:00
John Cowen 5d1ce1e120
ui: Move routes to use data-sources (#8321)
* Add uri identifiers to all data source things and make them the same

1. Add uri identitifer to data-source service
2. Make <EventSource /> and <DataSource /> as close as possible
3. Add extra `.closed` method to get a list of inactive/closed/closing
data-sources from elsewhere

* Make the connections cleanup the least worst connection when required

* Pass the uri/request id through all the things

* Better user erroring

* Make event sources close on error

* Allow <DataLoader /> data slot to be configurable

* Allow the <DataWriter /> removed state to be configurable

* Don't error if meta is undefined

* Stitch together all the repositories into the data-source/sink

* Use data.source over repositories

* Add missing  <EventSource /> components

* Fix up the views/templates

* Disable all the old route based blocking query things

* We still need the repo for the mixin for the moment

* Don't default to default, default != ''
2020-07-17 14:42:45 +01:00
John Cowen 0d35548519
ui: New Intention Form/List components (#8172) 2020-07-09 10:08:47 +01:00
Kenia d459bfd81c ui: Add blocking queries to gateways (#7967)
* Remove gateway endpoint adapter, model, and serializer and tests

* Update service tests to handle gateway-services-nodes

* Upgrade consul-api-double to 2.15.2

* Add a fairly temporary shouldReconcile method

Co-authored-by: John Cowen <jcowen@hashicorp.com>
2020-06-03 16:46:52 +00:00
John Cowen 94dd1849b4 ui: New Empty States (#7940)
* ui: CSS and component changes to the <EmptyState /> component

* ui: Reset the auth-form component back to its initial state

Moving forwards we are going to have the auth-form on the page all the
time, even when logged in (for relogging in purposes). This means the
auth-form will not always be removed from the DOM when you log in.

This sets the form back to its idle state before calling onsubmit

* ui: Make a public api for modal-dialog with a single close method

* ui : Move cache reset somewhere that makes more sense, + single refresh

1. Centralize cache resetting elsewhere, for now the store makes most
sense, although I would prefer the Repository class, so using the store
is temporary
2. We only need to refresh on login once, unless we have a differing
nspace

* ui: Ensure visibilitychange events are cleaned up

* ui: Only cache DataSource data if we have any, + only clear the cache

* ui: Add the modal login dialog to both unauth and auth views

This means we can 'relogin' when already logged in

* ui: Add new empty states

* ui: CSS Tweaks

* Remove marketing grays
2020-06-03 16:46:50 +00:00
John Cowen f21b17a1f2 UI: Improved Login/Logout flow inc SSO support (#7790)
* 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
2020-05-12 17:14:51 +00:00
John Cowen b2b6543157 ui: Reuse repo.reconcile and restartWhenAvailable (#7703) 2020-05-12 17:14:32 +00:00
John Cowen 7f3b9d04ba ui: Use DataSources in ACLs area (#7681)
* ui: Use Datasource for loading related data in ACLs area

* ui: Use more manual cleanup for Controller event-sources

* Update reconcile to use nspace and add SyncTime to role/policy

* Use the correct value for nspace and dc (the one from the item itself)

* Remove the // check, we no longer need it. Add some TODO
2020-05-12 17:14:29 +00:00
John Cowen 2685c5081b ui: Improved main navigation (#7673)
* 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
2020-05-12 17:14:28 +00:00
John Cowen 2413244b77 ui: Add DataSource component (#7448)
* 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
2020-05-12 17:14:18 +00:00