Commit graph

227 commits

Author SHA1 Message Date
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
Zach Wasserman
6dccabb5b0
Clean up output of JS test errors (#63)
- Output easy to parse stack traces during run of tests
- Fix some spurious warnings and errors in tests
- Add --exit flag to Mocha invocation to fix hang due to timers in ACE editor
2020-11-24 08:25:52 -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
96fc090723 Improve server performance for host operations
- Debounce frontend to reduce number of target searches in live query.
- More efficiently calculate label counts in live query and hosts
  dashboard. Instead of using the (slow) CountHostsInTargets function,
  retrieve the host counts while looking up the labels.
- Optimize targets search query. Removing the nested query retrieves the
  same logical result set, but substantially optimizes MySQL CPU usage.
  Testing indicates about a 50% reduction in MySQL CPU usage for the
  frontend targets search API call after applying this change.
2020-07-21 14:05:46 -07:00
Zachary Wasserman
ea93843203 Store only primary IP and MAC for hosts
Fleet used significant resources storing the full network interface
information for each host. This data was unused, except to get the
IP and MAC of the primary interface. With these changes, only those
pieces of data are stored.

- Calculate and store primary IP and MAC
- Remove transaction for storing full interfaces
- Update targets search to use new IP and MAC columns
- Update frontend to use new new columns
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
6767369d48
Upgrade React to version 16 (#1983)
- Update all associated dependencies
- Very minimal changes to components
- Extensive refactoring for broken tests

Closes #1978
2019-01-14 13:45:28 -08:00
Zachary Wasserman
dc4b97d15f
Fix React deprecation warnings (#1976)
- Refactor imports of PropTypes to use the prop-types package
- Upgrade dependencies that were setting off deprecation warnings
2019-01-06 17:25:33 -08:00
Zachary Wasserman
759a69b5b7
Upgrade Bourbon to 5.1.0 and fix deprecation warnings (#1973)
- Replace uses of deprecated Bourbon helpers with raw CSS
- Add autoprefixer into the build chain to prefix the now removed helpers

This process was achieved by running through each of the deprecation warnings and using the following bash function to replace it in all files:

```
function bourbon-deprecate() {
    grep -rl "@include $1" ./frontend --exclude-dir=.git | xargs sed -i '' -E "s/@include $1[(](.*)[)]/$1: \1/g"
}
```

For some helpers, this did not result in valid CSS, so manual modifications were made.

Closes #1189 #1274
2019-01-03 12:46:55 -08:00
Caleb Coy
0bb9c409a0 Flatten login screen styles (#1912) 2018-09-19 10:07:37 -04:00
Kyle Knight
61973ecceb Fix up styles in IE11 (#1391)
* Fix up styles in IE11

* Getting check marks to show
2017-06-18 12:38:16 -06:00
Kyle Knight
3544535e1d Make % online round to two decimal places (#1427) 2017-04-07 07:50:11 -07:00
Kyle Knight
14fa984bd3 Update All platform text to use Icon (#1363) 2017-03-08 08:40:02 -08:00
Kyle Knight
95b9e2c7d5 Fetch Targets after component is mounted (#1362) 2017-03-07 13:27:29 -05:00
Kyle Knight
facab79954 Update UI styles for Host Details card (#1317) 2017-03-06 10:37:06 -05:00
Mike Stone
7a7fb9eac9 Select targets tests (#1307)
* Adds tests for the TargetDetails component

* Adds tests for Select Targets Menu

* Rename target_stub to target_mock

* Adds tests for the SelectTargetsDropdown & minor refactor
2017-03-03 10:05:03 -05:00
Mike Stone
d747a471af Refactor API client (#1335)
* Isolate each API entity
* Improve code structure in API client and request mocks
* Standardize on a request mock structure
* Use helper for creating request mocks
* Adds Request class to handle API requests
2017-03-02 17:07:01 -05:00
Kyle Knight
89ee5b3aed Remove "All hosts" section in target selector when chosen (#1326) 2017-03-02 11:52:31 -05:00
Kyle Knight
169535afab Fix max-height issue with Full Screen Query Results (#1323) 2017-03-01 13:11:09 -06:00
Kyle Knight
6c6fb33915 Prevent Select Target dropdown from colliding with footer (#1303) 2017-02-24 17:52:42 -05:00
Kyle Knight
4aaf847edc Add Double Click event to Packs & Query tables (#1306) 2017-02-24 17:47:32 -05:00
Kyle Knight
0951cbfe1b Update Target Select UI (#1297) 2017-02-24 14:11:33 -05:00
Kyle Knight
3ec6b10324 Allow users to select multiple platforms for pack query (#1074) 2017-01-24 18:52:48 -05:00
Kyle Knight
eb82856ae4 Output proper percentage of online hosts (#1071) 2017-01-20 18:08:35 -05:00
Mike Stone
e56e94b86e Add host details throughout app (#973) 2017-01-20 12:02:13 -05:00
Mike Stone
dd74d37033 Send changed params in patch requests (#1005)
* PATCH packs with updated attributes only

* PATCH queries with updated attributes only

* PATCH user updates with updated attributes only

* Prevent setting state on unmounted component

* Load all packs on the manage packs page

* Do not send target info to server if unchanged
2017-01-18 12:10:37 -05:00
Mike Stone
0dbe94573f Don’t allow user to run query without selected targets (#1000) 2017-01-18 09:38:52 -05:00
Kyle Knight
f28bd803c4 Manage Hosts filtered icons (#987)
* Cleaning up rendered icons on hosts page

* Fixing lint
2017-01-17 12:55:19 -06:00
Mike Stone
639bdb4e11 Scaffold import config page (#927) 2017-01-13 18:27:58 -05:00
Kyle Knight
427235b837 Select Targets disabled adding padding to right side (#925) 2017-01-12 11:32:41 -05:00
Kyle Knight
7a44c269a9 Prevent default queries from rendering (#862)
* Prevent default queries from rendering

* Small styling tweaks
2017-01-11 13:08:27 -06:00
Kyle Knight
eaf0105c6c Some additional stylings to make New Packs a little more bester (#679) 2017-01-06 09:36:51 -06:00
Mike Stone
4ba3ad51f0 All packs page (#709)
* Display packs page at /packs/manage

* Adds NumberPill component

* Filter packs list

* Render the pack info side panel when no packs are selected

* Adds packs list

* Moves state management to page component

* Display selected pack count

* Render bulk action buttons

* API client - update pack

* API client - destroy pack

* Adds update/destroy functions to packs redux config

* Bulk actions (enable, disable, delete)

* Selecting a pack updates state

* PackDetailsSidePanel updates pack status

* Link to edit pack on side panel

* sets selected pack in URL

* Sets color for unsettled buttons

* Loads scheduled queries for selected pack in All Packs Page

* PackDetailsSidePanel component

* PackDetailsSidePanel styles

* styles PacksList component

* Stop rendering flash when pack status is updated

* Makes full row clickable

* highlight selected pack
2017-01-03 15:56:50 -05:00
Kyle Knight
6f90e51bc7 Style App settings form (#701) 2016-12-27 10:32:30 -05:00
Mike Stone
ee6832c743 App settings page (#615)
* AppSettingsPage at /admin/settings

* Adds App Settings to site nav items

* SMTP not configured warning

* Creates AppConfigForm

* Avatar preview

* API client to update app config

* Creates OrgLogoIcon component

* Hide username/password when no auth type
2016-12-23 13:40:16 -05:00
Kyle Knight
8f07fe2ed2 Fixing bug in Query Table sidebar dropdown (#691) 2016-12-22 13:26:18 -06:00
Kyle Knight
8baffbc97e Refactor A Few Rendering Issues (#656) 2016-12-21 12:39:40 -06:00
Mike Stone
f099b2ae22 Create packs (#516)
* Creates new PackComposerPage at /packs/new

* Creates PackForm component

* Adds PackForm to PackComposerPage

* Creates QueriesListItem

* Creates QueriesList

* Creates QueriesListWrapper

* Get all queries when the Packs Composer Page loads

* Form HOC handles updates to formData prop

* Creates form to configure scheduled queries

* QueriesListWrapper renders ConfigurePackQueryForm

* search queries input filters queries list

* Empty state text

* create pack when user submits the new pack form

* Adds Edit pack page to /packs/:pack_id/edit

* API client - get scheduled queries for a pack

* API client - create scheduled query

* Redux config for scheduled queries

* Remove scheduled queries from packs

* Add labels to pack on create

* Add disabled state to the select targets dropdown

* Adds edit route and pushes to new route on edit click

* Adds cancel button to edit pack form

* Adds Checkbox that selects all scheduled queries in table
2016-12-21 12:25:54 -05:00
Mike Stone
8567cc458c Run query (#549)
* Adds campaigns to redux state

* Update campaign with web socket data

* Destroy the current campaign when creating a new one

* close the socket when leaving the page or creating a new campaign

* Allow stopping a running query

* Update campaign with query results

* Adds QueryResultsTable

* Display flash message if campaign can't be created

* Allow filtering query results

* Adds filter icon

* Prevent query text updates when the query is running
2016-12-21 12:07:13 -05:00
Kyle Knight
8ad731e8fb Refactor form fields (#636) 2016-12-16 09:54:49 -06:00
Kyle Knight
d2c020e8c4 Cleanup styles for fields with icons (#605) 2016-12-09 11:14:16 -05:00
Kyle Knight
bbad316bae Theming AceEditor (#591) 2016-12-08 10:08:21 -06:00
Mike Stone
854bc5bd1c Moves "All Hosts" label to it's own section in the dropdown (#573) 2016-12-05 17:48:46 -05:00
Kyle Knight
9e6a8eae56 Styling User Registration (#529) 2016-12-01 13:57:19 -05:00
Kyle Knight
6a1a9c6ce9 Finish styling on Manage Hosts sidebar (#532) 2016-11-29 17:29:14 -05:00
Kyle Knight
9a769d67a4 Remove ShadowBox & ShadowBoxInput (#537) 2016-11-28 15:35:43 -06:00
Kyle Knight
7acec77303 Render Icons with component (#533) 2016-11-28 13:20:15 -06:00
Kyle Knight
46dee08ab3 Query Select Target Dropdown (#499) 2016-11-23 15:10:32 -06:00
Mike Stone
8bb2a39d86 Improves re-usability of the SelectTargetsDropdown (#518)
* Improves re-usability of the SelectTargetsDropdown
2016-11-21 10:38:23 -05:00
Mike Stone
bb62993ea5 Hosts side panel (#472)
* Host side panel

* Query form handles labels

* QueryComposer handles labels

* ManageHostsPage add label transitions

* Stop preventing default on click outside of ellipsis menu

* get labels from API

* use real label data in hosts side panel

* create label on label form submit

* adds platform dropdown

* Validate query text

* Label header

* validate presence of query text
2016-11-17 12:12:41 -05:00
Kyle Knight
29ef9e3ce8 Rearranging Files & Killing Off colors.js (#482) 2016-11-15 12:52:17 -06:00
Mike Stone
b0e856c369 Update target select (#464)
* Stop sending click event to click handler prop

* Delineates between hosts & labels in dropdown options

* Render target details when a moreInfoTarget is present

* Remove moreInfoTarget when the select is closed

* Remove modal

* refactor formatting targets API response

* Adds + icon to dropdown options

* Restructures dropdown rendering
2016-11-14 12:32:13 -05:00
Kyle Knight
cd2981e76b Updating styles on Admin User Management (#463) 2016-11-11 08:42:23 -06:00
Kyle Knight
ea6ca72f43 Removing icons from Dropdown (#469) 2016-11-10 13:37:16 -06:00
Kyle Knight
67024ceace Update styles on Dropdown component (#462) 2016-11-10 10:33:04 -06:00
Kyle Knight
b4572b7327 Converting use of native select elements to react-select library (#440) 2016-11-09 08:26:15 -06:00
Kyle Knight
ecf9eddbca Styling New Query page forms (#451) 2016-11-09 08:00:40 -06:00
Kyle Knight
00d479a3b6 Updating login form to fix password letter spacing (#452) 2016-11-08 08:36:05 -06:00
Mike Stone
01e7ac2b6c Create query (#382)
* API call to create queries

* Add queries to redux

* create query when query form is submitted

* Redirect to ShowQueryPage after creating query

* Removes theme dropdown and NewQuery component header

* Extract NewQueryPage component state to redux state

* Pass logic down to NewQuery component as props

* Changes NewQuery component name to QueryComposer

* Render NewQueryPage for /queries/:id route

* Update ReduxConfig for loading a single resource

* QueryPage tests

* Get query when the query page loads

* catch errors when query is invalid

* Renames UpdateQueryForm to QueryForm to re-usability

* Changes InputField to a controlled component

* Always render the Query Form on Query Pages
2016-11-07 11:42:39 -05:00
Kyle Knight
ca33d238d8 Converting JS/Radium styles to SCSS (#360) 2016-11-03 14:40:54 -05:00
Mike Stone
64d1924af4 Save query form (#353)
* Removes SaveQuerySection

* Updates to NewQuery & SaveQueryForm

* SaveQueryFormModal

* Load the SaveQueryFormModal on "Save Query" click

* Run query button

* hide modal form after submit

* Disable run query btn without selected targets
2016-10-31 14:08:54 -04:00
Kyle Knight
4c6c0a2b05 Adding scss-lint and cleaning up styles (#354) 2016-10-28 16:25:57 -05:00
Mike Stone
e2a5502e21 Select targets (#340)
* Api client get targets

* Allow entities to parse full api response

* responsive nav style fixes

* Add disabled prop to button

* Add targets from API to target select input

* customize target rendering in input field

* call API on select target input change

* display # hosts selected

* Adds new icons to icon font

* Customize select targets input options

* Update directory structure

* restructure select targets input

* Adds hosts to labels

* Host modal styles

* ShadowBoxInput component

* TargetInfoModal for labels

* consistent entity response in api client stubs

* Fix bug removing multiple hosts in target select input

* change Button component to use css classes
2016-10-27 12:14:30 -04:00
Mike Stone
ee3d96eb53 Update eslint (#337)
* Updates eslint packages

* Expected parentheses around arrow function argument having a body with curly braces

* Prop type `object` is forbidden

* Visible, non-interactive elements should not have mouse or keyboard event listeners

* Prop type is defined but not used

* Unexpected use of file extension "jsx"

* Expected 'this' to be used by class method

* HTML entities must be escaped

* Prevent default behavior on more options button click
2016-10-21 19:13:41 -04:00
Mike Arpaia
c07702330d Cleaning JavaScript imports and if statements (#327)
* Moving entityGetter to utility folder

* Import whitespace and if statement braces

* newlines between multi-line if's
2016-10-19 16:22:18 -04:00
Mike Stone
beda051de2 Show invited users (#297)
* Adds loadAll action to redux entity config

* API Client get invites

* Add invites to the user management page

* Updates user block styles on user management page

* Submit modal form on enter

* Modify details form styles

* Enter submits edit user form

* Removes unused admin dashboard page

* API Client - revoke invites

* Delete invite entities in redux

* Revoke invites from admin manage users page

* Show success flash message after user invite is revoked
2016-10-14 17:08:57 -04:00
Mike Stone
db57aaa1fc Filter unchanged attributes when updating user (#293)
* Only send changed user attributes to the server

* Improve flash message styles

* Do not allow admins to demote or disable their own account

* Disable admin actions against self
2016-10-07 13:07:02 -04:00
Mike Stone
10dd855a77 styles the dropdown component (#271)
* styles the dropdown component

* Updates Dropdown component to behave like other form fields
2016-10-04 18:24:39 -04:00
Mike Stone
6ebc460b66 Admin user management (#233)
Admin user management page
2016-10-03 13:54:22 -04:00
Mike Stone
32f291a064 New query page (#254)
* Sidebar/Layout improvements

* New Query route and page

* Display text editor

* Gradient style longhand

* Slider button component

* Move new query section to component

* Kolide Ace theme

* Styles slider on page

* run query on CMD + Enter

* clicking hosts sends user to homepage

* SaveQueryForm component

* Splits NewQuery component JSX into multiple dumb components

* InputField component

* save query form

* new query

* styleguide

* moves all new query form logic to the new query form

* Kolide theme for osquery tables
2016-09-30 14:55:15 -04:00
Jason Meller
55307de42d SCSS Pipeline and style fixes (#229)
* Add SCSS pipeline and fix login style issues

* Fix nav styles and make tests pass

* Fix nav header styles and animations

* Change font-size to 13px on nav

* Fix duplicate specificity of styles
2016-09-23 14:04:01 -04:00
Mike Stone
09178a9ee8 Autofocus first field on forms (#191) 2016-09-19 14:33:43 -04:00
Mike Stone
482d025d05 Reset password page (#181)
* Extracts stacked boxes UI to a re-usable component

* Presence validator

* Equality validator

* Adds ResetPasswordFrom

* PasswordResetPage component and route

* Ex icon on forgot pw page goes to login

* Smooth out the fonts so they match the mocks

* Remove dynamic background and refactor colors
2016-09-16 17:19:37 -04:00
Mike Stone
40af0d29ef Forgot password (#162)
* GradientButton components

* Style guide updates

* Display errors and override styles for InputFieldWithIcon

* Envelope Icon

* Login page form submission (#157)

* API client utility

* moves test helpers to the test directory

* Utility to namespace local storage keys

* LoginSuccessfulPage component

* Check icon

* adds auth to redux state

* successful form submission

* Allow tests to load dummy SVG static images & test fixes

* ForgotPassword Page, Form & route

* Email validator
2016-09-14 16:31:54 -04:00
Mike Stone
b638ae186d Login page form submission (#157)
* API client utility

* moves test helpers to the test directory

* Utility to namespace local storage keys

* LoginSuccessfulPage component

* Check icon

* adds auth to redux state

* successful form submission

* Allow tests to load dummy SVG static images & test fixes
2016-09-13 22:43:26 -07:00
Mike Stone
ac9a38c207 Login page scaffolding (#142)
* LoginPage component and route

* animated SVG background image utility

* Kolide text, User, Lock, & Kolide logo SVG icons

* styleguide

* Adds global footer

* Adds InputFieldWithIcon component

* Adds LoginForm component

* Render LoginForm from the LoginPage
2016-09-12 11:14:07 -04:00