Commit Graph

115 Commits

Author SHA1 Message Date
noahtalerman
f2755ec93e
Add icon button styles and edit TableContainer to support styles (#713)
- Add `text-link-icon` button variant
- Add `actionButtonVariant` and `actionButtonIcon` props to `<TableContainer />`.
- Add 3 new icon assets (pencil, trash, and edit columns)
2021-05-18 12:30:57 -04:00
Gabe Hernandez
87c4aba10d
bulk selecting hosts (#756)
* added teams to add host modal dropdown

* bulk and transfer host on host page

* started transferhost API call

* hook up client side of api

* hook up client side of api call for enrol secrets

* added selection number and clear all selections button

* remove log and document

* fix ManageHostPage tests

* fix linting errors

* add indeterminate styles to checkbox

* added clearable handler for dropdown component

* fix up no team for add modal

* Add active selection styles and move specific host table styles into ManageHostsPage styles

* changed add host team dropdown to include no team option

* add no team option to bulk transfer host options

* change enroll spelling

Co-authored-by: Noah Talerman <noahtal@umich.edu>
2021-05-13 15:30:42 +01:00
noahtalerman
61c5eceb97
Resolve lint errors and js unit tests (#759)
- Resolves JS lint error and unit tests in the `teams` branch
- We believed these failed tests went unnoticed by CI in #723
2021-05-12 13:52:02 -04:00
Gabe Hernandez
2ab1d106b0
team add new host UI (#723)
* added permissions for adding host button on host page

* added teams to add host modal dropdown

* add placeholder for dropdown and fix some type issues

* added add host redirect modal on team details
2021-05-12 14:06:39 +01:00
Noah Talerman
81bc137195 Merge style variables from master into teams 2021-04-30 18:12:49 -04:00
noahtalerman
0f48eb8525
Bring new style variables from teams into master (#707)
This PR brings the style changes made in the "Align Fleet UI colors with Figma components"
#615 and "Align Fleet UI with Figma (spacing and fonts)" #628 PRs into the master branch.
2021-04-30 17:32:50 -04:00
Zach Wasserman
a17556b2db Merge branch 'master' into teams 2021-04-30 09:40:10 -07:00
Gabe Hernandez
a85476c23b
implement member page for team details (#685)
* added reducers and kolide api teams code, hooked up empty state

* request for get all teams and remove unused loading bar

* added create team functionality|gs

* update link cell to be more generic

* create teams detail page and hook it up

* added tabbing and styling to top nav team details

* added edit and delete modal functionality

* add in table and modals for members for teams

* created reusable edit user modal and use it in manage teams page

* creating add member autocomplete

* hook up adding members to teams

* hook up real members from api into table, and empty state for table

* fix proptype warning

* hooked up table querying for member page

* added remove member modal

* added tems to edit useres on member page

* finish remove member from team

* fixed up editing on members page

* fix the role value in member table

* fix prettier errors

* fixes from PR comments round 1

* add missing error handler on add member

* add dynamic team name to member page and user dynamic user and team names to succuess and errors

* add test for userManagementHelper module

* fix lint errors

* fix tests

* add member test to row results on member page
2021-04-29 14:47:33 +01:00
noahtalerman
568efc9497
Edit label and Add label frontend fixes (#644)
- Moves `isEditLabel` out of `<ManageHostPage />`'s state and into its props. The implementation is now similar to `isAddLabel`.
- Add `selectedFilter` to the URL path when editing or adding labels. This helps navigate the user back to the selected label after they click "Cancel" when editing or adding.
2021-04-16 10:54:55 -07:00
RachelElysia
182b7f2f13
MIA host icon and styling (#649)
* Add Mia circle, can't overrride Mia letter casing

* Uppercase MIA

Co-authored-by: Rachel Elysia Perkins <rachel@fleetdm.com>
2021-04-16 12:14:48 -04:00
Gabriel Hernandez
04712c0426 Merge master into teams 2021-04-14 17:52:15 +01:00
Gabe Hernandez
efb35b537a
add prettier and have it format all fleet application code (#625)
* add prettier and have it format all js code except website:
:

* trying running prettier check in CI

* fix runs on in CI

* change CI job name

* fix prettier erros and fix CI
2021-04-12 14:32:25 +01:00
noahtalerman
cdf43a79bd
Align Fleet UI with Figma (spacing and fonts) (#628)
This if the 2nd PR as part of the of the Align components in Fleet UI with design system in Figma #539

These changes **refactor the spacing and font sizes** used by the frontend. 

- Change the scss variables in `padding.scss` and `fonts.scss`. 
- Replace custom styles with the new variables throughout all stylesheets.
2021-04-09 17:30:42 -07:00
noahtalerman
c2700ee5c6
Align Fleet UI colors with Figma components (#615)
- This if the 1st PR as part of the of the Align components in Fleet UI with design system in Figma #539
- These changes replace all the color variables in /styles/var/colors.scss with new colors and naming convention used in Figma.
2021-04-09 12:04:11 -07:00
Gabe Hernandez
1f97aebf61
implement user table with new table and hook up create and edit and delete users (#587)
* hook up user and invite data together for data table

* added client derived data to user table

* hooked up action dropdown to table

* hooked up edit modal and password reset

* started adding editing user functiaonlity

* add query params to /invite call

* clean up editing teams

* update select team from to handle existing users with teams

* update closes modal now

* reuse getUser to clean up code in userManagementpage

* pass form data to updating user that is not the current User

* add dynamic userform submit text and fix tests

* fix lint error in table component

* added empty state for user table

* clean up unused data table props

* added delete modal

* add delete user functionality

* add delete option for invite

* Add styles for rows in user table and action dropdown cell

* hook up user and invite data together for data table

* added client derived data to user table

* hooked up action dropdown to table

* hooked up edit modal and password reset

* started adding editing user functiaonlity

* add query params to /invite call

* clean up editing teams

* update select team from to handle existing users with teams

* update closes modal now

* reuse getUser to clean up code in userManagementpage

* pass form data to updating user that is not the current User

* add dynamic userform submit text and fix tests

* fix lint error in table component

* added empty state for user table

* clean up unused data table props

* added delete modal

* add delete user functionality

* add delete option for invite

* Merge in generateClassTag

* Refactor table styles

* Add newline to DropdownCell style sheet

Co-authored-by: Gabriel Hernandez <ghernandez345@gmail.com>

* update checking for admin through global_role in nav

* added defaultGloablRole for creat user modal

* remove unused comment

* fix broken tests

* reenabled search for users tests

Co-authored-by: noahtalerman <47070608+noahtalerman@users.noreply.github.com>
2021-04-09 11:44:57 +01:00
Gabe Hernandez
e33bbb8811
enhance data table for two datasets and client derived data (#559)
* rework data table, got to point of calling network request correctly

* got to point of rendering table columns and data

* finish up functional changes to data table

* fix tests

* fix styles for table container and data table

* clean up some styles

* update to styles for no host configured

* cleanup and docs

* add missing method for host table text formatting

* disabling unused test. will add back in next PR

* clean up code
2021-04-04 13:45:24 +01:00
Gabe Hernandez
d0ded91d0b partial implementation of user table with generic table and new create user form (#500)
* use new data table in user manage page'

* remove default empty array hiddenColumns props, was causing render performance problems

* remove unused tooltip in hostcontainer

* add search to user manage table

* add query params to user GET requests

* move createUserForm closer to user management page

* starting to implement create user modal

* starting to add team checking functionality to create user

* styling of select team form

* changing logic for selectedTeamsForm, simplifying

* updated SelectedTeamsForm to handle own state and pass back relevant state to parent

* created reusable infobanner component and use it in osquery options page

* use infobanner in createuserform

* create new Radio component and use in createuserform

* create new Radio component and use in createuserform

* added new radio buttons to createUserForm

* finish custom radio button styling

* finish styling of radio in createUserForm

* fix and add entities/users#loadAll tests

* remove unneeded tests and updated broken ones on UserManagementPage

* remove unused modules
2021-03-31 11:58:29 -07:00
noahtalerman
9c5ea908d1
Add status style (#564)
Add green (online) and grey (offline) indicator to Hosts table
2021-03-31 09:30:21 -07:00
noahtalerman
e6e6fcdf2d
Adjust UI layout styles and fix empty state on "Hosts" page (#542)
- Remove `$nav-width` and `$nav-tablet-width` because the navigation is now on the top of the layout.
- Add styles to `CoreLayout` to make the main content (everything except the top nav) fill the window height.
2021-03-25 17:22:37 -07:00
noahtalerman
ef414153a9
Add "Last fetched" to Hosts page and Host details page (#540)
- Add a "Last fetched" column to the table on the Hosts page. This column uses the `detail_updated_at` property.
- Add a "Last fetched" timestamp to the Host details page.
- Adjust styles on _Host details_ page
2021-03-25 12:47:00 -07:00
Gabe Hernandez
699c37e343
genericise host table (#456)
* updates to datat table to genercise it

* finish up genericising host data table
2021-03-15 11:26:18 +00:00
Gabe Hernandez
5e80bd5711
change smtp warning banner (#443)
* change colours for warning

* update the warning banner to display whatever is passed in.
2021-03-12 11:45:17 +00:00
noahtalerman
61635225dc
Front end style and experience fixes (#425)
This PR includes several style and experience fixes discovered during a front end QA pass 3-9-2021 

Fixes include:
- The content on _Osquery options_ page now fills the entire width of the new layout
- Add consistent messaging in the SMTP warning on the _Organization settings_ and the _User management_ page
- Add spacing consistent with styles for the buttons in the "Delete label" modal have 
- Make scroll behavior of  `<FlashMessage />` behave with the new top navigation
- Remove the SMTP warning from the _Organization settings_ page
2021-03-09 09:43:37 -08:00
noahtalerman
0c4720c721
Fix IP column label and section label. Add border color style for inputs. (#374) 2021-03-04 15:18:21 +00:00
Gabe Hernandez
60d830527f
always show how column name in host table (#372) 2021-03-04 10:50:45 +00:00
Gabe Hernandez
0b9d20329b
add ts to data table components (#364)
* chnage webpack to resolve typescript modules. convert TextCell to TS

* change headercell and statuscell to ts

* ignore casesensitve error, seems a bit buggy

* ignore camelcase error, we already use snakecase many places

* updated LinkCell and modules it depends on to typescript

* fix up some warnings from changes

* fix more types in textcell and hosttableconfig

* use alias imports

* add require button state interfcae
2021-03-03 16:51:39 +00:00
Gabe Hernandez
3546b7d41a
adding typescript and updating linting to work with it (#356)
* updated typescript version and tsconfig in project

* updated eslint version

* change from experimental export to supported export

* removed accidentally added script

* turn off buggy jsx-a11y eslint rules

* remove unused tslint.json

* fix wrong jsx-a11y depedency

* use correct eslint-plugin-jsx-a11y version

* fix rest of linting errors

* move back js-yaml version to 3 major
2021-03-01 07:48:51 +00:00
Gabe Hernandez
4de0090bd3
Add edit column modal feature (#351)
This adds the column toggling to the feature to the host data table.

Co-authored-by: Noah Talerman <noahtal@umich.edu>
2021-02-25 09:13:13 -08:00
Gabe Hernandez
a6c8987200
Feature - add search and sort to host table (#341)
* start adding global search filter

* update polyfill setup to use async await for react-table

* update browerslist to sensible defaults

* get global search functionality woring

* more progress on the data table

* get label network calls working in hostdatatable

* get pagination functionality into the HostDataTable

* get search query making network call

* get ordering making query

* make actual  sort order network calls

* disable cpu column sorting

* seperate get table data from get labels

* fix issues with input resetting and got search query working

* get sort working

* ignore vs code editor settings

* improve loading spinner to move inside the table

* improve styling

* add sorting arrows

* remove unused sorting arrow component

* add host query params to labels endpoint

* fix style for query textarea on label hosts

* got new pagination working

* set server data as source of truth for table global filter

* cleanup logs

* clean up pagination styles

* fix up paginationa and no host styles

* add result count to table

* remove logs

* tweak header styles

* fix to sort order

* simplify default sort direction

* keep sort order of server api responses and use in host table

* clean up logs

* Add styles for header cell and pagination

* fix tests for ManageHostPage

* fix tests for HostContainer

* fix lower level action reducer and thunk tests

* fix tests for hosts client

* fix up some host count styling

* added back no hosts start message

* fix linting errors

* remove unused old pagination code

* add back scrollToTop utility on pagination

* remove unused code in managehostpage test

Co-authored-by: Noah Talerman <noahtal@umich.edu>
2021-02-25 12:05:08 +00:00
Gabe Hernandez
8c8c3f9516
Update to new host table (#298)
* recreate host table with react-table

* move old host table and container next to other code related to host page

* start replacing old host table with new host table

* replace old table with with new data table

* fix up tests and remove some unused code
2021-02-11 16:22:22 +00:00
noahtalerman
4e8c5e7f86
Add Host details page (#238)
This PR adds a new Host details page as part of the Hosts UI project #162

Summary of changes:
- New component <HostDetailsPage />
- Move "Query" and "Delete" buttons from the hosts list to the Host details page
- Add new button variants label and text-link
- Add react-tooltip package to the project (v4.2.13)
2021-01-28 12:44:48 -08:00
noahtalerman
49e71e4ed6
Add new icons for Hosts page. Fix hosts list width on wide screens. (#128)
- Add new PNG files for the new icons in the left side navigation and the right side labels on the Hosts page.
- Rename the old `<Icon />` component to `<KolideIcon />` and create a new `<Icon />` component. The ultimate goal is to get rid of the `<KolideIcon />` and `<PlatformIcon />` components and use the encompassing `<Icon />` component for all icons. The full transition will be made when we have icon assets to replace all the kolide icons and platform icons. Currently, we don't.
- Rename the `icon_name_for_label.js` utility to `icon_name.js` because the utility now includes `iconNameForLabel()` and `iconNameForPlatform()` functions.
- Fixes issue #127.
2020-12-14 18:24:16 -08:00
noahtalerman
1b23b7b74f
Add style fixes caught during QA. Add favicon. (#119)
Changes include style fixes that were caught during a QA pass.
2020-12-10 13:09:05 -08:00
noahtalerman
5dd9b75e9c
Update query page (edit, new, manage) and packs page (edit, new, manage) styles. (#106)
The goal of this PR is to update the style across the query and packs pages so they are consistent with the latest global styles (colors, buttons, and fonts).
2020-12-08 12:07:54 -08:00
noahtalerman
cc0d578b75
Update manage users styles. Implement table (list) view. (#104)
The goal of this PR is to change the layout of the manage users to a table (list view).

Move the user actions into the table view.
Move EditUserForm into a Modal
Update styles for InviteUserForm
Edit copy for the configuring SMTP warning.
2020-12-08 11:58:19 -08:00
noahtalerman
028b968ff5
New styles for label creation form. (#101)
The goal of this PR is to update the styles of the LabelForm component.
Also include global style changes for form components (FormField, LabelForm, and others).
2020-12-07 15:08:59 -08:00
noahtalerman
d029ab18f9
Update add new host modal. (#94)
- The goal of this PR is to update the styles of the "Add new host" modal.
- Move the "Add new host" button from the hosts sidebar to the center column.
- Add max-width to the hosts list container and the hosts header.
2020-12-04 15:19:08 -05:00
Zach Wasserman
0670db66c4
Migrate JS tests to Jest and update libraries (#74)
- Move from Mocha to Jest for JS testing (Jest seems to have better support for
 'watching' tests and a more active community these days).
- Codemod existing tests to Jest syntax (using https://github.com/skovhus/jest-codemods)
- Fix some errors in tests that were previously hidden.
- Update Babel.
2020-12-01 10:15:12 -08:00
noahtalerman
3953afb0b0
New styles and layout for hosts page. Remove grid view. (#73)
The goal of these changes is to update the main content (center column) of the /hosts page.

What is included in these changes:
- Removing the grid view for hosts. This required removing the actions, reducers, and props using to toggle the display between grid and table view. The toggle buttons in the UI are also removed.
- Adding host_cpu, memory, and uptime columns to the table. This increases the table's width which is now horizontally scrollable.
- Removing the HostDetails component used in the grid view. Moving the helpers.js file to HostTable. Adjusting JS tests to account for these changes.
- Updating pagination styles.
2020-11-30 13:23:58 -05:00
noahtalerman
51cfb07f64
Implement global colors. Add italic font. (#64)
The goal of this PR was to insert new colors, remove legacy colors, and update only the styles accordingly. The Nunito Sans Italic font was also added.

Later PRs will include layout, copy, and style change to individual components. These later changes will more exactly resemble the current mockups.
2020-11-24 08:59:03 -08:00
noahtalerman
23ce98ec51
Add Nunito Sans font and update global styles. (#59)
This is the first PR as a part of the Fleet UI Refresh #38.

Changes include:

- Add Nunito Sans font files and modify global styles to reflect the font change.
- Modify global font variables to reflect new sizing and weight naming conventions.
-- New sizing and naming conventions:
--- SIZE: xx-small: 12px, x-small: 14px, small: 16px, medium: 20px, large: 24px, x-large: 28px
--- WEIGHT: regular: 400, bold: 700
- Remove the old Oxygen font files.

Changes to other style sheets reflect the changes to the new font sizing and weight naming conventions for global variables. The changes don't necessarily use the correct size (as illustrated by mockups). Those "up to spec" sizing changes are to come.
2020-11-19 16:51:22 -08:00
Zachary Wasserman
a36bef6c16
Improve "Add New Host" dialog (#8)
- Allow download of enroll secret, server certificate, and flagfile.
- Hosts can now be added following instructions directly.
2020-11-04 17:07:58 -08:00
James Alseth
a2f49dd620
Add hostname to delete host confirmation modal (#2310)
Fixes #2233
2020-10-01 09:38:43 -07:00
Zachary Wasserman
7494513400 Clean up and comments before merge. 2020-07-21 14:05:46 -07:00
Zachary Wasserman
42bea2a144 Implement manual labels
"Manual" labels can be specified by hostname, allowing users to specify
the membership of a label without having to use a dynamic query. See the
included documentation.
2020-07-21 14:05:46 -07:00
Zachary Wasserman
b0595748f1 Implement pagination of hosts in the web UI
This commit takes advantage of the existing pagination APIs in the Fleet
server, and provides additional APIs to support pagination in the web
UI. Doing this dramatically reduces the response sizes for requests from
the UI, and limits the performance impact of UI clients on the Fleet and
MySQL servers.
2020-07-21 14:05:46 -07:00
Zachary Wasserman
ccc8581229
Upgrade eslint and dependencies (#2255)
Updates configuration and fixes issues introduced
2020-07-06 19:31:48 -07:00
Zachary Wasserman
c1aa8355cb
Add support for multiple enroll secrets (#2238)
- Support multiple enroll secrets
- Record name of enroll secret used when host enrolls
- Update fleetctl and UI to support these features
2020-05-29 09:12:39 -07:00
Zachary Wasserman
adf87140a7
Add ability to prefix Fleet URLs (#2112)
- Add the server_url_prefix flag for configuring this functionality
- Add prefix handling to the server routes
- Refactor JS to use appropriate paths from modules
- Use JS template to get URL prefix into JS environment
- Update webpack config to support prefixing

Thanks to securityonion.net for sponsoring the development of this feature.

Closes #1661
2019-10-16 16:40:45 -07:00
Zachary Wasserman
1344653412
Minor style fixes in frontend (#2084)
- Fix padding in query editor autocomplete box
- Hide cursor in read-only query editor
- Remove styling of active line in query editor (which does not update
  properly and is therefore distracting)
- Fix padding and reorder buttons in delete label modal
2019-07-31 12:05:10 -07:00