Commit Graph

227 Commits (b256313256e2af468d70a4251682545fb80b7600)

Author SHA1 Message Date
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 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