Commit graph

527 commits

Author SHA1 Message Date
Michael Lange 37a1a32209 Move beta to a tag 2020-04-01 10:49:47 -07:00
Michael Lange 28ba7e8075 Change CSI to Storage and mark it as beta 2020-03-31 18:21:55 -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 61164b856e
UI: Change exec button to not show on dead jobs (#7548)
I still want to add acceptance tests for the existence
of these buttons but this change makes the exec button
for jobs behave similarly to the others.
2020-03-31 13:11:26 -05:00
Michael Lange 01341530e7 Add a volume facet to the clients list page 2020-03-30 17:33:44 -07:00
Michael Lange 1bd6a69067
UI: Support for CSI (#7446)
Closes #7197 #7199

Note: Test coverage is limited to adapter and serializer unit tests. All
acceptance tests have been stubbed and all features have been manually
tested end-to-end.

This represents Phase 1 of #6993 which is the core workflow of CSI in
the UI. It includes a couple new pages for viewing all external volumes
as well as the allocations associated with each. It also updates
existing volume related views on job and allocation pages to handle both
Host Volumes and CSI Volumes.
2020-03-25 07:51:26 -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 bc87d0a440 Remove the question mark from the Volume th
This makes it consistent with other volume columns across the app.
2020-02-14 16:56:51 -08:00
Michael Lange 0e6c81d3ef Add volume table to the task detail page 2020-02-13 17:11:34 -08:00
Michael Lange e4dcd9c2a4 Add volume requirements table to the task group page 2020-02-13 17:11:33 -08:00
Michael Lange 3fbd267263 Add volumes column to the task row component 2020-02-13 17:11:32 -08:00
Michael Lange c57993f0a5 Add volume to the client row 2020-02-13 17:11:29 -08:00
Michael Lange b3452cc33c Add volume column to allocation row 2020-02-13 17:11:27 -08:00
Michael Lange 61a3b4919f Add volume column to task group row 2020-02-13 17:11:26 -08:00
Michael Lange 18cf59b22f Test coverage for the host volumes table 2020-02-13 17:11:25 -08:00
Michael Lange 1e40837731 Add a Host Volumes table to the client detail page 2020-02-13 17:11:24 -08:00
Michael Lange 89532e27e3 Add an icon inside the node status light 2020-01-31 12:55:59 -08:00
Michael Lange 9438330329 Add an explanatory tooltip to the unauthorized node drain popover 2020-01-31 09:41:33 -08:00
Michael Lange 4eac743262 Update disabled 'Run Job' button to use standard disabled style 2020-01-31 09:41:32 -08:00
Michael Lange eb7d34df6b Disable options for popover and drain-popover 2020-01-30 21:29:29 -08:00
Michael Lange c7af942652 Enable the eligibility toggle conditionally based on acls 2020-01-30 21:29:22 -08:00
Michael Lange b4ab7b02ba Remove superfluous information from the client details ribbon 2020-01-23 16:34:36 -08:00
Michael Lange 1dd1298626 New test coverage for the drain capabilities 2020-01-23 16:34:34 -08:00
Michael Lange 0f41bfafad Update existing tests 2020-01-23 16:34:33 -08:00
Michael Lange 5e95633481 PopoverMenu integration tests 2020-01-23 16:34:32 -08:00
Michael Lange 3b534bbdf9 Integration tests for the toggle component 2020-01-23 16:34:32 -08:00
Michael Lange bc555f7758 Update the client detail page object 2020-01-23 16:34:31 -08:00
Michael Lange 8deea899c1 Model the notification pattern as a page object component 2020-01-23 16:34:30 -08:00
Michael Lange ae85882ca7 Switch drain popover checkboxes for toggles 2020-01-23 16:34:29 -08:00
Michael Lange 76bfed5f25 Swap the eligiblity checkbox out for a toggle 2020-01-23 16:34:27 -08:00
Michael Lange 95e6068d5d New toggle component 2020-01-23 16:34:27 -08:00
Michael Lange faa15bc581 Force drain button in the drain info box 2020-01-23 16:34:26 -08:00
Michael Lange 80642b8868 Modifiers to the two-step-button 2020-01-23 16:34:25 -08:00
Michael Lange 7097591281 Drain stop and update and notifications 2020-01-23 16:34:24 -08:00
Michael Lange 9c9c6b08c3 Drain complete notification 2020-01-23 16:34:24 -08:00
Michael Lange 8b19a19908 Fill out the metrics and time since values in the drain summary 2020-01-23 16:34:23 -08:00
Michael Lange 35671a3bd4 Fill in the drain strategy ribbon values 2020-01-23 16:34:22 -08:00
Michael Lange 6e3e8d01e2 Stub out all the markup for the new drain strategy view 2020-01-23 16:34:22 -08:00
Michael Lange 47924d05d3 Polish for the drain popover 2020-01-23 16:34:21 -08:00
Michael Lange fd16612be3 Factor out the drain popover and implement its behaviors 2020-01-23 16:34:18 -08:00
Michael Lange d13af1bcb5 Add triggerClass support to the popover menu 2020-01-23 16:34:18 -08:00
Michael Lange a3f32e61c1 Initial layout of the drain options popover 2020-01-23 16:34:16 -08:00
Michael Lange 20f83da76a PopoverMenu component 2020-01-23 16:34:14 -08:00
Michael Lange e685179c99 Eligibility toggling behavior 2020-01-23 16:34:13 -08:00
Michael Lange a8af3d67be Add tooltip to the eligibility control 2020-01-23 16:34:11 -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 576bcf554f
UI: Migrate to Storybook (#6507)
I originally planned to add component documentation, but as this dragged on and I found that JSDoc-to-Markdown sometimes needed hand-tuning, I decided to skip it and focus on replicating what was already present in Freestyle. Adding documentation is a finite task that can be revisited in the future.

My goal was to migrate everything from Freestyle with as few changes as possible. Some adaptations that I found necessary:
• the DelayedArray and DelayedTruth utilities that delay component rendering until slightly after initial render because without them:
  ◦ charts were rendering with zero width
  ◦ the JSON viewer was rendering with empty content
• Storybook in Ember renders components in a routerless/controllerless context by default, so some component stories needed changes:
  ◦ table pagination/sorting stories access to query params, which necessitates some reaching into Ember internals to start routing and dynamically generate a Storybook route/controller to render components into
  ◦ some stories have a faux controller as part of their Storybook context that hosts setInterval-linked dynamic computed properties
• some jiggery-pokery with anchor tags
  ◦ inert href='#' had to become href='javascript:;
  ◦ links that are actually meant to navigate need target='_parent' so they don’t navigate inside the Storybook iframe

Maybe some of these could be addressed by fixes in ember-cli-storybook but I’m wary of digging around in there any more than I already have, as I’ve lost a lot of time to Storybook confusion and frustrations already 😞

The STORYBOOK=true environment variable tweaks some environment settings to get things working as expected in the Storybook context.

I chose to:
• use angle bracket invocation within stories rather than have to migrate them soon after having moved to Storybook
• keep Freestyle around for now for its palette and typeface components
2020-01-21 15:46:32 -06: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
Buck Doyle e525ff99d3
Remove inverse block for list-pagination (#6523)
As the angle bracket invocation RFC says:

> There is no dedicated syntax for passing an "else" block
> directly. If needed, that can be passed using the named
> blocks syntax.

https://github.com/emberjs/rfcs/blob/master/text/0311-angle-bracket-invocation.md#block

Unfortunately, using a contextual component doesn’t help as
the yield inside that component will still result in content
rendering that would show when the source isn’t empty. So
we decided to change the interface so you have to check
whether the source is empty before using it, which aligns with
how list-table works.
2019-10-24 07:05:43 -05:00
Buck Doyle 9b2fb14e51
UI: Update Ember to 3.12 LTS (#6419)
This is mostly deprecation fixes and blueprint changes. There
are some dependency updates too; the changes to Ember
Basic Dropdown necessitated changing it to angle bracket
component invocation. The conversion of the rest of the
templates will happen separately.
2019-10-15 13:32:58 -05:00
Buck Doyle b5e5798e54
UI: add Consul Connect features (#6108) 2019-09-04 09:39:56 -05:00
Buck Doyle 49b9dd5b9b
UI: Add creation time to evaluations table (#6050) 2019-08-22 08:11:24 -05:00
Michael Lange 9b669d7e38 Use the standard empty state when a dir is empty 2019-08-19 17:16:26 -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 38fce53936 Prevent a change in height when switching from a dir to a file 2019-08-08 15:41:47 -07:00
Michael Lange 3dc7dec246 Make a dedicated fs-breadcrumbs component 2019-08-07 15:29:14 -07:00
Michael Lange 2ff4027496 Minor fixes from code review 2019-08-07 15:11:32 -07:00
Buck Doyle 88b708f188
Add page titles to filesystem routes (#6024) 2019-08-01 11:17:46 -05:00
Michael Lange 951570e72a fixup-integrate-file-component 2019-07-31 01:39:59 -07:00
Michael Lange fb0428fef3 Test coverage for task-file component 2019-07-30 17:25:49 -07:00
Michael Lange fcbd92704a Test coverage for streaming file component 2019-07-30 17:25:48 -07:00
Michael Lange ed9982aa98 Integration tests for the image-file component 2019-07-30 17:25:47 -07:00
Michael Lange cae543bdbb Add unsupported file type state 2019-07-30 17:25:45 -07:00
Michael Lange c110a4ab62 Integrate the task-file component with the fs explorer pages 2019-07-30 17:25:40 -07:00
Michael Lange f2d31fdf1a Refactored and image support of the task-file component 2019-07-30 17:22:52 -07:00
Michael Lange 29dacd0c2a Markup for the image-file component 2019-07-30 17:22:51 -07:00
Michael Lange 30d61fc9fc image-file component for showing an image and image metadata 2019-07-30 17:22:49 -07:00
Michael Lange 5bd9296194 Extract a streaming-file component from the task-log component
The new streaming-file component takes an arbitrary logger component
along with some mode flags and handles things like polling, DOM updates,
and scroll position.
2019-07-30 17:22:48 -07:00
Michael Lange c5ff121981 New task-file component
Based on the task-log component. Commonalities will be refactored.
2019-07-30 17:22:47 -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 90c9b89b5e
UI: Add page titles (#5924)
This uses ember-page-title to add dynamic page titles throughout the
route hierarchy. When there’s more than one region, the current
current region is added before the final entry of “- Nomad”.
2019-07-17 15:02:58 -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
Buck Doyle 4edd1d78c1
Remove superfluous test attributes (#5927)
I found while working on #5926 that x-icon already adds
assertion-compatible selectors, so these wrappers are
unnecessary.
2019-07-08 10:36:56 -05: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 e440edfea4 Some placeholder templates and routes for new feature 2019-06-20 15:20:01 -07:00
Michael Lange 7935527020 Add new menu item to the task subnav 2019-06-20 12:02:25 -07:00
Buck Doyle a2b80bebe6
Update client list to combine statuses (#5789)
The draining, eligibility, and status fields now all show under a combined
state column. Draining takes precedence, then (in)eligibility; if neither of
those is true, the status displays.
2019-06-19 10:11:17 -07:00
Michael Lange c485bc64fb Acceptance testing for allocation lifecycle 2019-05-21 09:24:19 -07:00
Michael Lange d485c040e3 Restart a single task from the task detail page 2019-05-21 09:24:18 -07:00
Michael Lange ffadcf5a25 Add stop and restart buttons to the allocation index page 2019-05-21 09:24:16 -07:00
Michael Lange 7933a41782 Add cancel on click outside and disabled behaviors to two-step-button 2019-05-21 09:24:14 -07:00
Buck Doyle da65595db0 Change clients/jobs facets to always right-align
This changes the templates so the element that contains
the search box is always present, instead hiding only
the box itself when there’s nothing to search. Keeping
the empty element lets it take up its flexbox space so
the facets will no longer be in the centre.
2019-05-15 13:25:30 -05:00
Michael Lange 35e34fea8b Test coverage for preemption on the client detail page 2019-04-22 16:40:10 -07:00
Michael Lange b7860a9bca Test coverage for preemption on the allocation detail page 2019-04-22 16:40:09 -07:00
Michael Lange 4c7e350e84 Show which allocations an allocation preempted on the alloc page 2019-04-22 16:40:06 -07:00
Michael Lange 42a4793d9d Show which alloc, if any, preempted an alloc on the alloc detail page 2019-04-22 16:40:05 -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 1266567098 Add preempted icon to alloc row 2019-04-22 16:40:04 -07:00
Michael Lange dcc219fe73 Show preemptions on the job plan phase of job submission 2019-04-22 16:40:01 -07:00
Michael Lange aeeca356bd Address template linting issues 2019-04-10 14:54:34 -07:00
Michael Lange 9a10780d47
Replaces .columns with .toolbar on the clients page 2019-04-10 10:34:10 -05:00
Michael Lange 09907078bd
Replace the columns pattern with the new toolbar pattern on the jobs page 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 afecab1071
Improve the search box component to make it fluid and iconed 2019-04-10 10:34:10 -05:00
Michael Lange e52b6be10f
Test coverage for clients faceted search 2019-04-10 10:34:10 -05:00
Michael Lange 243982562a
Implement faceted search on the clients page 2019-04-10 10:34:10 -05:00
Michael Lange 80abb8d8a0
Simplify options and selection names 2019-04-10 10:34:10 -05:00
Michael Lange 5e05408ae3
Test coverage for job list facets 2019-04-10 10:34:10 -05:00
Michael Lange 3f6bbfa8ff
Model facets in the page object 2019-04-10 10:34:10 -05:00
Michael Lange 5ae2f38c4e
Introduce encode/decode for array query params 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 46c6a3e4c2
Scaffold the facets and facet options for the jobs list page 2019-04-10 10:34:10 -05:00
Michael Lange b93977f61f
Remove the includes helper in favor of the contains helper 2019-04-10 10:34:10 -05:00
Michael Lange 22225b3436
Add the right-alignment case to freestyle 2019-04-10 10:34:10 -05:00
Michael Lange 573f03d8e9
Always left-align the dropdown position to the trigger 2019-04-10 10:34:10 -05:00
Michael Lange fd34f7aa2c
Test coverage for the multi-select-dropdown component 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 a2bcc59963
Round out the freestyle entry 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 22ce6cfe36
Freestyle entry for the new multi-select-dropdown component 2019-04-10 10:34:10 -05:00
Jacek Jagiello 364f7acbb5 5303 make logs view full width to better support large screens 2019-03-06 23:29:24 +01:00
Michael Lange dfd3b097d1 Apply new date and timestamp helpers e'rywhere 2019-02-01 09:19:28 -08:00
Michael Lange c3eb0b2493 Always show an absolute timestamp tooltip when showing relative dates 2019-01-30 09:59:41 -08:00
Michael Lange 7d76b6a59f Test coverage for resource graph empty states 2018-12-13 07:53:17 -08:00
Michael Lange 76a9d7ad7c Conditionally show the utilization graphs on the allocation and task detail pages 2018-12-13 07:53:17 -08:00
Michael Lange 71a06a6b7f Conditionally show utilization metrics on alloc and task rows 2018-12-13 07:53:17 -08:00
Michael Lange fd35d37f43
Merge pull request #4860 from hashicorp/b-ui-allocation-detail-empty-state
UI: Allocation detail empty state
2018-11-19 12:43:39 -08:00
Michael Lange 796967c58d Add an empty state to the allocation detail task list 2018-11-19 12:18:14 -08:00
Michael Lange b252ede5b6
Merge pull request #4850 from hashicorp/f-ui-links-on-error-pages
UI: Escape hatch links on error pages
2018-11-19 12:17:36 -08:00
Michael Lange 8e18903996 Show the correct template for parameterized job children 2018-11-07 21:04:27 -08:00
Michael Lange f3110f978e Test coverage for error page escape hatch links 2018-11-07 16:19:45 -08:00
Michael Lange 177a998b1d Add escape hatch links to the error page 2018-11-07 16:09:23 -08:00
Michael Lange b2acd381f9 Test coverage for resetPagination 2018-10-30 14:17:23 -07:00
Michael Lange c6afcb4499 Add the resetPagination hook to search boxes across the app 2018-10-30 10:52:54 -07:00
Michael Lange 42432bbb52
Merge pull request #4727 from hashicorp/f-ui-improved-stats-charts
UI: Improved stats charts
2018-10-17 10:55:54 -07:00
Michael Lange aeea4076b7
Merge pull request #4718 from hashicorp/f-ui-a11y-line-chart
UI: Add some simple accessibility labels for line charts
2018-10-17 09:43:27 -07:00
Michael Lange 1be400d18e Add role="tooltip" to tooltips throughout the app 2018-10-17 07:17:24 -07:00
Michael Lange cdb1831ceb Add a11y features to the line-chart component
- Treat it as an image
- Add a title and a description
- Hide the axes, just in case
2018-09-27 12:55:52 -07:00
Michael Lange 4a98bf989f Make the global logo link to the jobs page (home page) 2018-09-26 11:19:24 -07:00
Michael Lange ea87417d4f Add utilization stats to the task rows on allocation detail 2018-09-26 10:59:26 -07:00
Michael Lange 9b90683e6b Use the StatsTracker method of getting alloc stats in alloc row 2018-09-26 10:59:26 -07:00
Michael Lange 09497b20b8 Acceptance test coverage for all the pages with resource utilization graphs 2018-09-19 16:33:51 -07:00
Michael Lange 18b18da49f Integration tests for the primary-metric component 2018-09-19 14:15:32 -07:00
Michael Lange bc5dbe2fb7 Gap support for line charts 2018-09-17 16:58:56 -07:00
Michael Lange b675919c76 Add resource utilization graphs to the task index page 2018-09-14 10:21:48 -07:00
Michael Lange dace559442 Add resource utilization graphs to the allocation index page 2018-09-14 10:21:28 -07:00
Michael Lange 80fefcf369 Style the primary-metric pattern 2018-09-14 10:20:33 -07:00
Michael Lange 01429a9b78 Remove old stat tracking code from the client page
In favor of the new primary-metric components
2018-09-13 17:01:24 -07:00
Michael Lange 10b9017d84 Use the new primary-metric component on the client detail page 2018-09-13 17:01:24 -07:00
Michael Lange 768f67e336 New primary-metric component
It encapsulates all the tracker, polling, and markup for this style
of metric.
2018-09-13 17:01:24 -07:00
Michael Lange 54efa8ddd5 Full markup for time series metrics 2018-09-13 17:01:24 -07:00
Michael Lange 93cf97a47b Add stat charts to the client page 2018-09-13 17:01:24 -07:00
Michael Lange 63b89904f3 Split the line-chart and stats-time-series freestyle entries 2018-09-13 16:45:56 -07:00
Michael Lange 569ba3c48a Updates to the styleguide 2018-09-13 16:45:56 -07:00
Michael Lange f2bab4591d Use "global" gradients via a clipping mask and a rect w/100% height 2018-09-13 16:45:54 -07:00
Michael Lange 9008c48cd1 Stats time series
A use-case specific line-chart for showing utilization metrics by
percent
2018-09-13 16:45:13 -07:00