Commit Graph

18 Commits

Author SHA1 Message Date
John Cowen d98c1242dc
ui: Adds multi syntax linting to the code editor (#4814) 2018-10-19 17:36:38 +01:00
John Cowen 7d89e519a2 UI: New ACLs (#4789)
UI to accompany the new ACLs APIs
2018-10-19 08:45:05 -07:00
John Cowen 5f39bfd161
ui: Improve layout of node cards on large and small screens (#4761)
1. The grid based unhealthy cards are now clamped to only four wide
maximum. This means that on larger screen the cards are much wider
meaning you can view more information. Grid gutters are also clamped at
a certain ideal width screen, remaining responsive for anything below
this.

2. The healthy node columns are finally responsive following the same
column rules as unhealthy nodes
2018-10-11 10:19:06 +01:00
John Cowen 99c51c9f86
UI: Reduce in-development deprecations (also use toLocaleString) (#4677)
Various ember addons produced deprecation messages, some in the browser
console and some in terminal. Upgrading and replacing some of these has
reduced this.

Upgrades:

- ember-collection
- ember-computed-style

Replacements:

- ember-pluralize replaced with ember-inflector
- ember-cli-format-number replaced with custom helper using standard
`toLocaleString`

Removing ember-cli-format-number also meant some further changes related
to decimal places in the tomography graph, done using `toFixed`

The ExternalSources background-images have also now been escaped
correctly preventing in-development `console` warnings.

The only deprecation warnings are now from ember-block-slots, only in
terminal, making for a better development experience overall, especially now we
have an empty browser console

Also adds a `callIfType` 'helper util' which is a util specifically for helpers (it conforms to a helper argument signature) to be expanded upon later.
2018-10-01 13:42:42 +01:00
John Cowen ece09e300d
UI: Tooltips and feedback-dialogs are the same thing - merge (#4678) 2018-09-21 11:13:21 +01:00
John Cowen d0405ba8b9
UI: CSS Additions (mainly %frames) (#4623)
* Move almost everything to use %frames
* Fix pill styles of ACL types
* Remove horizontal scrollbars from dom recycling scroller component
* Make text areas look ok in Firefox
* Remove ember-bulma-css
* New form elements, break out %toggle
* %button design tweaks
* %form-element design tweaks
* Better hashicorp logo
* Small screen CSS improvements (#4624)
  1. Reduce header size when there are no breadcrumbs
  2. Make the filters toggleable, closed by default
  3. Reduce the size of the footer on small screens
  4. Hide all non-primary columns for forms
  5. Slightly change the layout of various items, mainly buttons within
forms
  6. Make some confirmation dialogs work vertically on small screens. Guessing we might be better just using native confirmations on small
screens
2018-09-21 10:18:32 +01:00
John Cowen 5ea748005c
UI: External Source markers (#4640)
1. Addition of external source icons for services marked as such.
2. New %with-tooltip css component (wip)
3. New 'no healthcheck' icon as external sources might not have
healthchecks, also minus icon on node cards in the service detail view
4. If a service doesn't have healthchecks, we use the [Services] tabs as the
default instead of the [Health Checks] tab in the Service detail page. 
5. `css-var` helper. The idea here is that it will eventually be
replaced with pure css custom properties instead of having to use JS. It
would be nice to be able to build the css variables into the JS at build
time (you'd probably still want to specify in config which variables you
wanted available in JS), but that's possible future work.

Lastly there is probably a tiny bit more testing edits here than usual,
I noticed that there was an area where the dynamic mocking wasn't
happening, it was just using the mocks from consul-api-double, the mocks
I was 'dynamically' setting happened to be the same as the ones in
consul-api-double. I've fixed this here also but it wasn't effecting
anything until actually made certain values dynamic.
2018-09-12 20:23:39 +01:00
John Cowen 981882d5ff
UI: Bugfix. Remove split view code editor (#4615)
When adding an auto resizing (heightwise) code editor, the
ivy-codemirror plugin seems to do this using more nested divs. This div
had a horizontal scroller but couldn't be seen on some platforms (with
hidden scrollbars). This commit makes the code editor slightly more
usable and more visually correct by removing the scroll bar in this div
to stop producing the 'split view look', yet keeping the horizontal
scroller at the bottom of the code editor for when you enter code that
is wider than the area. A max-width has also been added here to prevent
the text area from growing off the side of the page.

Another improvement to the code editor here is the addition of a nicer
color for hightlighting text selection so its at least visible.

Lastly, there was a way you could get the bottom horizontal scrollbar to overlay
the code in the editor. This makes sure there is always some space at
the bottom of the editor to make sure the code won't be obscured
2018-09-12 20:18:12 +01:00
John Cowen 40e71f1b91
UI: Simplify/refactor the actions/notification layer (#4572) + (#4573)
* Move notification texts to a slightly different layer (#4572)
* Further Simplify/refactor the actions/notification layer (#4573)

1. Move the 'with-feedback' actions to a 'with-blocking-action' mixin
which better describes what it does
2. Additional set of unit tests almost over the entire layer to prove
things work/add confidence for further changes

The multiple 'with-action' mixins used for every 'index/edit' combo are
now reduced down to only contain the functionality related to their
specific routes, i.e. where to redirect.

The actual functionality to block and carry out the action and then
notify are 'almost' split out so that their respective classes/objects do
one thing and one thing 'well'.

Mixins are chosen for the moment as the decoration approach used by
mixins feels better than multiple levels of inheritence, but I would
like to take this fuether in the future to a 'compositional' based
approach.

There is still possible further work to be done here, but I'm a lot
happier now this is reduced down into separate parts.
2018-08-29 19:14:31 +01:00
John Cowen 1b3d566a7a
UI: Begin unskipping some more trivial tests (#4574)
WIP Unskip some lower level trivial tests.

This is the beginning of work to unskip some of the more trivial tests that I'd skipped a while back (if the thing they are testing broke, they would have failed higher up in other acceptance tests).

I'd rather keep the tests, as they do test things in a more isolated manner, and the plan was to always come back and work to unskip them time allowing.

I didn't get to far into this work in progress here, but I'd rather merge what I've done all the same and come back at a later date and continue.
2018-08-29 09:59:02 +01:00
John Cowen 310a038f87 Show Service.ID's throughout the app, allow searching by Service.ID
1. In the Services > Services detail page for both healthy and unhealthy
nodes, also add searching by Service.ID here
2. In the Nodes > Node detail > [Services] tab only if its different
from the Service name, add searching by Service.ID here
2018-07-12 13:36:47 +01:00
John Cowen b445df39bb Use html5 oninput instead of onkeyup for native textual inputs
This enables people to enter things using the mouse to paste for
example, plus possible other things.

As an aside it also answers my query regarding `fillIn` for testing,
nothing needs to be actually _typed_ anymore! Doh
2018-07-03 15:40:15 +01:00
John Cowen f600d8fcc9 Move intentions menu item to after ACLs 2018-06-25 12:25:37 -07:00
John Cowen b38e5df630 WIP: First draft intentions
1. Listing, filtering by action and searching by source name and
destination name
2. Edit/Create page, edits ping the API double fine, need to work through
creates and deletes
3. Currently uses a `Precedence` intention keyname that doesn't yet
exist in the real API
2018-06-25 12:25:14 -07:00
John Cowen 005fbcd149 Add searching ACL's by token 2018-06-14 13:06:02 +01:00
John Cowen 17ebf96755 WIP: Feature/acceptance tests 2018-06-12 11:24:35 +01:00
John Cowen 6489f1c401 Auto calculate the height of the tables depending on the space left
Additionally make the footer lookup more unique seeing as we are in js
here
2018-06-12 11:24:35 +01:00
John Cowen e5eeb0aa7c
UI V2 (#4086)
* Move settings to use the same service/route API as the rest of the app

* Put some ideas down for unit testing on adapters

* Favour `Model` over `Entity`

* Move away from using `reopen` to using Mixins

* Amend messages, comment/document some usage

* Make sure the returns are consistent in normalizePayload, also

Add some todo's in to remind me to think consider this further at a
later date. For example, is normalizePayload to be a hook or an
overridable method

* Start stripping back the HTML to semantics

* Use a variable rather than chaining

* Remove unused helpers

* Start picking through the new designs, start with listing pages

* First draft HTML for every page

* Making progress on the CSS

* Keep plugging away at the catalog css

* Looking at scrolling

* Wire up filtering

* Sort out filter counting, more or less done a few outstanding

* Start knocking the forms into shape

* Add in codemirror

* Keep moving forwards with the form like layouts

* Start looking at ACL editing page, add footer in

* Pull the filters back in, look at an autoresizer for scroll views

* First draft toggles

* 2nd draft healthcheck icons

* Tweak node healthcheck icons

* Looking at healthcheck detail icons

* Tweak the filter-bar and add selections to the in content tabs

* Add ACL create, pill-like acl type highlight

* Tweaking the main nav some more

* Working on the filter-bar and freetext-filter

* Masonry layout

* Stick with `checks` instead of healthy/unhealthy

* Fix up the filter numbers/counts

* Use the thead for a measure

* First draft tomography back in

* First draft DC dropdown

* Add a temporary create buttong to kv's

* Move KV and ACL to use a create page

* Move tags

* Run through old tests

* Injectable server

* Start adding test attributes

* Add some page objects

* More test attributes and pages

* Acl filter objects

* Add a page.. page object

* Clickable items in lists

* Add rest/spread babel plugin, remove mirage for now

* Add fix for ember-collection

* Keep track of acl filters

* ember-cli-page-object

* ember-test-selectors

* ui: update version of ui compile deps

* Update static assets

* Centralize radiogroup helper

* Rejig KV's and begin to clean it up

* Work around lack of Tags for the moment..

* Some little css tweaks and start to remove possibles

* Working on the dc page and incidentals

1. Sort the datacenter-picker list
2. Add a selected state to the datacenter-picker
3. Make dc an {Name: dc}
4. Add an env helper to get to 'env vars' from within templates

* Click outside stuff for the datacenter-picker, is-active on nav

* Make sure the dropdown CTA can be active

* Bump ember add pluralize helper

* Little try at sass based custom queries

* Rejig tablular collection so it deals with resizing, actions

1. WIP: start building actions dropdowns
2. Move tabular collection to deal with resizing to rule out differences

* First draft actions dropdowns

* Add ports, selectable IP's

* Flash messages, plus general cleanup/consistency

1. Add ember-cli-flash for flash messages
2. Move everything to get() instead of item.get
3. Spotted a few things that weren't consistent

* DOn't go lower than zero

* First draft vertical menu

* Missed a get, tweak dropmenu tick

* Big cleanup

1. this.get(), this.set() > get(), set()
2. assign > {...{}, ...{}}
3. Seperator > separator

* WIP: settings

* Moved things into a ui-v2 folder

* Decide on a way to do the settings page whilst maintaining the url + dc's

* Start some error pages

* Remove base64 polyfill

* Tie in settings, fix atob bug, tweak layout css

* Centralize confirmations into a component

* Allow switching between the old and new UI with the CONSUL_UI_BETA env var

Currently all the assets are packaged into a single AssetFS and a prefix is configured to switch between the two.

* Attempt at some updates to integrate the v2 ui build into the main infrastructure

* Add redirect to index.html for unknown paths

* Allow redictor to /index.html for new ui when using -ui-dir

* Take ACLs to the correct place on save

* First pass breadcrumbs

* Remove datacenter selector on the index page

* Tweak overall layout

* Make buttons 'resets'

* Tweak last DC stuff

* Validations plus kv keyname viewing tweaks

* Pull sessions back in

* Tweak the env vars to be more reusable

* Move isAnon to the view

* No items and disabled acl css

* ACL and KV details

1. Unauthorized page
2. Make sure the ACL is always selected when it needs it
3. Check record deletion with a changeset

* Few more acl tweaks/corrections

* Add no items view to node > services

* Tags for node > services

* Make sure we have tags

* Fix up the labels on the tomography graph

* Add node link (agent) to kv sessions

* Duplicate up `create` for KV 'root creation'

* Safety check for health checks

* Fix up the grids

* Truncate td a's, fix kv columns

* Watch for spaces in KV id's

* Move actions to their own mixins for now at least

* Link reset to settings incase I want to type it in

* Tweak error page

* Cleanup healthcheck icons in service listing

* Centralize errors and make getting back easier

* Nice numbers

* Compact buttons

* Some incidental css cleanups

* Use 'Key / Value' for root

* Tweak tomography layout

* Fix single healthcheck unhealthy resource

* Get loading screen ready

* Fix healthy healthcheck tick

* Everything in header starts white

* First draft loader

* Refactor the entire backend to use proper unique keys, plus..

1. Make unique keys form dc + slug (uid)
2. Fun with errors...

* Tweak header colors

* Add noopener noreferrer to external links

* Add supers to setupController

* Implement cloning, using ember-data...

* Move the more expensive down the switch order

* First draft empty record cleanup..

* Add the cusomt store test

* Temporarily use the htmlSafe prototype to remove the console warning

* Encode hashes in urls

* Go back to using title for errors for now

* Start removing unused bulma

* Lint

* WIP: Start looking at failing tests

* Remove single redirect test

* Finish off error message styling

* Add full ember-data cache invalidation to avoid stale data...

* Add uncolorable warning icons

* More info icon

* Rearrange single service, plus tag printing

* Logo

* No quotes

* Add a simple startup logo

* Tweak healthcheck statuses

* Fix border-color for healthchecks

* Tweak node tabs

* Catch 401 ACL errors and rethrow with the provided error message

* Remove old acl unauth and error routes

* Missed a super

* Make 'All' refer to number of checks, not services

* Remove ember-resizer, add autoprefixer

* Don't show tomography if its not worth it, viewify it more also

* Little model cleanup

* Chevrons

* Find a way to reliably set the class of html from the view

* Consistent html

* Make sure session id's are visible as long as possible

* Fix single service check count

* Add filters and searchs to the query string

* Don't remember the selected tab

* Change text

* Eror tweaking

* Use chevrons on all breadcrumbs even in kv's

* Clean up a file

* Tweak some messaging

* Makesure the footer overlays whats in the page

* Tweak KV errors

* Move json toggle over to the right

* feedback-dialog along with copy buttons

* Better confirmation dialogs

* Add git sha comment

* Same title as old UI

* Allow defaults

* Make sure value is a string

* WIP: Scrolling dropdowns/confirmations

* Add to kv's

* Remove set

* First pass trace

* Better table rows

* Pull over the hashi code editor styles

* Editor tweaks

* Responsive tabs

* Add number formatting to tomography

* Review whats left todo

* Lint

* Add a coordinate ember data triplet

* Bump in a v2.0.0

* Update old tests

* Get coverage working again

* Make sure query keys are also encoded

* Don't test console.error

* Unit test some more utils

* Tweak the size of the tabular collections

* Clean up gitignore

* Fix copy button rollovers

* Get healthcheck 'icon icons' onto the text baseline

* Tweak healthcheck padding and alignment

* Make sure commas kick in in rtt, probably never get to that

* Improve vertical menu

* Tweak dropdown active state to not have a bg

* Tweak paddings

* Search entire string not just 'startsWith'

* Button states

* Most buttons have 1px border

* More button tweaks

* You can only view kv folders

* CSS cleanup reduction

* Form input states and little cleanup

* More CSS reduction

* Sort checks by importance

* Fix click outside on datacenter picker

* Make sure table th's also auto calculate properly

* Make sure `json` isn't remembered in KV editing

* Fix recursive deletion in KV's

* Centralize size

* Catch updateRecord

* Don't double envode

* model > item consistency

* Action loading and ACL tweaks

* Add settings dependencies to acl tests

* Better loading

* utf-8 base64 encode/decode

* Don't hang off a prototype for htmlSafe

* Missing base64 files...

* Get atob/btoa polyfill right

* Shadowy rollovers

* Disabled button styling for primaries

* autofocuses only onload for now

* Fix footer centering

* Beginning of 'notices'

* Remove the isLocked disabling as we are letting you do what the API does

* Don't forget the documentation link for sessions

* Updates are more likely

* Use exported constant

* Dont export redirectFS and a few other PR updates

* Remove the old bootstrap config which was used for the old UI skin

* Use curlies for multiple properties
2018-05-10 19:52:53 +01:00