relates to #21559
This adds the ability for end users to enrol their own device in fleet
mdm.
> NOTE: this new byod HTML page is a separate HTML asset that contains
all styles and scripts needed for the page to work. We do not send the
fleet UI assets and this drastically cuts down the response time to the
users who will be visiting this page on mobile devices
There are two sides included in this:
**Adding a new add host modal ios and iPad section for IT admins**
**delivering a new byod HTML page to end users that will allow end users
to download the config profile to enrol into fleet mdm**
<!-- Note that API documentation changes are now addressed by the
product design team. -->
- [x] Changes file added for user-visible changes in `changes/`,
`orbit/changes/` or `ee/fleetd-chrome/changes`.
See [Changes
files](https://github.com/fleetdm/fleet/blob/main/docs/Contributing/Committing-Changes.md#changes-files)
for more information.
- [ ] Added/updated tests
- [x] Manual QA for all new/changed functionality
Issues https://github.com/fleetdm/fleet/issues/17587,
https://github.com/fleetdm/fleet/issues/18836,
https://github.com/fleetdm/fleet/issues/18837,
https://github.com/fleetdm/fleet/pull/18339, and
https://github.com/fleetdm/fleet/pull/18340
# TODOS
- Integrate backend
- Unit/integration tests
- Various todos noted in comments
- Cleanup styles and organization of components (de-duplicating and
consolidating where possible)
- Activity feed updates (if any)
# Checklist for submitter
If some of the following don't apply, delete the relevant line.
<!-- Note that API documentation changes are now addressed by the
product design team. -->
- [ ] Changes file added for user-visible changes in `changes/`,
`orbit/changes/` or `ee/fleetd-chrome/changes`.
See [Changes
files](https://fleetdm.com/docs/contributing/committing-changes#changes-files)
for more information.
- [ ] Input data is properly validated, `SELECT *` is avoided, SQL
injection is prevented (using placeholders for values in statements)
- [ ] Added support on fleet's osquery simulator `cmd/osquery-perf` for
new osquery data ingestion features.
- [ ] Added/updated tests
- [ ] If database migrations are included, checked table schema to
confirm autoupdate
- For database migrations:
- [ ] Checked schema for all modified table for columns that will
auto-update timestamps during migration.
- [ ] Confirmed that updating the timestamps is acceptable, and will not
cause unwanted side effects.
- [ ] Ensured the correct collation is explicitly set for character
columns (`COLLATE utf8mb4_unicode_ci`).
- [ ] Manual QA for all new/changed functionality
- For Orbit and Fleet Desktop changes:
- [ ] Manual QA must be performed in the three main OSs, macOS, Windows
and Linux.
- [ ] Auto-update manual QA, from released version of component to new
version (see [tools/tuf/test](../tools/tuf/test/README.md)).
---------
Co-authored-by: Gabriel Hernandez <ghernandez345@gmail.com>
## –> #16663
- Display text within `textarea` only when editing. Since the
problematic pencil icons are hidden in this state, it is okay that their
position varies depending on browser (see previous discussions).
- When not editing, text and icon are displayed in a `button` , removing
the dependence of their position on the variable per browser`textarea`
"col"s.
- Note that the wrapping behavior of these texts can affect how much
space is placed after it _within_ its span/textarea – the distance of
the icon from this element remains constant.
https://www.loom.com/share/105df09a447e42cc9e3a71668f5d1d2c?sid=244d0543-cc4b-43ed-83dd-22959cb08879
<img width="1284" alt="Screenshot 2024-02-27 at 2 15 12 PM"
src="https://github.com/fleetdm/fleet/assets/61553566/7b8f7fea-bc57-4699-9d61-d93b19e8d922">
- [x] Changes file added for user-visible changes in `changes/`
- [x] Manual QA for all new/changed functionality
---------
Co-authored-by: Jacob Shandling <jacob@fleetdm.com>
## Addresses #16910
- This table's controls now break at the same breakpoint as those of
other tables, preventing these style issues:
https://www.loom.com/share/57144ff9703e4eb5a57b1af179a55923
- [x] Manual QA for all new/changed functionality
---------
Co-authored-by: Jacob Shandling <jacob@fleetdm.com>
## More global solution to #16277, cleanup to prevent similar bugs
- Swap out [localized
solution](https://github.com/fleetdm/fleet/pull/16287) for standard
`.main-content` containing desired padding
- Apply `.core-wrapper` class to parent, in line with all other UI pages
- Remove problematic legacy `.body-wrap`
- spot check all places this class was being applied:
- PlatformWrapper
- LiveQuery –> SelectTargets (was causing excess padding here)
- PackQueriesTable (caused excess padding here)
- TeamManagementPage (excess padding was being locally negated)
- EditQueryPage
- LiveQueryPage
- DeviceUserPage
- Remove local styles meant to negate `.body-wrap`'s styles
- [x] Manual QA for all new/changed functionality
---------
Co-authored-by: Jacob Shandling <jacob@fleetdm.com>
## Addresses #15325
- Define shared global styles for forms (`form` and `.form`s) and
`.form-field`s
- Sweep through the app, updating each form from being locally styled to
first prioritizing the global styles and only defining local styles
where needed for custom behavior
- Remove lots of unnecessary nesting of elements
- Other small bug fixes and improvements
### Samples, before (L) | after (R):
**Save query modal**
**Edit query form**
**Add hosts modal**
## QA Plan:
@xpkoala here's the same list from the issue, freshly de-checked for you
to use if it's helpful:
* Please check error states of each field
#### Specified by issue:
##### In "Save query" modal:
- [ ] Reduce space between checkboxes and their help text to 8px/0.5rem
for the following fields:
- [ ] Observers can run
- [ ] Discard data
- [ ] Update the following checkbox labels to have normal font weight
(not bold):
- [ ] Discard data
##### On "Edit query" page:
- [ ] Update the following checkbox labels to have normal font weight
(not bold):
- [ ] Observers can run
- [ ] Discard data
##### In "Add hosts" modal, for copy text fields:
- [ ] match typical form form field styles
- [ ] Adjust the positioning of the copy icon to keep it from being too
far down
##### Further locations to check
- [ ] ChangeEmailForm.jsx
- [ ] ChangePasswordForm.jsx
- [ ] ConfirmInviteForm.jsx
- [ ] ConfirmSSOInviteForm.jsx
- [ ] EnrollSecretModal.tsx
- [ ] ForgotPasswordForm.jsx
- [ ] LoginForm.tsx
- [ ] EditPackForm.tsx
- [ ] (New)PackForm.tsx
- [ ] AdminDetails.jsx
- [ ] ConfirmationPage.tsx
- [ ] FleetDetails.jsx
- [ ] OrgDetails.jsx
- [ ] ResetPasswordForm.tsx
- [ ] UserSettingsForm.jsx
- [ ] EditTeamModal.tsx
- [ ] IdpSection.tsx
- [ ] DeleteIntegrationModal.tsx
- [ ] IntegrationForm.tsx
- [ ] EndUserMigrationSection.tsx
- [ ] RequestCSRModal.tsx
- [ ] Advanced.tsx
- [ ] Agents.tsx
- [ ] FleetDesktop.tsx
- [ ] HostStatusWebhook.tsx front
- [ ] Info.tsx
- [ ] Smtp.tsx
- [ ] Sso.tsx
- [ ] Statistics.tsx
- [ ] WebAddress.tsx
- [ ] CreateTeamModal.tsx
- [ ] DeleteTeamModal.tsx
- [ ] EditTeamModal.tsx
- [ ] AgentOptionsPage.tsx
- updated the layout of this page to align with the rest of the forms in
the UI – can easily revert if it's not what we want
- [ ] AddMemberModal.tsx
- [ ] RemoveMemberModal.tsx
- [ ] UserForm.tsx
- Used by both `EditUserModal` and `CreateUserModal`
- A few different conditions that cause different rendering behavior
- [ ] DeleteHostModal.tsx
- [ ] TransferHostModal.tsx
- [ ] LabelForm.tsx
- [ ] MacOSTargetForm.tsx
- [ ] WindowsTargetForm.tsx
- [ ] BootstrapPackageListltem.ts
- [ ] EndUserAuthForm.tsx
- [ ] PackQueryEditorModal.tsx
- [ ] PolicyForm.tsx
- [ ] SaveNewPolicyModal.tsx
- [ ] ConfirmSaveChangesModal.tsx
- [ ] Query automations modal
- [ ] Policy automations modal - addresses #16010
- [ ] SoftwareAutomationsModal
## Checklist for submitter
- [x] Changes file added for user-visible changes in `changes/`
- [x] Manual QA for all new/changed functionality
---------
Co-authored-by: Jacob Shandling <jacob@fleetdm.com>
Co-authored-by: RachelElysia <71795832+RachelElysia@users.noreply.github.com>
Merging during freeze with approval from all stakeholders, including verbal approval from @sharon-fdm
Co-authored-by: Jacob Shandling <jacob@fleetdm.com>
This adds a new ListItem component and FileUploader component and
updates the Custom settings and scripts page to use this new ListItem
component.
This List component centralises where the markup and styles live. We
still need to update the bootstrap list item and eula upload list item
but will do that in the future.
- [x] Manual QA for all new/changed functionality
relates to #13308
Implements the UI for the activity item for script ran, and the script
details modal.
NOTE: Still have to do API integration and will do when API is ready in
another PR.
- [x] Changes file added for user-visible changes in `changes/` or
`orbit/changes/`.
See [Changes
files](https://fleetdm.com/docs/contributing/committing-changes#changes-files)
for more information.
- [ ] Added/updated tests
- [x] Manual QA for all new/changed functionality
## Improve breakpoint variables to be useful "sm", "md", etc. instead of
the pixel widths they are set to
Also made sure all media queries are using these variables instead of
hard-coded values.
See @lukeheath's previous to-do in `frontend > styles > var >
breakpoints.scss`
---------
Co-authored-by: Jacob Shandling <jacob@fleetdm.com>
