27 Commits (7e750968bc4eca4b0adfed8c995e7981565c8911)

Author	SHA1	Message	Date
John Cowen	ee0e8bf500	ui: App-ify Lock Sessions (#12482) ... This commit moves our in-app LockSessions code into an external 'app', which can theoretically be side-loaded but for now it just makes for good isolation/code hygiene. Functionally, there is kind of one change here, and that is we only show the 'Lock Session' tab if you have permissions to see them. Currently as our UI authorization endpoint needs to be changed slightly to suit our usecase, you will always have permissions to see Lock Sessions as we hardcode the session:read to true (obvs this is a frontend thing, not a backend thing), so it doesn't really change anything from a user perspective. Also added very bare docs while I was here. Small note here, ideally we need to add the each individual tab depending on whether an 'app' is enabled or not instead of just permissions, ideally it would be done totally from The Outside rather than a can based conditional on the inside, just something else to be thinking about for the future.	3 years ago
John Cowen	2168a44413	ui: Add CustomElement Transform (#12540) ... This PR adds an Ember-Glimmer/Handlebars transform to drop the documentation copy from the CustomElement component out of the build, therefore it is not bundled into the code either at development time or production build time.	3 years ago
John Cowen	9b22300c59	ui: Start using mermaid state diagrams in our docs (#12350)	3 years ago
John Cowen	39f15306d9	ui: Change approach to loading debug.css (#12242) ... We need a way to load certain CSS based on the environment you are viewing, i.e. we have debug CSS that we use for our Eng Documentation and various other DX utilities that shouldn't be compiled into our production or test builds. Previously we would compile two entirely different CSS files (app and debug) and the load one or the other depending on which environment you were in. This approach just empties out the debug.css file in certain environments (prod/test) which means we can just import that file from app. When in staging/development this imports the contents of debug.css (quite a bit of CSS) whereas when building for production/test this debug.css is emptied out during the build process. There is a slight little hack in order to have this work, we import _debug.scss which imports the debug.scss file. I couldn't for the life of me figure out how to have broccoli empty out a file during the build process, so instead we essentially copy over debug.scss during dev and create an empty file during prod to _debug.scss. When using make build to build an artifact for production CSS remains at ~58kb (during dev its a lot bigger than this)	3 years ago
John Cowen	48ace89c6a	ui: Runtime Injectable Components (#11969) ... - Simplifies how we 'import' our configuration files a little in order to make them more grokable. - Starts to exclude files based on explicit configuration rather than convention. - Adds the first instance of us being able to select an implementation (of multiple) of a component at runtime.	3 years ago
James Tran	d1ac40e967	ui: Add XML syntax highlighting to key/value editor (#11785) ... * ui: Add XML syntax highlighting to key/value editor * ui: Make explicit options that are specific to XML for clarity	3 years ago
John Cowen	26341f0b05	ui: Move nspace CRUD to use the same approach as partitions (#11633) ... This sounds a bit 'backwards' as the end goal here is to add an improved UX to partitions, not namespaces. The reason for doing it this way is that Namespaces already has a type of 'improved UX' CRUD in that it has one to many relationship in the form when saving your namespaces (the end goal for partitions). In moving Namespaces to use the same approach as partitions we: - Ensure the new approach works with one-to-many forms. - Test the new approach without writing a single test (we already have a bunch of tests for namespaces which are now testing the approach used by both namespaces and partitions) Additionally: - Fixes issue with missing default nspace in the nspace selector - In doing when checking to see that things where consistent between the two, I found a few little minor problems with the Admin Partition CRUD so fixed those up here also. - Removed the old style Nspace notifications	3 years ago
John Cowen	2ef9ea00b1	ui: When certain menus are selected reset either nspace/partition (#11479) ... For our dc, nspace and partition 'bucket' menus, sometimes when selecting one 'bucket' we need to reset a different 'bucket' back to the one that your token has by default (or the default if not). For example when switching to a different partition whilst you are in a non-default namespace of another partition, we need to switch you to the token default namespace of the partition you are switching to.	3 years ago
John Cowen	ed6918c6c2	ui: Improve dev-time SSO/OIDC visibility (#11248) ... This commit tries to make the development experience of working on our OIDC support a little more realistic, essentially by creating our own OIDC provider in our application (only during development builds). You can still provide a real OIDC provider to work with via our dev time environment/cookie variables as before, just now we default to the behaviour in this commit. Overall this makes it much easier to verify our OIDC support in the UI, and also opens up avenues for us to be able to test more scenarios that we couldn't before (for example not only successful logins, but also erroneous, potentially with multiple error reasons).	3 years ago
John Cowen	baa377ddca	ui: Adds initial CRUD for partitions (#11188) ... * Add `is` and `test` helpers in a similar vein to `can` Adds 2 new helpers in a similar vein to ember-cans can: - `is` allows you to use vocab/phrases such as (is "something model") which calls isSomething() on the models ability. - `test` allows you to use vocab/phrases such as (test "is something model") or (test "can something model")which calls isSomething() / canSomething() on the models ability. Mostly using the is helper and the can helper. It's basically the is/can helper combined. * Adds TextInput component + related modifiers/helpers/machines/services (#11189) Adds a few new components/modifiers/helpers to aid building forms. - state-chart helper, used in lieu of a more generic approach for requiring our statecharts. - A few modifications to our existing disabled modifier. - A new 'validation' modifier, a super small form validation approach built to make use of state charts (optionally). Eventually we should be able to replace our current validation approach (ember-changeset-validations + extra deps) with this. - A new TextInput component, which is the first of our new components specifically to make it easy to build forms with validations. This is still a WIP, I left some comments in pointing out where this one would be progressed, but as we don't need the planned functionality yet, I left it where it was. All of this will be fleshed out more at a later date. Documentation is included for all of ^ * ui: Adds initial CRUD for partitions (#11190) Adds basic CRUD support for partitions. Engineering-wise probably the biggest takeaway here is that we needed to write very little javascript code to add this entire feature, and the little javascript we did need to write was very straightforwards. Everything is pretty much just HTML. Another note to make is that both ember-changeset and ember-data (model layer things) are now completely abstracted away from the view layer of the application. New components: - Consul::Partition::Form - Consul::Partition::List - Consul::Partition::Notifications - Consul::Partition::SearchBar - Consul::Partition::Selector See additional documentation here for more details New Route templates: - index.hbs partition listing/searching/filtering - edit.hbs partition editing and creation Additionally: There is some additional debug work here for better observability and to prevent any errors regarding our href-to usage when a dc is not available in our documentation site. Our softDelete functionality has been DRYed out a little to be used across two repos. isLinkable was removed from our ListCollection component for lists like upstream and service listing, and instead use our new is helper from within the ListCollection, meaning we've added a few more lighterweight templateOnly components. * ui: Exclude all debug-like files from the build (#11211) This PR adds **/*-debug.* to our test/prod excluded files (realised I needed to add test-support.js also so added that here as its more or less the same thing). Conditionally juggling ES6 static imports (specifically debug ones) for this was also getting a little hairy, so I moved it all to use the same approach as our conditional routes. All in all it brings the vendor build back down to ~430kb gzipped.	3 years ago
John Cowen	e088d8674c	ui: Remove legacy ACLs (#11096)	3 years ago
John Cowen	3e80e637ba	ui: [BUGFIX] Fix KV Code Editor syntax loading (#10605) ... This commit adds a bit of string wrangling to avoid the keys in our javascript source file also being transformed. Additionally, whilst looking at this we decided that Maps are a better dictionary than javascript objects, so we moved to use those here also (but this doesn't affect the issue)	3 years ago
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.	4 years ago
Mike Morris	9801551f7c	ui: add data-enterprise-logo to logo svg for enterprise	4 years ago
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	4 years ago
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	4 years ago
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	4 years ago
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	4 years ago
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.	4 years ago
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>	4 years ago
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`)	4 years ago
John Cowen	d6f27c6564	ui: Move linting to the `node:test` script (#9385) ... * Reconfigure linting to be a node-test * Fixup linting across the project	4 years ago
Kenia	6ff094976e	ui: Fix up typo for the UI config template url (#9109)	4 years ago
John Cowen	1ef18c4b67	ui: Move mocks into the ui project (#9084) ... * Add consul-api-double under api * Update config to reflect api change * Remove consul-api-double as a dependency * api -> mock-api * Fixup mocks path for staging	4 years ago
Kenia	cdf5ba703f	ui: Remove downstream dc filter (#9040) ... * Remove datacenter filter and update props passed down * Merging changes fixed * Fixup tests for metrics link	4 years ago
Kenia	05411303b4	ui: Update Topology metrics dashboard and configuration links (#9002) ... * Update Topology metrics dashboard and configuration links * Fixup tests * Remove Dashboard Link from settings page * Removing use of settings Dashboard links	4 years ago
John Cowen	6589cbbd0d	ui: Move to Workspaced Structure (#8994) ... * ui: Add the most basic workspace root in /ui * We already have a LICENSE file in the repository root * Change directory path in build scripts ui-v2 -> ui * Make yarn install flags configurable from elsewhere * Minimal workspace root makefile * Call the new docker specific target * Update yarn in the docker build image * Reconfigure the netlify target and move to the higher makefile * Move ui-v2 -> ui/packages/consul-ui * Change repo root to refleect new folder structure * Temporarily don't hoist consul-api-double * Fixup CI configuration * Fixup lint errors * Fixup Netlify target	4 years ago