Commit graph

177 commits

Author SHA1 Message Date
Michael Lange bae7002c73 Show the nomad agent version of the agent the UI is served from 2020-10-25 23:52:06 -07:00
Michael Lange e0157759a8 Redo column widths on the topology page.
Now the info panel has a fixed width and the TopoViz will display as a
single column if the TopoViz column is too narrow for two columns.
2020-10-23 14:17:03 -07:00
Michael Lange 38a4a027aa Truncate text in the topo viz info panel 2020-10-23 14:17:03 -07:00
Buck Doyle c8caa810e9
Remove logo spin for prefers-reduced-motion (#9128)
Spinning is one of the triggers mentioned on this page:
https://webkit.org/blog/7551/responsive-design-for-motion/

Thanks to @fivetanley for mentioning that this exists.
2020-10-20 11:52:15 -05:00
Buck Doyle 70a0253f0d
Update loading spinner to be logo-based (#9106)
Thanks to @mikehobi, whose work here this is adapted from:
https://icons8.com/cssload/en/3d-loaders
2020-10-15 16:05:58 -05:00
Michael Lange 649873745f Treat legend term pairs as single wrapping elements 2020-10-15 10:30:34 -07:00
Michael Lange f3aed88a10 Improved curves for allocation associations 2020-10-15 02:54:15 -07:00
Michael Lange f27895c4c8 New FlexMasonry component implements a masonry layout using flexbox 2020-10-15 02:54:15 -07:00
Michael Lange fb1deb5c40 Updated alloc and cluster details on topo page 2020-10-15 02:54:14 -07:00
Michael Lange e4907dc647 Super rough allocation details, needs some style love 2020-10-15 02:54:14 -07:00
Michael Lange cab4e618fc Add cluster details to the topology page 2020-10-15 02:54:13 -07:00
Michael Lange 831d27efd6 Fleshing out the first prototype of the topology visualization 2020-10-15 02:54:13 -07:00
Michael Lange fc31f80880 Temporarily remove poststop from the UI
Since poststart and poststop are shipping separately, we can't ship them
both in the UI at the same time.
2020-08-31 19:32:38 -07:00
Buck Doyle de3504a738 Add poststart and poststop lifecycle phases 2020-08-26 09:55:42 -05:00
Michael Lange 09f6bca470 New ScaleEventsChart component
Displays all scale events in the form of an annotated line chart. When
annotations are clicked, the timestamp, message, and meta propeties for
the event are displayed below the chart.
2020-08-05 12:02:22 -07:00
Michael Lange 203f7e06b8 Present scaling events on the job task group page 2020-07-29 19:07:24 -07:00
Michael Lange 35054459c2 New fluid height modifier for the json viewer 2020-07-29 19:07:24 -07:00
Michael Lange 7ad214f34a StepperInput UX improvements
- Click label to focus input
- Focusing input selects value
- Entering an invalid value reverts selection
- Entering a fractional number floors the value
2020-06-30 11:54:11 -07:00
Michael Lange 5d491167de Reset font weight for tooltips 2020-06-30 11:54:11 -07:00
Buck Doyle bf7ed82def
Improve global search UX (#8249)
This updates the look of the search control, adds a hint about the slash
shortcut, adds highlighting of fuzzy search results, and addresses a few
edge case UX failures. It moves to using a fork of Ember Power Select
to handle an edge case where pressing escape would put the control
in an undesirable active-but-not-open state.
2020-06-25 08:51:52 -05:00
Buck Doyle ee7141a59a
Add phase 1 of global search (#8175)
This introduces a DataCaches service so recently-updated collections don’t need
to be requeried within a minute, or based on the current route. It only searches
jobs and nodes. There are known bugs that will be addressed in upcoming PRs.
2020-06-19 13:05:28 -05:00
Michael Lange 6259e3ae5d Integrate the stepper input with the task group page 2020-06-18 22:32:56 -07:00
Michael Lange ff3653ddf6 Style the StepperInput component 2020-06-18 22:08:28 -07:00
Michael Lange 64cfa62c71 Make sure buttons in a button bar have a very visible focus state 2020-06-18 22:08:27 -07:00
Michael Lange 76c6a9d89f Prevent inline definition key/value pairs from breaking the key and value onto separate lines 2020-06-18 22:08:27 -07:00
Michael Lange 2739da75d6 Additional button-bar treatments for use in a table row 2020-06-18 22:08:27 -07:00
Michael Lange dfcfdf0293 Extend button-bar support to buttons 2020-06-18 22:08:27 -07:00
Michael Lange 6cb83c6297 Inline-block the buttons to remove weird text-flow spacing 2020-06-16 10:23:36 -07:00
Michael Lange e0fbd88d26 Monitor component and query param interaction 2020-06-16 10:23:35 -07:00
Michael Lange 61a693c656 Refactor metrics styles to allow for standalone metrics 2020-05-13 08:36:04 -07:00
Jasmine Dahilig a9004faa11
UI: Add representations for task lifecycles (#7659)
This adds details about task lifecycles to allocations, task groups,
and tasks. It includes a live-updating timeline-like chart on allocations.
2020-04-30 08:15:19 -05:00
Buck Doyle 438aec636a
UI: update exec styles to match conventions (#7811) 2020-04-28 08:33:07 -05:00
Buck Doyle f10906e006
UI: add exec handling for dead jobs/task states (#7637)
This closes #7456. It hides the terminal when the job is dead and
displays an error when trying to open an exec session for a task
that isn’t running. There’s a skipped test for the latter behaviour
that I’ll have to come back for.
2020-04-06 14:08:22 -05:00
Buck Doyle fc7de8b153
UI: add live-updating to exec sidebar (#7499)
This closes #7454. It makes use of the existing watchable tools to
allow the exec popup sidebar to be live-updating. It also adds
alphabetic sorting of task groups and tasks.
2020-04-06 13:52:42 -05:00
Michael Lange 546751a9b4 Style the page size selector 2020-04-02 12:50:31 -07:00
Buck Doyle d70c3fbb3e
UI: Add exec loading template (#7566)
This closes #7460. Before this, there was an incongruous flash
of the non-exec UI during loading.
2020-03-31 13:59:43 -05:00
Buck Doyle 674da96a59
UI: add exec terminal (#6697)
This connects Xterm.js to a Nomad exec websocket so people
can interact on clients via live sessions. There are buttons on
job, allocation, task group, and task detail pages that open a
popup that lets them edit their shell command and start a
session.

More is to come, as recorded in issues.
2020-03-24 18:22:16 -05:00
Michael Lange ccefc46912
Merge pull request #7099 from hashicorp/b-ui/mobile-styles-not-full-width
UI: Override the max-width on mobile to avoid losing space due to non-existent gutter menu
2020-02-07 14:27:50 -08:00
Michael Lange 1431343d18 Override the max-width on mobile to avoid losing space due to non-existent gutter menu 2020-02-07 14:22:00 -08:00
Michael Lange c7543ee020 Explicit transparent bg on popover actions 2020-02-07 14:17:13 -08:00
Michael Lange 38d23b5ba8 Add an animation for the initializing state 2020-01-31 12:56:11 -08:00
Michael Lange f00a50a55b Redo the node-status-light CSS to be icon-based 2020-01-31 12:56:08 -08:00
Michael Lange 0f8ea7d37a Allow for an icon within the node status light 2020-01-31 12:55:55 -08:00
Michael Lange 7c6bf3b09c Increase the size and spacing of the toggle component 2020-01-23 16:34:35 -08:00
Michael Lange c7b7789bd4 Stack the popover menu under the subnav 2020-01-23 16:34:34 -08:00
Michael Lange 54d33f9ad7 Toggle bugs: focus and multiline alignment 2020-01-23 16:34:28 -08:00
Michael Lange 95e6068d5d New toggle component 2020-01-23 16:34:27 -08:00
Michael Lange 80642b8868 Modifiers to the two-step-button 2020-01-23 16:34:25 -08:00
Michael Lange 35671a3bd4 Fill in the drain strategy ribbon values 2020-01-23 16:34:22 -08:00
Michael Lange ada745a59f Let dropdowns assume their full width 2020-01-23 16:34:17 -08:00
Michael Lange 01d0efb317 Multiline modifier for tooltips 2020-01-23 16:34:15 -08:00
Michael Lange 75c9e80251 Update the dropdown styles to be more similar to button styles 2020-01-23 16:34:14 -08:00
Michael Lange 20f83da76a PopoverMenu component 2020-01-23 16:34:14 -08:00
Michael Lange 47daa980a5 Reformat the client detail page to use the two-row header design 2020-01-23 16:34:11 -08:00
Buck Doyle 66ab14144a
ui: Change Run Job availability based on ACLs (#5944)
This builds on API changes in #6017 and #6021 to conditionally turn off the
“Run Job” button based on the current token’s capabilities, or the capabilities
of the anonymous policy if no token is present.

If you try to visit the job-run route directly, it redirects to the job list.
2020-01-20 14:57:01 -06:00
Buck Doyle 09067b4eb7
UI: Fix client sorting (#6817)
There are two changes here, and some caveats/commentary:

1. The “State“ table column was actually sorting only by status. The state was not an actual property, just something calculated in each client row, as a product of status, isEligible, and isDraining. This PR adds isDraining as a component of compositeState so it can be used for sorting.

2. The Sortable mixin declares dependent keys that cause the sort to be live-updating, but only if the members of the array change, such as if a new client is added, but not if any of the sortable properties change. This PR adds a SortableFactory function that generates a mixin whose listSorted computed property includes dependent keys for the sortable properties, so the table will live-update if any of the sortable properties change, not just the array members. There’s a warning if you use SortableFactory without dependent keys and via the original Sortable interface, so we can eventually migrate away from it.
2019-12-12 13:06:54 -06:00
Michael Lange d6bbd0f9e5 Use max-width to ensure the width rule is observed in Firefox 2019-10-10 10:34:33 -07:00
Michael Lange fd6d5b274f
Merge pull request #6048 from hashicorp/f-ui/alloc-fs-files
UI: Alloc FS: File Viewer
2019-08-19 10:36:28 -07:00
Michael Lange 2ed18864df Limit the width of the right page layout column
This was causing elements to flow off the page, since the element was
assuming 100% but also had a 250px margin for the left column.

This had previously been "fixed" by setting overflow-x: auto, but that
resulted in tooltips from being clipped.

This is a better solution to the same problem.
2019-08-08 10:00:48 -07:00
Michael Lange 2ff4027496 Minor fixes from code review 2019-08-07 15:11:32 -07:00
Buck Doyle 2bfbc2b41b
Remove transition animation from sort arrows (#6067)
It may be an Ember bug: in some circumstances, the
ember-transitioning-in class was persisting in table
sort links even after the transition completed. This
changes the transition animations to be targeted only
for breadcrumbs and directory links.
2019-08-06 09:55:35 -05:00
Michael Lange ddd35edb19 Add hollow variation to empty-message 2019-07-30 17:25:44 -07:00
Michael Lange 3ba05a7eb7 Styles for the image-file component 2019-07-30 17:22:49 -07:00
Buck Doyle 9f3754b46b Merge branch 'master' into f-ui/alloc-fs
# Conflicts:
#	ui/app/templates/allocations/allocation/task/index.hbs
#	ui/app/templates/allocations/allocation/task/logs.hbs
2019-07-26 14:49:36 -05:00
Buck Doyle 5efedb35d1
UI: Add allocation directory sorting (#5914)
When sorting by size, directories are sorted by name, as size
isn’t displayed.

This includes a change to the positioning of sort arrows for all tables,
moving them closer to the text, because in some cases, the arrows
for right-aligned columns were ambiguously positioned.
2019-07-23 15:37:34 -05:00
Buck Doyle 9322dfc46f
UI: Add copy button for client/allocation UUIDs (#5926)
The button shows a success icon and tooltip on click, and resets
after two seconds.
2019-07-15 12:14:32 -05:00
Michael Lange 1eb689aca9 Merge remote-tracking branch 'origin/master' into f-ui/alloc-fs
* origin/master: (32 commits)
  Added additional test cases and fixed go test case
  update changelog
  Add Mirage-toggling via environment variable (#5899)
  changelog: Add entries for windows fixes
  fifo: Safer access to Conn
  run post-run/post-stop task runner hooks
  Fail alloc if alloc runner prestart hooks fail
  address review comments
  changelog
  Missed one revert of backwards compatibility for node drain
  Improve test cases for detecting content type
  Undo removal of node drain compat changes
  Updated with suggestions.
  fifo: Close connections and cleanup lock handling
  logmon: Add windows compatibility test
  client: defensive against getting stale alloc updates
  Infer content type in alloc fs stat endpoint
  appveyor: Run logmon tests
  fifo: Require that fifos do not exist for create
  vendor: Use dani fork of go-winio
  ...
2019-07-02 16:40:09 -07:00
Buck Doyle 595eb480ba
UI: Add allocation directory rendering (#5873)
This lets users navigate the allocation filesystem. It doesn’t
support viewing actual files yet.
2019-07-02 16:42:38 -05:00
Michael Lange aedeeadebd Account for the search icon within the is-compact modifer 2019-06-27 12:32:26 -07:00
Michael Lange a5a659a98a Preemptions count and filtering on client detail page
Show the count in the allocations table next to the existing total alloc
count badge. Clicking either will filter by all or by preemptions.
2019-04-22 16:40:04 -07:00
Michael Lange e35139e453 Make sure tooltips show up over the top of the side bar 2019-04-22 16:40:03 -07:00
Michael Lange 6e3a27f9e7
New toolbar CSS component 2019-04-10 10:34:10 -05:00
Michael Lange e400698905
Make the search box more elastic
1. Set a higher max-width
2. Set a min-width
3. Remove the min-width on mobile, including the invisible size="20" in
   the markup
2019-04-10 10:34:10 -05:00
Michael Lange 6a0f5b5a4d
Fixes a few minor issues with the multiselect dropdown
1. Label no longer bleeds into the downward arrow icon
2. The selection number no longer breaks onto its own line
3. Options have a min-width so short labels can't result in small click
   targets
2019-04-10 10:34:10 -05:00
Michael Lange afecab1071
Improve the search box component to make it fluid and iconed 2019-04-10 10:34:10 -05:00
Michael Lange 40b1857632
Support for the no options case 2019-04-10 10:34:10 -05:00
Michael Lange 7a183b40ac
Harden dropdown styles to avoid accidental cascading 2019-04-10 10:34:10 -05:00
Michael Lange 8a07ef2cc6
Tab and keyboard navigation for multi-select 2019-04-10 10:34:10 -05:00
Michael Lange fa10e72e2b
Multi-select button-bar support 2019-04-10 10:34:10 -05:00
Michael Lange 6160d8af84
Persistence and onSelect handler for the multi-select-dropdown 2019-04-10 10:34:10 -05:00
Michael Lange 17ab2c22cc
Templating and styling the multi-select-dropdown component 2019-04-10 10:34:10 -05:00
Michael Lange cf93e1a40c Get error messages closer to Structure designs 2018-11-09 13:23:44 -08:00
Michael Lange 777d693632 Add support for link in error containers 2018-11-07 16:08:05 -08:00
Michael Lange 80fefcf369 Style the primary-metric pattern 2018-09-14 10:20:33 -07:00
Michael Lange 772731ccd4 Fix bug where scrolling wasn't using the document
Instead it was using the page-layout is-right div
2018-08-21 16:44:59 -07:00
Michael Lange 4d656c7a31 Parse and Plan API and UI workflows 2018-08-14 17:29:51 -07:00
Michael Lange 1cc7aba5d2 Enforce a min-height for the code editor component 2018-08-14 12:46:55 -07:00
Michael Lange f41f814b49 Remove the old json viewer 2018-08-13 17:04:15 -07:00
Michael Lange c5b54393d0 Theme CodeMirror
Borrowed heavily from Vault
2018-08-13 17:04:14 -07:00
Michael Lange 04b9d80dc0 Make the dropdown ever so slightly off-white 2018-08-09 18:22:38 -07:00
Michael Lange 32d05509ca Move the region switcher out of the secondary nav and into the gutter when the gutter is collapsed 2018-08-09 18:22:37 -07:00
Michael Lange 9a9cc35bd0 Styles for the region switcher 2018-08-09 18:22:37 -07:00
Michael Lange 85ab69cf4e Align the hamburger menu and ensure that it's full area is clickable 2018-08-06 11:21:54 -07:00
Michael Lange 805147947b Remove extra whitespace 2018-08-06 11:21:54 -07:00
Michael Lange 86bafe66cf Make the hamburger menu look more traditional 2018-08-06 11:21:54 -07:00
Michael Lange aec990e41d Make it "feel" mobile with a backdrop that closes the gutter menu on tap 2018-08-06 11:21:54 -07:00
Michael Lange 97220ae5fb Visual treatment for the collapsed gutter menu 2018-08-06 11:21:54 -07:00
Michael Lange cada7d3f70 Treat the nomad logo and the hamburger menu as their own css components 2018-08-06 11:21:53 -07:00
Michael Lange 737805272a Add open/close functionality to the gutter-menu when it's collapsed 2018-08-06 11:21:53 -07:00
Michael Lange 3f75208f6b Hide the gutter menu at low width resolutions 2018-08-06 11:21:53 -07:00