Commit graph

14 commits

Author SHA1 Message Date
RachelElysia
efc64389b1
Fleet UI [Feature]: UI reskin (#33558) 2025-09-29 12:10:41 -05:00
RachelElysia
7b7fa2fcd1
Fleet UI: Component fixes (styling bugs and code cleanup) (#26149) 2025-02-26 13:47:28 -05:00
jacobshandling
5d9026b7e5
UI - GitOps Mode: Core abstractions, first batch of applications (#26401)
## For #26229 – Part 1


![ezgif-6bbe6d60c12ed4](https://github.com/user-attachments/assets/37a04b64-abd7-4605-b4ac-9542836ff562)

- This PR contains the core abstractions, routes, API updates, and types
for GitOps mode in the UI. Since this work will touch essentially every
part of the Fleet UI, it is ripe for merge conflicts. To mitigate such
conflicts, I'll be merging this work in a number of iterative PRs. ~To
effectively gate any of this work from showing until it is all merged to
`main`, [this commit](feedbb2d4c) hides
the settings section that allows enabling/disabling this setting,
effectively feature flagging the entire thing. In the last of these
iterative PRs, that commit will be reverted to engage the entire
feature. For testing purposes, reviewers can `git revert
feedbb2d4c25ec2e304e1f18d409cee62f6752ed` locally~ The new settings
section for this feature is feature flagged until all PRs are merged -
to show the setting section while testing, run `ALLOW_GITOPS_MODE=true
NODE_ENV=development yarn run webpack --progress --watch` in place of
`make generate-dev`

- Changes file will be added and feature flag removed in the last PR

- [x] Settings page with routing, form, API integration (hidden until
last PR)
- [x] Activities
- [x] Navbar indicator
- Apply GOM conditional UI to:
    - [x] Manage enroll secret modal: .5
    -  Controls >
        - [x] Scripts:
        - Setup experience > 
            - [x] Install software > Select software modal
        - [x] OS Settings >
            - [x] Custom settings
            - [x] Disk encryption
        - [x] OS Updates
 
2/18/25, added to this PR:

   - [x] Controls > Setup experience > Run script
   - [x] Software >
        - [x] Manage automations modal
        - [x] Add software >
            - [x] App Store (VPP)
            - [x] Custom package
   - [x] Queries
        - [x] Manage
        - [x] Automations modal
        - [x] New
        - [x] Edit
   - [x] Policies
     - [x] Manage
     - [x] New
     - [x] Edit
     -  Manage automations
       - [x] Calendar events


- [x] Manual QA for all new/changed functionality

---------

Co-authored-by: Jacob Shandling <jacob@fleetdm.com>
2025-02-20 08:41:07 -08:00
jacobshandling
841a425bb0
UI – Display whitespace of existing, trim names on create/update of team and query names (#22524)
## #22212

- Trim whitespace from names on field blur, form submit, and in API
calls when:
   - Creating a team
   - Updating a team
   - Creating a query
   - Updating a query
- Refactor `AutoResizeInputField` to remove its internal state-based
management of its value, leaving its `value` prop as the single source
of truth for the field's value at all times.

[Loom
demo](https://www.loom.com/share/882f4a803b1540db985c987adbd9f441?sid=67caf100-4711-41a3-971f-bc8f67beeae7)

- [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>
2024-10-03 15:59:10 -07:00
Jacob Shandling
fa093203df
UI – Simpler edit icon solution, applied to Edit query and Edit policy forms (#17364)
## ➡️ #17224  

- Replace the [solution merged
here](https://github.com/fleetdm/fleet/pull/17086) with a simpler and
more easily extendable one
- Apply same approach to the Edit policies form.

Edit query demo:

https://www.loom.com/share/589d3bfedc754f62b31c39bc517c2382?sid=ce65e5a5-e13f-4446-a37c-991a09cc8960

Edit query:
<img width="1791" alt="Screenshot 2024-03-04 at 5 34 35 PM"
src="https://github.com/fleetdm/fleet/assets/61553566/6727bd9e-ad05-45b0-a65c-e01487d7d923">

Edit policy:
<img width="2550" alt="Screenshot 2024-03-05 at 11 47 34 AM"
src="https://github.com/fleetdm/fleet/assets/61553566/fdd8e455-7f54-4177-be3e-4a82a879a176">

<img width="2550" alt="Screenshot 2024-03-05 at 11 47 27 AM"
src="https://github.com/fleetdm/fleet/assets/61553566/3b33b097-f652-4e99-b944-2d29ffe3f311">



- [x] Manual QA for all new/changed functionality

---------

Co-authored-by: Jacob Shandling <jacob@fleetdm.com>
2024-03-05 14:08:24 -08:00
Jacob Shandling
cbd1a142b4
UI – Refactor edit query > name and description fields to allow reasonable control of pencil icons (#17086)
## –> #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>
2024-02-29 21:56:31 -08:00
Jacob Shandling
aa64c1cf34
UI – set textarea columns based on placeholder length (#15700)
## Addresses #13095 

<img width="501" alt="Screenshot 2023-12-15 at 1 52 05 PM"
src="https://github.com/fleetdm/fleet/assets/61553566/37fa6d41-e7d0-4324-93c8-d3d7ce4e0d33">


- [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>
2023-12-18 09:37:40 -08:00
RachelElysia
f0cdb58ea5
Fleet UI: Fix autosize text field to not cut off placeholder text (#13826) 2023-09-11 09:39:01 -04:00
Gabriel Hernandez
546225ed35
update storybook to work with webpack 5 and move babelrc into its own file out of package.json (#11499) 2023-05-03 17:50:17 +01:00
Gabriel Hernandez
443153a5d5
UI polish and style fixes for query pages (#8643)
* polish manage query page styles

* fix pencil icon spacing on query and policy edit form

* increase gutter style for edtior

* truncate long table names in table dropdown on query sidebar

* add change file
2022-11-10 11:00:06 +00:00
Gabriel Hernandez
eb06ef8049
simplify TeamsDropdown component and update ManageHostPage to keep po… (#7606)
* simplify TeamsDropdown component and update ManageHostPage to keep policy filter across team change

* fix TeamDropdown for users not on global team
2022-09-12 16:18:12 +01:00
Martavis Parker
384c987389
Removed all traces of Redux from the app! (#5287)
* clean up routes and useless components

* component clean up

* removed redux from routes

* rename file

* moved useDeepEffect hook with others

* removed redux, fleet, app_constants dirs; added types to utilities

* style cleanup

* typo fix

* removed unused ts-ignore comments

* removed redux packages!!!

* formatting

* fixed typing for simple search function

* updated frontend readme
2022-04-22 09:45:35 -07:00
Luke Heath
5866d68f13
Set max length for name inputs (#4063) 2022-02-08 19:40:38 -06:00
Luke Heath
14d36d8e4d
Refine and improve policy and query editing interface (#4004) 2022-02-04 15:30:27 -06:00