Commit Graph

624 Commits

Author SHA1 Message Date
John Cowen 54f0cd812a
ui: Show the correct 'ACLs Disabled' page when ACLs are disabled (#10604)
Adds 'can access ACLs' which means one of two things

1. When ACLs are disabled I can access the 'please enable ACLs' page
2. When ACLs are enabled, its the same as canRead
2021-07-14 18:52:13 +01:00
John Cowen b256313256
ui: [BUGFIX] Ensure in-folder KVs are created in the correct folder (#10569)
When clicking to create a KV within folder name, would would be viewing a form that was a form for creating a KV in the root, which when the user clicked to save, saved the KV in the root.

For the moment at least I've removed the code that strips double slashes, and whilst this isn't ideal, it looks like we've picked up one of those bugs that turns into a 'feature', and completely reworking KV to not rely on the double slashes is not really an option right now.
2021-07-14 18:49:01 +01:00
Kenia a96e87aece
ui: Add socket icon for UDS (#10573) 2021-07-12 09:28:01 -04:00
John Cowen 6fbeea5def
ui: Don't default to the default namespace, use the token default namespace instead (#10503)
The default namespace, and the tokens default namespace (or its origin namespace) is slightly more complicated than other things we deal with in the UI, there's plenty of info/docs on this that I've added in this PR.

Previously:

When a namespace was not specified in the URL, we used to default to the default namespace. When you logged in using a token we automatically forward you the namespace URL that your token originates from, so you are then using the namespace for your token by default. You can of course then edit the URL to remove the namespace portion, or perhaps revisit the UI at the root path with you token already set. In these latter cases we would show you information from the default namespace. So if you had no namespace segment/portion in the URL, we would assume default, perform actions against the default namespace and highlight the default namespace in the namespace selector menu. If you wanted to perform actions in your tokens origin namespace you would have to manually select it from the namespace selector menu.

This PR:

Now, when you have no namespace segment/portion in the URL, we use the token's origin namespace instead (and if you don't have a token, we then use the default namespace like it was previously)

Notes/thoughts:

I originally thought we were showing an incorrectly selected namespace in the namespace selector, but it also matched up with what we were doing with the API, so it was in fact correct. The issue was more that we weren't selecting the origin namespace of the token for the user when a namespace segment was omitted from the URL. Seeing as we automatically forward you to the tokens origin namespace when you log in, and we were correctly showing the namespace we were acting on when you had no namespace segment in the URL (in the previous case default), I'm not entirely sure how much of an issue this actually was.

This characteristic of namespace+token+namespace is a little weird and its easy to miss a subtlety or two so I tried to add some documentation in here for future me/someone else (including some in depth code comment around one of the API endpoints where this is very subtle and very hard to miss). I'm not the greatest at words, so would be great to get some edits there if it doesn't seem clear to folks.

The fact that we used to save your previous datacenter and namespace into local storage for reasons also meant the interaction here was slightly more complicated than it needed to be, so whilst we were here we rejigged things slightly to satisfy said reasons still but not use local storage (we try and grab the info from higher up). A lot of the related code here is from before we had our Routlets which I think could probably make all of this a lot less complicated, but I didn't want to do a wholesale replacement in this PR, we can save that for a separate PR on its own at some point.
2021-07-07 11:46:41 +01:00
Daniel Nephin 2c4f22a9f0
Merge pull request #10552 from hashicorp/dnephin/ca-remove-rotation-period
ca: remove unused RotationPeriod field
2021-07-06 18:49:33 -04:00
John Cowen 74070c0955
ui: Add intl debug helpers (#10513)
This commit adds a couple of debug utilities to help us to continue slowly adding i18n support:

- We've added a CONSUL_INTL_DEBUG env/cookie variable to turn off variable interpolation within the t helper so you can see which variables are being interpolated.
- We've added a CONSUL_INTL_LOCALE env/cookie which currently supports two 'pseudo-locales' - la-fk (fake latin) and - (just dashes) either of which will make it easier to see what has not been localized until we can add prettier rules to prevent adding any copy into templates at all. I would guess if we ever translated the app we would use this for looking at things whilst developing also - but as yet I've not adding anything for that here seeing as we don't translate anything.
Both variables are dev-time only and all code for this is removed from the production build.
2021-07-06 17:01:08 +01:00
John Cowen b0d69efcc1
ui: Allow disabling of sourcemaps via env var (#10491) 2021-07-06 16:57:53 +01:00
John Cowen e541a43b37
ui: Fixup definition-table + copy-button margin (#10512) 2021-07-06 16:57:20 +01:00
John Cowen a6996b6ea5
ui: CopyButton amends (#10511)
* ui: Add with-copyable modifier

* Use with-copyable modifier for our own CopyButton

* Move copy-button styling and remove most of `copy-btn`
2021-07-06 16:56:36 +01:00
jkirschner-hashicorp 5f73de6fbc
Merge pull request #10560 from jkirschner-hashicorp/change-sane-to-reasonable
Replace use of 'sane' where appropriate
2021-07-06 11:46:04 -04:00
Daniel Nephin 3a045cca8d ca: remove unused RotationPeriod field
This field was never used. Since it is persisted as part of a map[string]interface{} it
is pretty easy to remove it.
2021-07-05 19:15:44 -04:00
Jared Kirschner bd536151e1 Replace use of 'sane' where appropriate
HashiCorp voice, style, and language guidelines recommend avoiding ableist
language unless its reference to ability is accurate in a particular use.
2021-07-02 12:18:46 -04:00
John Cowen ace794d214
ui: Enable specifying additional docfy config as json (#10464) 2021-06-25 10:41:41 +01:00
John Cowen c78f7ecb27
ui: Colocate remaining CSS components to the app/components folder (#10328) 2021-06-23 09:19:35 +01:00
John Cowen 043f631b7f
ui: Rename icons for consistency and remove unused icons (#10311)
* ui: Standardize logo naming

According to structure it should always be logo-name not name-logo

* Make sure all our logos use logo-name format

* Upgrade to @hashicorp/structure-icons 1.9.0

* Add `-color` to be consistent with other logos

* Add ms logo back in

* Remove all the old `*-color` icons from before when we got masks

* Add missing files

* Missed glimmer extend name change
2021-06-22 18:56:17 +01:00
John Cowen 4bddd52103
ui: Increase z-index of main menus to avoid layering issues (#10428) 2021-06-22 14:19:13 +01:00
John Cowen 5f17062b0a
ui: Add resolution for xmlhttprequest-ssl at least 1.6.3 (#10370) 2021-06-21 12:06:44 +01:00
John Cowen 9eab715149
ui: Move all our icons to use CSS custom properties instead of SASS vars (#10298)
* ui: Move all our icons to use CSS custom properties

The good thing about SASS vars is, if you don't use them they get removed from the final build. Whereas with CSS we have no tree-shaking to get rid of unused CSS custom properties. We can mostly work around this and for some things like colors its no big deal if we have some hex-codes in the build that we don't use as hex-codes are relatively small.

We've been slowly but surely moving all of our colors (and other things) to use CSS custom properties instead of SASS vars now that we have them available.

This commit makes use of the 'tree-shaking' abilities of @extend to ensure that we only compile in the icons that we use.

This commit is mostly churn-less as we already use @extend for the majority of our icons, so generally there is zero change here for working on the UI, but I did spot one single place where we were using SASS vars instead of @extend. This now uses the new form (second commit)

Interestingly this reduces our CSS payload by ~2kb to ~53kb (around 25kb of that is these icons)
2021-06-21 11:54:58 +01:00
John Cowen ac424187fe
ui: %horizontal-kv-list CSS component (and related) (#10285)
This commit uses docfy to isolate the individual parts and options and investigates the why you might use certain options and document how you might use certain options.

Originally we used a single %icon-definition CSS component to represent this, but seeing as some of them don't have icons, it didn't seem like the best name. So this PR splits this component into various different ones and then uses the new ones to continue to provide a now deprecated %icon-definition.

The component is currently a CSS only component that assumes a single (or multiple) description lists for its markup component, and provides for multiple different options (including a reversed mode which I'm still not totally sure about, but we don't use this right now anyway).

- %icon-definition
- %horizontal-kv-list
- %csv-list 
- %tag-list
- %badge
2021-06-21 11:40:14 +01:00
John Cowen 18190fb071
ui: Move intention description field (#10292)
...from under the permissions widget to over the permissions widget
2021-05-27 15:55:35 +01:00
John Cowen ddee7afbb9
ui: Fixup prettier for scss files and run (#10296)
* ui: Ensure prettier makes all our scss files pretty

* Run prettier on all our scss files
2021-05-27 13:23:54 +01:00
John Cowen af72b9e9ab
ui: Unix Domain Socket support (#10287)
This commit adds UI support for Unix Domain Sockets for upstream and downstreams (see #9981 and #10252)
2021-05-26 17:52:25 +01:00
John Cowen 2e4c9f5330
ui: Support Route optional parameters/segments (#10212)
Moves our URLs with 'optional namespace segment' into a separately abstracted 'optional URL segment' feature
2021-05-26 17:43:46 +01:00
John Cowen e11454cf71
ui: Colocate old base components into our app/component folder (#10275) 2021-05-26 15:08:57 +01:00
John Cowen a73b38a368
ui: Minor CSS tweaks (#10295) 2021-05-26 14:35:19 +01:00
Kenia f3efde3843
ui: Create and use collapsible notices component (#10270)
* Create and use collapsible notices

* Refactor collapsible-notices

* Split up the topology acceptance tests

* Add acceptance tests for tproxy notices

* Add component file

* Adds additional TProxy notices tests

* Adds conditional to only show collapsable if more than 2 notices are present

* Adds changelog

* Refactorting the conditonal for collapsing the notices

* Renaming undefinedIntention to be notDefinedIntention

* Refactor tests
2021-05-25 11:02:38 -04:00
John Cowen 600f857531
ui: Add docs for AppView (#10265)
* ui: change coloring of secondary navigation elements

* Remove top border, this was probably from older designs/iterations

* ui: Move app-view styles into components also...

1. Remove dead %app-view-content-error
2. Remove TabNav border overwriting

* Bring into line with our 'project standard' class/attributes pattern

* Add docs for AppView
2021-05-24 12:32:23 +01:00
John Cowen dd4a66808d
ui: change coloring of secondary navigation elements (#10259) 2021-05-24 11:51:16 +01:00
John Cowen 4e420df7ae
ui: Adds QUnit toggle bookmarklet to our docs (#10269) 2021-05-20 16:24:50 +01:00
John Cowen 39302041e9
ui: Miscellaneous Lock Session fixes (#10225) 2021-05-19 11:05:54 +01:00
John Cowen 8301e79c56
ui: Bump node to v14 (#10238) 2021-05-18 16:30:19 +01:00
John Cowen d1bbe0895f
ui: Use babel plugin to strip calls to runInDebug (#10237) 2021-05-17 13:27:34 +01:00
John Cowen 04bd576179
ui: Serf Health Check warning notice (#10194)
When the Consul serf health check is failing, this means that the health checks registered with the agent may no longer be correct. Therefore we show a notice to the user when we detect that the serf health check is failing both for the health check listing for nodes and for service instances.

There were a few little things we fixed up whilst we were here:

- We use our @replace decorator to replace an empty Type with serf in the model.
- We noticed that ServiceTags can be null, so we replace that with an empty array.
- We added docs for both our Notice component and the Consul::HealthCheck::List component. Notice now defaults to @type=info.
2021-05-13 11:36:51 +01:00
Kenia ecbeaa87c1
ui: Add conditionals to Lock Session list items (#10121)
* Add conditionals to Lock Session list items

* Add changelog

* Show ID in details if there is a name to go in title

* Add copy-button if ID is in the title

* Update TTL conditional

* Update .changelog/10121.txt

Co-authored-by: John Cowen <johncowen@users.noreply.github.com>

Co-authored-by: John Cowen <johncowen@users.noreply.github.com>
2021-05-11 11:35:15 -04:00
John Cowen 90d1a307ef
ui: Fix nspace spacing issue (#10157)
This fixes the spacing bug in nspaces only by only showing Description if the namespace has one, and removing the extra 2 pixel margin of dds for when dts aren't rendered/don't exist.
2021-05-10 11:19:11 +01:00
John Cowen 0e4db3f242
ui: Adds ability to show a 'partial' list in list-collections (#10174)
* ui: Add support for showing partial lists in ListCollection

* Add CSS for partial 'View more' button, and move all CSS to /components

* Enable partial view for intention permissions
2021-05-07 16:54:45 +01:00
John Cowen da78615b58
ui: Remove top border from Consul::AuthMethod::List (#10195) 2021-05-07 16:53:09 +01:00
John Cowen e3f9a0f8ee
ui: Loader amends/improvements (#10181)
* ui: Loader amends/improvements

1. Create a JS compatible template only 'glimmer' component so we can
use it with or without glimmer.
2. Add a set of `rose` colors.
3. Animate the brand loader to keep it centered when the side
navigation appears.
4. Tweak the color of Consul::Loader to use a 'rose' color.
5. Move everything loader related to the `app/components/` folder and
add docs.
2021-05-07 12:23:29 +01:00
John Cowen 5400c81e29
ui: [BUGFIX] De-duplicate Tag rendering (#10186)
* Add some tests for duplicated and non-duplicated tags

* Ensure tags get de-duped and add docs

* Update docs to include info on the recursive-ness
2021-05-07 12:07:11 +01:00
Mike Morris 9801551f7c ui: add data-enterprise-logo to logo svg for enterprise 2021-05-05 19:30:10 -04:00
John Cowen 07e11f32ee
ui: Remove extra nspace value from service upstreams (#10152)
* ui: Remove extra nspace value from service upstreams
2021-05-04 17:42:13 +01:00
John Cowen fc7fe23b4d
ui: Fix text search for upstream instances (#10151)
* ui: Fix text search for upstream instances

* Clean up predicates for other model types

* Add some docs around DataCollection and searching

* Enable UI Engineering Docs for our preview sites

* Use debug CSS in dev and staging
2021-05-04 17:25:57 +01:00
John Cowen 4533a5e959
ui: Adds CRD popover 'informed action' for intentions managed by CRDs (#10100)
* ui: Adds CRD popover 'informed action' for intentions add via CRDs
2021-05-04 17:21:54 +01:00
Hector Simpson 211bc824a9
Update brand assets (#10081)
* Update header logo and inline icon

* Update full logos + layout on loading screen

* Update favicon assets and strategy
- Switches to serve an ico file alongside an SVG file
- Introduces an apple-touch-icon

* Removes unused favicon/meta assets

* Changelog item for ui

* Create component for logo

* Simplify logo component, set brand color

* Fix docs loading state CSS issue
2021-05-03 16:19:09 +01:00
John Cowen 5d89ba0313
ui: Add a max height and scroll to the intention perm header lists (#10128) 2021-04-29 10:41:26 +01:00
Kenia f9a4b6d050
ui: Add TProxy Mode notice banner to service instance Upstreams tab (#10136) 2021-04-28 14:06:18 -04:00
Kenia 0c9555ec0e
ui: Update not-defined intention popover and banner (#10133) 2021-04-28 10:31:14 -04:00
Kenia 7caa47da56
ui: Update conditional for topology empty state (#10124) 2021-04-28 09:23:02 -04:00
Kenia ce98d08d12
ui: Fix empty SVG height to prevent service mesh from breaking when there are no upstreams (#10122) 2021-04-28 09:22:18 -04:00
John Cowen 345765f766
ui: Adds human formatting to nanosecond based session durations (#10062)
* ui: Adds human formatting to nanosecond based session durations
2021-04-28 12:12:56 +01:00
Kenia 48dd5dd1de
ui: Splitting up the translations file into folder structure (#10093) 2021-04-26 11:20:29 -04:00
John Cowen 7a095e7d2f
ui: Vertically stack methods listing in the L7 intentions form (#10052)
* ui: Vertically stack methods listing in the L7 intentions form
2021-04-22 12:23:41 +01:00
John Cowen e00da6f818
ui: Add Admin Partition feature flag (#10051)
* ui: Add Admin Partition feature flag

This adds a `PartitionEnabled`/`CONSUL_PARTITIONS_ENABLED` feature flag
that can be set during production form the consul binary, or
additionally during development/testing via cookies.

* Add partitions bookmarklet and docs, and all eng docs from main README to the docs instead.

You probably already have the app running once you need these, and it reduces the amount of text/detail in the main README

* Add the env variable section back into the README with actual env vars
2021-04-22 12:22:40 +01:00
John Cowen f6f282ac77
ui: Add information regarding Host header for ingress gateways (#10050)
* Add inline-code CSS component

* Add %inline-code to all the places where we need it

* Inject selected env variables into the translations file

* Add ingress gateway upstream 'host header' intro text

* Make sure we can use actual correct component casing for titles but still have nice consistent menu item casing in the side nav
2021-04-22 12:16:56 +01:00
John Cowen d008dc3d85
ui: Hoist DC menu into the top navigation bar (#10034)
* Add story for %main-nav-vertical plus additions for hoisting menu items

* Make sure we don't source app.css twice

* Hoist the DC menu
2021-04-16 12:13:06 +01:00
Mike Morris f00d5e3a2a
ui: fix mismatched curly brace in mock-api (#10044)
* ui: fix mismatched curly brace in mock-api

* ui: add missing closing paren in mock-api
2021-04-15 18:24:52 -04:00
Freddy daf897f1a9
Merge pull request #10002 from hashicorp/ui/feature/banners-and-labels-for-tproxy-changes 2021-04-15 14:14:20 -06:00
John Cowen f33feeeec4
ui: Never respond with empty gateway addresses (mock-api) (#10035)
We noticed that our mock API would sometimes respond with an empty array
of addresses - which resulted in an empty space in the gateway upstream
listing which looked as though it could be broken.

I checked with backend, and as this will never happen, I made the change
here also so the gateway upstream list is always fully populated with
addresses.
2021-04-15 19:18:37 +01:00
John Cowen 76b2122f38
ui: remove old nspace argument from the proxy instance repository (#10039)
The extra argument meant that the blocking query configuration wasn't
being read properly, and therefore the correct ?index wasn't being sent
with the request.
2021-04-15 19:18:07 +01:00
kenia 703869603e review note fixes 2021-04-15 09:19:22 -04:00
kenia 53a0fc56e9 Update catalog mock data for Mode attr 2021-04-15 09:19:22 -04:00
kenia 876d03a81b Refactor TopologyMetrics Notices 2021-04-15 09:19:22 -04:00
kenia 041245c7dd Create placeholder *(All Services) Card 2021-04-15 09:19:22 -04:00
kenia 934db376f4 Add translations for topology-mterics and transparent-proxy components 2021-04-15 09:19:22 -04:00
kenia 727b6e966b Create icon and dashed line for intention not explictly defined 2021-04-15 09:19:21 -04:00
kenia f5849fd500 Create not explicitly defined intentions banner 2021-04-15 09:19:21 -04:00
kenia 52e88bbf65 Create TransparentProxy mode label for service instance page 2021-04-15 09:19:21 -04:00
kenia fc40212823 Create Topology Metrics Source Type to be in each Card 2021-04-15 09:19:21 -04:00
kenia e9d01a3d4c Refactor Topology Metrics Card component 2021-04-15 09:19:21 -04:00
kenia cdf77e32f2 Create warning banners for permissive default-allow and wildcard-intention 2021-04-15 09:19:21 -04:00
kenia 57d3bf59ee Update service-topology mock data with new attributes: TransparentProxy, DefaultAllow, WildcardIntention, and Source 2021-04-15 09:19:21 -04:00
Kenia 84064f972e
ui: Return empty string protocol for upstream/downstream metrics request (#9989) 2021-04-12 09:03:57 -04:00
Kenia a0d12ff164
ui: Reformat MaxTokenTTL to sortBy as an integer (#9969)
* Install Duration JS

* Use Duration.js to sortBy reformatted MaxTokenTTL

* Remove @icholy/duration package

* Install parse-duration package

* Use parse-duration in auth-method model
2021-04-07 12:43:04 -04:00
John Cowen e4e85a8f83
ui: Move control of login modal to use JS rather than HTML (label/id) (#9883)
* Add before and after skip links portals

* Move EmptyState and ErrorState to use a @login action/function

* Move page title setting to the Route component

* Add Routes and Outlets everywhere, and use those to access login modal

* Add some aria-labels to the modals

* Docs

* Remove the label/input now we no longer need it, fixup pageobject

* Add basic modal docs

* Switch out old toggle names for ids

* Wrap nspace Route template in a Route component

* type > class
2021-04-06 13:40:40 +01:00
Kenia ee5c3e3aa5
ui: Auth Methods - Namespace rules tab (#9935)
* Add mock data for NamespaceRules

* Create NamespaceTable component and styling

* Add NamespaceRules route and add to model

* Create Namespace Rules tab and implement with flag to only show in ent

* Add emptystate to namespace rules page

* Rename namespace-rules to be nspace-rules

* Rename NamespaceTable to be NspaceList
2021-03-31 10:55:31 -04:00
Kenia 4d13e31ae0
ui: Auth Methods - Create Binding Rules tab (#9914)
* Create BindingRule adapter and tests

* Create BindingRule serializer and test

* Create BindingRule model and repository

* Add binding-rules mock data

* Create binding-rules router and call endpoint

* Create Binding rules tab

* Create and use BindingView component

* Create empty state for BindingView

* Remove binding rule requestForQueryRecord endpoint and tests

* Update binding rules selector to be monospaced

* Add bind type tooltip

* Create and Tabular-dl styling component

* Update hr tag global styling

* Rename BindingView to BindingList and refactor

* Add translations for bind types tooltip info

* Remove unused endpoint

* Refactor based on review notes
2021-03-26 11:47:47 -04:00
Kenia 232921b60e
ui: Add a README to the new Certificate component (#9908) 2021-03-23 09:22:09 -04:00
John Cowen a7a56ca39c
ui: Ensure intention form cancel button works (#9901)
* ui: Ensure intention form cancel button works

By adding `@action` decorators to the actions called form within the
template
2021-03-19 15:14:46 +00:00
John Cowen 0863806769
ui: Dependency Upgrade (#9907)
* Pin ember-changeset-validations and its dependencies to 3.9

Future versions produce a 'validator is not a function' error

* yarn upgrade

* Upgrade the majority of user facing deps that don't required add. change

not upgraded here due to more changes required:

- ember-page-title
- ember-href-to

* Upgrade ember-page-title which no longer requires ember-cli-head

* Upgrade some devtools related dependencies

* Upgrade some non ember-core test utils

* Upgrade js-yaml which required safeLoad > load

* Upgrade some compilation utils

* Yarn install from workspace root

* Add Python-2.0 to compliance checker
2021-03-19 15:14:07 +00:00
Kenia 980299d519
ui: Auth Methods- Updates to certificate and empty state in show page (#9895)
* Update Certificate to be monospaced

* Add empty states for claim and list claim mappings

* Update the styling of empty state actions block

* Update mocked PEM certificate format
2021-03-18 11:18:23 -04:00
John Cowen 8dc590cf11
ui: Add all tooltips to the default tabbing order in the page (#9888)
* ui: Add all tooltips to the default tabbing order in the page

This amends our tooltip modifier to automatically add a tabindex="0" to
all of our tooltips (if they aren't tabbable already).

This means that all tooltips will automatically be
added to the natural tab order of the page. I'm pretty sure we don't
currently require the ability to disable this automatic functionality
but if we do at some point in the future we can add an option to disable
it, meaning all tooltips will be tabbable by default.
2021-03-18 14:35:50 +00:00
John Cowen 9e715842d9
ui: Improves UI engineering docs (#9875)
Also fixes some typos in with-overlay
2021-03-17 15:58:17 +00:00
Kenia f9e8b26af6
ui: Create auth-method show page with General Info Tab (#9845)
* Update list items to be linkable to auth-methods show

* Add general, namespace, and binding sub-routes

* Remove namespace and binding tabs to be done separately

* Update auth-method byId endpoint

* Style the show auth-method kubernetes type

* Finish Kubernetes auth-method type styling

* OIDC and JWT auth-method styling

* Create consul-auth-method-view component

* Add navigation test for auth-methods

* Create Certificate component
2021-03-17 10:40:56 -04:00
John Cowen aca7976580
ui: Adds warning icon to side menu when ACLs are disabled (#9864)
* ui: Adds warning icon to side menu when ACLs are are disabled
2021-03-17 11:23:00 +00:00
John Cowen 41471719e6
ui: CSP Improvements (#9847)
* Configure ember-auto-import so we can use a stricter CSP

* Create a fake filesystem using JSON to avoid inline scripts in index

We used to have inline scripts in index.html in order to support embers
filepath fingerprinting and our configurable rootURL.

Instead of using inline scripts we use application/json plus a JSON blob
to create a fake filesystem JSON blob/hash/map to hold all of the
rootURL'ed fingerprinted file paths which we can then retrive later in
non-inline scripts.

We move our inlined polyfills script into the init.js external script,
and we move the CodeMirror syntax highlighting configuration inline
script into the main app itself - into the already existing CodeMirror
initializer (this has been moved so we can lookup a service located
document using ember's DI container)

* Set a strict-ish CSP policy during development
2021-03-17 10:46:21 +00:00
John Cowen fa6687b7f4
ui: Implement ACLs access based on ACLs (#9835)
Adds restrictions to everything within the ACLs (and nspaces) area based on your ACLs (including readonly views etc.)
2021-03-11 09:29:11 +00:00
John Cowen 33d0383779
ui: a11y modals (#9819)
This PR uses the excellent a11y-dialog to implement our modal functionality across the UI.

This package covers all our a11y needs - overlay click and ESC to close, controlling aria-* attributes, focus trap and restore. It's also very small (1.6kb) and has good DOM and JS APIs and also seems to be widely used and well tested.

There is one downside to using this, and that is:

We made use of a very handy characteristic of the relationship between HTML labels and inputs in order to implement our modals previously. Adding a for="id" attribute to a label meant you can control an <input id="id" /> from anywhere else in the page without having to pass javascript objects around. It's just based on using the same string for the for attribute and the id attribute. This allowed us to easily open our login dialog with CSS from anywhere within the UI without having to manage passing around a javascript object/function/method in order to open the dialog.

We've PRed #9813 which includes an approach which would make passing around JS modal object easier to do. But in the meantime we've added a little 'hack' here using an additional <input /> element and a change listener which allows us to keep this label/input characteristic of our old modals. I'd originally thought this would be a temporary amend in order to wait on #9813 but the more I think about it, the more I think its quite a nice thing to keep - so longer term we may/may not keep this.
2021-03-09 09:30:01 +00:00
John Cowen 308e5a480e
ui: Remove storybook, add docfy (#9831)
This PR removes storybook and adds docfy and uses docfy to render our existing README files.

This now means we can keep adding README documentation without committing any specific format or framework. If we eventually move to storybook then fine, or if we just want to remove docfy for whatever reason then fine - we will still have a full set of README files viewable via GitHub.
2021-03-08 12:22:01 +00:00
John Cowen 61eef053db
ui: Add Route component / routlet service (#9813)
* Add Routlet service and Route Component

* Add ember-assign-helper (already an indirect dependency)

* Use EventListeners for is-href instead of observing

* Don't include :active in '-intent' styles
2021-03-08 12:15:54 +00:00
John Cowen 779f7f7b60
ui: Side navigation tweaks (#9812)
* Remove footer and add the Consul version to the Help menu

* Tweak menu text and button styling

* Tweak some coloring and spacing

* Add slightly larger Consul logo
2021-02-25 09:35:53 +00:00
John Cowen f9b0e50ca0
ui: Update project blueprints for native classes (#9775) 2021-02-24 09:03:18 +00:00
John Cowen 8b12d0d09d
ui: DataSource Decorator (#9746)
We use a `<DataSource @src={{url}} />` component throughout our UI for when we want to load data from within our components. The URL specified as the `@src` is used to map/lookup what is used in to retrieve data, for example we mostly use our repository methods wrapped with our Promise backed `EventSource` implementation, but DataSource URLs can also be mapped to EventTarget backed `EventSource`s and native `EventSource`s or `WebSockets` if we ever need to use those (for example these are options for potential streaming support with the Consul backend).

The URL to function/method mapping previous to this PR used a very naive humongous `switch` statement which was a temporary 'this is fine for the moment' solution, although we'd always wanted to replace with something more manageable.

Here we add `wayfarer` as a dependency - a very small (1kb), very fast, radix trie based router, and use that to perform the URL to function/method mapping.

This essentially turns every `DataSource` into a very small SPA - change its URL and the view of data changes. When the data itself changes, either the yielded view of data changes or the `onchange` event is fired with the changed data, making the externally sourced view of data completely reactive.

```javascript
// use the new decorator a service somewhere to annotate/decorate
// a method with the URL that can be used to access this method
@dataSource('/:ns/:dc/services')
async findAllByDatacenter(params) {
  // get the data
}

// can use with JS in a route somewhere
async model() {
  return this.data.source(uri => uri`/${nspace}/${dc}/services`)
}
```

```hbs
{{!-- or just straight in a template using the component --}}
<DataSource @src="/default/dc1/services" @onchange="" />
```

This also uses a new `container` Service to automatically execute/import certain services yet not execute them. This new service also provides a lookup that supports both standard ember DI lookup plus Class based lookup or these specific services. Lastly we also provide another debug function called DataSourceRoutes() which can be called from console which gives you a list of URLs and their mappings.
2021-02-23 08:56:42 +00:00
John Cowen 2c2e9d1ce5
ui: Add an optional environment variable to control how testem starts (#9793)
Here we look for a TESTEM_AUTOLAUNCH environment variable, which can be
set to either Chrome, Firefox or Safari, which will control which
browser to automatically start when running testem tests.

If the variable is set to anything else, then it will not automatically
start a browser in order to run the tests and you will need to visit the
tests manually. e.g.:

TESTEM_AUTOLAUNCH=0 make test-oss-view

Previously we only ever tested in Chrome and therefore there are no
specific settings for Firefox or Safari. If specific settings are
required for these browsers they can be added at a later date.
2021-02-22 14:53:05 +00:00
John Cowen 8263879e6f
ui: Restrict the viewing/editing of certain UI elements based on the users ACLs (#9687)
This commit use the internal authorize endpoint along wiht ember-can to further restrict user access to certain UI features and navigational elements depending on the users ACL token
2021-02-19 16:42:16 +00:00
John Cowen 7be21a9027
ui: Add some acceptance testing around the Metrics graph (#9785)
* Add a way to set the local datacenter

* Amend step so we can positively and negatively look for elements

* Add a data-test selector so we can get to the topology series graph

* Add a couple of tests to verify the series graph shows/doesn't show
2021-02-18 18:31:49 +00:00
Kenia 1507dd8ab3
ui: Auth Methods List view (#9617)
* Create mock-api endpoints for auth-methods

* Implement auth-method endpoints and model with tests

* Create route and tab for auth-methods

* Create auth-method list and type components with styles

* Add JWT and OIDC svg logos to codebase

* Add brand translations

* Add SearchBar to Auth Methods

* Add acceptance test for Auth Methods UI

* Skip auth method repo test

* Changes from review notes

* Fixup auth-method modela and mock-data

* Update SearhBar with rebased changes

* Add filterBy source and sortBy max token ttl

* Update to SortBy MethodName

* Update UI acceptance tests

* Update mock data DisplayNames

* Skip repo test

* Fix to breaking serializer test

* Implement auth-method endpoints and model with tests

* Add acceptance test for Auth Methods UI

* Update SearhBar with rebased changes

* Add filterBy source and sortBy max token ttl

* Update to SortBy MethodName

* Update UI acceptance tests

* Update mock data DisplayNames

* Fix to breaking serializer test

* Update class for search

* Add auth-methods link to sidebar

* Fixup PR review notes

* Fixup review notes

* Only show OIDC filter with enterprise

* Update conditionals for MaxTokenTTL & TokenLocality

* Refactor
2021-02-17 13:56:56 -05:00
Kenia 1b5087f6e5
ui: Use ember-on-resize-modifier to fix bug with sidebar (#9761)
* Use ember-on-resize-modifier to fix bug with sidebar

* Fix recursive height by dynamically setting fixed height

* Refactor
2021-02-17 13:51:48 -05:00
John Cowen 96204a21d8
ui: [BUGFIX] Ensure we show the correct count of instances for each node (#9749)
* Add MeshServiceInstances property to node model

* Use MeshServiceInstances property

* Make sure we show the 'No * checks' if Checks.length is zero
2021-02-11 11:36:36 +00:00
John Cowen 369637aff7
ui: Update browser targets to ~2016 browsers (#9729)
* ui: Reduce range of browsers in targets.js `'Chrome 55', 'Firefox 53', 'Safari 13', 'Edge 15'`

* ui: Remove auto-prefixer
2021-02-11 10:03:13 +00:00
John Cowen eda38a0ba1
ui: [BUGFIX] Replace all replaceAll with split.join for older browsers without replaceAll (#9715)
* ui: replace all `replaceAll` with split.join

* Use a div instead of fieldset for flex-box reasons
2021-02-11 09:49:39 +00:00
John Cowen e0ff7080ae
ui: Adds unique-id helper (#9676) 2021-02-02 10:03:46 +00:00
John Cowen 0b7d676dcb
ui: Add 'Scenario' debug function for easy saving debug scenarios (#9675) 2021-02-01 17:50:11 +00:00
John Cowen 3aef5cde20
ui: Adds the dump router dumping function only in dev mode (#9666) 2021-02-01 17:29:43 +00:00
John Cowen 3477b1de77
ui: Keep track of previous node checks and avoid adding them twice (#9661)
* Keep track of previous node checks and avoid adding them twice
2021-01-29 15:57:47 +00:00
John Cowen 19fd9a87d1
ui: Check for a non-existent items argument/attribute within DataCollection (#9662) 2021-01-29 15:53:28 +00:00
John Cowen 7c277aa85b
ui: [BUGFIX] Fix missing or duplicate service instance health checks (#9660)
* Use NodeName not Node for cross checking proxies/instances

* Also copy over the meta data to keep the correct cursor/index

* When we sync checks to the ProxyInstance replace rather than accumulate
2021-01-29 15:51:23 +00:00
John Cowen 25f989753b
ui: Adds @NullValue attr decorator (#9587)
There are many places in the API where we receive a property set to
`null` which can then lead to defensive code deeper in the app in order
to guard for this type of thing when usually we are expecting an array
or for the property to be undefined using omitempty on the backend.

Previously we had two places where we would deal with this in the
serializer using our 'remove-null' util (KV and Intentions).

This new decorator lets you declaritively define this type of data using
a decorator @NullValue([]) (which would replce a null value with [].

@NullValue in turn uses a more generic @replace helper, which we
currently don't need but would let you replace any value with another,
not just a null value.

An additional benefit here is that the guard/replacement is executed
lazily when we get the property instead of serializing all the values
when they come in via the API. On super large datasets, where we only
visualize part of the dataset (say in our scroll panes), this feels like
a good improvement on the previous approach.
2021-01-27 10:41:24 +00:00
John Cowen 92f0eb3bdc
ui: Re-organize our %h* placeholders (#9584)
We've always had this idea of being able to markup up information
semantically without thinking about what it should look like, then
applying our %h* placeholder styles to control what the information
should look like.

Back when we originally made our set of %h* placeholders, we tried to
follow Structure as much as possible, which defined the largest header
(which we thought would have been the h1 style) as a super large 3.5rem.

Therefore we made our set of %h* placeholders the same as Structure
beginning at a huge 3.5 size. We then re-overwrote those sizes only in
Consul specific CSS files thinking that this was due to us existing
before Structure did.

Lately we saw an extra clue in Structure - the extra large 3.5 header was
called 'h0'.

This commit moves all our headers to use a zero based scale, and
additionally uses our 3 digit scale as opposed to 1 digit (h1 vs h100),
similar to our color scales (note we don't use a hypen, which we can
alter later if need be), which means we can insert additional h150 etc
if need be.

Additional we stop styling our headers globally (h1 { @extend %h100; }
). This means there is no reason not to use headers for marking up
content depending on what it is rather than what it should look like,
and as a consequence means we can be more purposeful in ordering h*
tags.

Lastly, we use the new scale over the entire codebase and update a
couple of places where we were using using header tags due to what the
styleing for them looked like rather than what the meaning/order was.
2021-01-26 17:53:45 +00:00
John Cowen 82a62cd2ed
ui: Sidebar navigation / redesign (#9553)
* CSS for moving from a horizontal main menu to a side/vertical one
* Add <App /> Component and rearrange <HashcorpConsul /> to use it

1. HashicorpConsul now uses <App />
2. <App /> is now translated and adds 'skip to main content' functionality
3. Adds ember-in-viewport addon in order to visibly hide main navigation
items in order to take them out of focus/tabbing
4. Slight amends to the dom service while I was there
2021-01-26 17:40:33 +00:00
Jeff Escalante 09d9176188
Trailing ui/vercel fixes (#9633)
* update ui staging for vercel

* move vercel.json

* missed a couple things, sorry
2021-01-25 14:02:45 -05:00
Jeff Escalante 88d5e00f99
Update UI staging build for vercel hosting (#9628)
* update ui staging for vercel

* move vercel.json

* add a couple more settings

* fix comments
2021-01-25 13:46:20 -05:00
John Cowen bb95738321
ui: Search/filtering 'Filtered by:' search status (#9442)
Adds a 'status' for the filtering/searching in the UI, without this its not super clear that you are filtering a recordset due to the menu selections being hidden once closed. You can also use the pills in this status view to delete individual filters.
2021-01-25 18:13:54 +00:00
John Cowen 02772e46a2
Fix -ui-content-path without regex (#9569)
* Add templating to inject JSON into an application/json script tag

Plus an external script in order to pick it out and inject the values we
need injecting into ember's environment meta tag.

The UI still uses env style naming (CONSUL_*) but we uses the new style
JSON/golang props behind the scenes.

Co-authored-by: Paul Banks <banks@banksco.de>
2021-01-20 18:40:46 +00:00
Kenia ffb6680e76
ui: Removing formatting to display LockDelay in nanoseconds (#9594)
* Removing formatting to display LockDelay in nanoseconds

* Update test

* Add changelog
2021-01-20 12:03:08 -05:00
John Cowen 30014ff8fe
ui: Convert Service.GatewayConfig to a model fragment (#9586)
* ui: Convert Service.GatewayConfig to a model fragment

We added the ember-intl addon, which has its own format-number helper.
We replaced our own similarly named helper with this one, but the
ember-intl one is far stricter and errors if the arguments passed are
undefined. Our previously one would cope with this.

We'd rather continue to use the stricter ember-intl helper, so here we
convert the GatewayConfig property to a model fragment so that we can
give the GatewayConfig.AssociatedServices property a default zero value.
2021-01-20 15:36:23 +00:00
John Cowen be694366a7
ui: Topology intention saving improvements (#9513)
* ui: Keep track of existing intentions and use those to save changes

Previously we risked overwriting existing data in an intention if we
tried to save an intention without having loaded it first, for example
Description and Metadata would have been overwritten.

This change loads in all the intentions for an origin service so we can
pick off the one we need to save and change to ensure that we don't
overwrite any existing data.
2021-01-19 15:40:39 +00:00
John Cowen 41a4a9f4fb
ui: Improves the 'you must provide ... to `generate`' error from href-to (#9514)
This originally comes form the ember-href-to helper and is one of those
errors that when I see it I think ... hmmm

This gives a little bit more of a clue as to what is wrong by logging
the route name you asked for plus the params you passed to it so you:

1. Have more help finding the href-to that is problematic in the
template/component
2. Can see all the parameters you passed (including a potential null
parameter for the thing you are missing)
2021-01-19 15:25:37 +00:00
John Cowen 1e30503ece
ui: Show a feedback icon instead of a learn icon in the help menu (#9552) 2021-01-13 09:41:25 +00:00
Kenia b86eea4fba
ui: Rename a model attribute to not be overwritten by ember-data (#9524)
* Rename a model attr to not be overwritten by ember-data

* Make sure we can click on the instances

* Make sure we can click back to the preevious page, not root

* Add a forwards/back/forwards navigation test for service instances

* Rename a model attr to not be overwritten by ember-data

Co-authored-by: John Cowen <jcowen@hashicorp.com>
2021-01-12 09:53:21 -05:00
John Cowen e893ba7ea0
ci: Explicitly specify a default target, don't use the first target (#9521) 2021-01-07 19:04:45 +00:00
John Cowen 512ad836bc
ui: Add license checker to the workspace plus CI (#9507)
* ui: Adds license-checker plus manually run package script
2021-01-06 18:37:21 +00:00
John Cowen 1304dc8820
ui: Adds localStorage to <html class=""> mapping for user controlled theming (#9496) 2021-01-05 17:40:28 +00:00
John Cowen a42e844ccc
ui: Add EmptyState for exposed paths, plus additional details (#9445)
* ui: Add EmptyState for exposed paths, plus additional details

1. Add the port to the combined address
2. Use the proxy address for the ip address used

* Convert to glimmer component

* Add spaces to ListenerPort and LocalPathPort Tooltips
2021-01-05 16:59:16 +00:00
John Cowen 17438020f1
ui: Accessibility scan improvements (#9485)
* ui: Remove all vestiges of role=tabpanel

* Switch out tablist role for a label, default to Secondary

* Move healthcheckout-output headers to h2, ideally these would be outside the component

* Add aria-label for empty button

* Fix up non-unique ids in topology component

* Temporarily fixup h2 in KV > LockSession

* Fixup dl with no dt

* h3 > h2

* Fix up page objects that were reliant on ids
2021-01-05 10:05:59 +00:00
John Cowen d0ebb2b774
ui: Fix up erroneously placed conditional (#9447)
This meant that when where were no upstreams, no message would show
telling you of that fact. This commit means an EmptyState will now show instead.
2021-01-05 10:04:03 +00:00
John Cowen 8c9d5ecc2b
ui: [BUGFIX] Role/Policy selector default sort (#9434)
* Sort the options when they aren't being searched
2021-01-04 18:28:35 +00:00
John Cowen 4480302883
ui: [BUGFIX] Request intention listing with ns parameter (#9432)
This PR adds the ns=* query parameter when namespaces are enabled to keep backwards compatibility with how the UI used to work (Intentions page always lists all intention across all namespace you have access to)

I found a tiny dev bug for printing out the current URL during acceptance testing and fixed that up while I was there.
2021-01-04 17:22:10 +00:00
John Cowen 8c0473a622
ui: [BUGFIX] Ensure namespace is used for node API requests (#9410)
Nodes themselves are not namespaced, so we'd originally assumed we did not need to pass through the ns query parameter when listing or viewing nodes.

As it turns out the API endpoints we use to list and view nodes (and related things) return things that are namespaced, therefore any API requests for nodes do require a the ns query parameter to be passed through to the request.

This PR adds the necessary ns query param to all things Node, apart from the querying for the leader which only returns node related information.

Additionally here we decided to show 0 Services text in the node listing if there are nodes with no service instances within the namespace you are viewing, as this is clearer than showing nothing at all. We also cleaned up/standardized the text we use to in the empty state for service instances.
2021-01-04 16:42:44 +00:00
John Cowen 99f102705d
ui: Fuzzy and Regex searching (#9424)
Moves search things around to match an interface that can be switched in and out of fuzzy searching using fuse.js. We add both fuzzy searching and regex based searching to the codebase here, but it is not yet compiled in.
2020-12-18 10:38:15 +00:00
John Cowen 25d6a1277e
ui: Use InformedAction for KV table row delete confirmations (#9425) 2020-12-18 09:03:25 +00:00
Kenia c7d9177775
ui: Add Local flag to local dc in dropdown (#9419)
* Add Local flag to local dc in dropdown

* Remove brand color from the check

* Move styling to main-nav-horizonal styling sheets
2020-12-17 13:57:07 -05:00
John Cowen 2e3a66efb7
ui: Misc changes for Catalog area (#9414)
* Use DataLoader errors for Service Detail and Service Instance

* uiCfg > config use the repo-like async interface where possible

* Clean up node show

* Make sure you can put `=` in dev cookie values

* Never default to default

* Tweak chain variable

* Remove env service

* Pass chain through to the template for the tempalte to clean it up

* Delete controller tests

* Remove cleanup in Nodes show as this is still being used in another tab

* Use dc.Local
2020-12-17 16:35:01 +00:00
John Cowen 635cf4dc93
ui: Change references to L7 to say Layer 7 (#9412) 2020-12-17 16:04:05 +00:00
John Cowen 66cc91c69a
ui: Show the No Dependencies message when a Topology has no streams (#9413)
Also changes the upstreams docs link
2020-12-17 15:26:48 +00:00
John Cowen 0ca54c608b
ui: Add new dev UI environment variables to the README (#9411) 2020-12-16 16:40:31 +00:00
John Cowen 4404b4f44c
ui: Set overflow: auto on the tab nav (#9402)
This ensures scroll bars are mainly hidden, yet visible on small screens
if the tabs are large enough for there to be an overflow
2020-12-16 09:19:00 +00:00
John Cowen d602b303e1
ui: Rearrange Service detail page to load Topology and Routing tabs separately (#9401) 2020-12-16 09:18:29 +00:00
Kenia a919b60f5c
ui: Return empty state for no health check in Topology Cards (#9403) 2020-12-15 14:32:03 -05:00
John Cowen e921b3cf9a
ui: Install ember-intl (#9399)
* ui: Install ember-intl

Also:

1. Removes our own format-number in order to use ember-intl's instead
2. Moves format-time to format-short-time so as to not clash with
ember-intls own format-time
2020-12-15 18:29:32 +00:00
John Cowen 5e150d7f04
ui: Lint get-environment.js (#9400) 2020-12-15 18:14:25 +00:00
John Cowen 9f07871971
ui: Use InformedAction for intention confirmation dialogs (#9398) 2020-12-15 16:33:05 +00:00
John Cowen f111d6b3e3
ui: Dev/Test environment configurable metrics (#9345)
In order to test certain setups for our metrics visualizations we need to be able to setup several different `ui_config` settings during development/testing. Generally in the UI, we use the Web Inspector to set various cookie values to configure the UI how we need to see it whilst developing, so this PR:

1. Routes `ui_config` through a dev time only `CONSUL_UI_CONFIG` env variable so we can change it via cookies vars.
2. Adds `CONSUL_METRICS_PROXY_ENABLE`, `CONSUL_METRICS_PROVIDER` and `CONSUL_SERVICE_DASHBOARD_URL` so it's easy to set/unset these only values during development.
3. Adds an acceptance testing step so we can setup `ui_config` to whatever we want during testing.
4. Adds an async 'repository-like' method to the `UiConfig` Service so it feels like a repository - incase we ever need to get this via an HTTP API+blocking query.
5. Vaguely unrelated: we allow cookie values to be set via the location.hash whilst in development only e.g. `/ui/services#CONSUL_METRICS_PROXY_ENABLE=1` so we can link to different setups if we ever need to.

All values added here are empty/falsey by default, so in order to see how it was previously you'll need to set the appropriate cookies values, but you can now also easily preview/test the the metrics viz in different/disabled states (with differing `ui_config`)
2020-12-15 15:34:54 +00:00
John Cowen 14d043e5f8
ui: Show local datacenter by default on first visit (#9377)
* Add `Local` property to Datacenters

* If you have not previous datacenter, redirect the user to the local dc

* Add an `is-local` class to the local datacenter in the DC picker
2020-12-14 15:29:40 +00:00
John Cowen d6f27c6564
ui: Move linting to the `node:test` script (#9385)
* Reconfigure linting to be a node-test

* Fixup linting across the project
2020-12-14 15:28:35 +00:00
John Cowen 4e419b9b37
ui: Add External Sources Filter to Node > Service Instances (#9368)
* Add service collections to get all ExternalServices

* Add a basic collection helper

* Use the collections to get all ExternalSources

* Remove old Controllers
2020-12-14 14:25:33 +00:00
John Cowen 514270a413
ui: Controller dead code removal (#9367)
* ui: Controller dead code removal

This commit removes a little code that became 'dead' as a result of
previous PRs/commits

* Remove a little more from the settings Controller

* Remove CSS related to being able to set the dashboard_url in settings
2020-12-11 11:43:13 +00:00
John Cowen 0f7c909f13
ui: Improved Discovery Chain resizing (#9360)
* install on-resize modifier

* Rerrange things to use on-resize modifier for positioning
2020-12-11 09:38:33 +00:00
John Cowen 21e5a8f0f3
ui: Remove random undefined from codemod run (#9370) 2020-12-11 09:33:43 +00:00
John Cowen 9d81319074
ui: Use pill/badge components for intention filter options (#9357) 2020-12-09 19:12:57 +00:00
John Cowen 2c3b6aec05
ui: Remove old style 'filterable' searching (#9356)
* Switch upstream-instances to use new style of searchable

* Add search action to DataCollection plus basic README

* Use DataCollection for PowerSelect searching in child-selectors

* Remove old style filterable search for role/policies and instances

* Remove old helpers/components related to search/sort/filter
2020-12-09 19:12:17 +00:00