Skip to content

Edit policy & report pages: Make SQL editor less prominent #41753

@rachaelshaw

Description

@rachaelshaw

Goal

User story
As an IT admin viewing a query or policy,
I don't want the SQL to be one of the first things I see
so that I don't feel like I need to be a SQL expert to use Fleet.

Changes

Product

  • UI changes: Figma
  • CLI (fleetctl) usage changes: No changes
  • YAML changes: No changes
  • REST API changes: No changes
  • Fleet's agent (fleetd) changes: No changes
  • Fleet server configuration changes: No changes
  • Exposed, public API endpoint changes: No changes
  • fleetdm.com changes: No changes
  • GitOps mode UI changes: Disable "Edit policy" button w/ standard tooltip in GitOps mode.
  • GitOps generation changes: No changes
  • Activity changes: No changes
  • Permissions changes: No changes
  • Changes to paid features or tiers: No changes
  • My device and fleetdm.com/better changes: No changes
  • Usage statistics: No changes
  • Other reference documentation changes: Check for guides where we mention how to edit a policy, and add the aditional step of clicking "Edit policy" if necessary
  • First draft of test plan added
  • Once shipped, requester has been notified
  • Once shipped, dogfooding issue has been filed

Engineering

  • Test plan is finalized
  • This is a premium only feature: No

Implementation plan

Should be done as 1 PR.

  1. Policy details page refactor: Split the current /policies/:id page into a read-only view (no SQL visible) with header buttons ("Show query", "Run policy", "Edit policy"). This is the biggest piece.
  2. "Show query" modal: New modal with read-only SQL viewer. Straightforward, and it reuses the same modal that already exists on report details.
  3. Edit policy page (/policies/:id/edit): New route with the edit form. Most of the form fields/components already exist on the current page, so mostly rearranging them and moving the SQL editor to the bottom.
  4. Edit report page tweaks: Smaller changes: update heading to "Edit report", use regular form fields for name/description, move query down.
  5. Permission gating - Hide edit button for observer/technician, block access to edit route. GitOps mode tooltip on the edit button. Use existing permission patterns.

ℹ️  Please read this issue carefully and understand it. Pay special attention to UI wireframes, especially "dev notes".

Risk assessment

  • Risk level: Low

Test plan

Make sure front-end is calling the right APIs (no changes to APIs used)

Make sure to go through the list and consider all events that might be related to this story, so we catch edge cases earlier.

  • Test policy details page in Fleet Premium
    • Show query button opens modal
    • Edit button goes to /policies/:id/edit
    • As admin/maintainer (should have option to edit), and as technician or below (should not be able to edit)
  • Test edit policy page changes in Fleet Premium
    • Make sure technician role & below cannot access this page
  • Test edit query page in Fleet Premium
  • Test policy details page in Fleet Free
    • Show query button opens modal
    • Edit button goes to /policies/:id/edit
    • As admin/maintainer (should have option to edit), and as technician or below (should not be able to edit)
  • Test edit policy page in Fleet Free
    • Make sure technician role & below cannot access this page
  • Test edit query page changes in Fleet Free

Testing notes

Make sure front-end is calling the right APIs (no changes to APIs used)

Confirmation

  1. Engineer: Added comment to user story confirming successful completion of test plan.
  2. QA: Added comment to user story confirming successful completion of test plan.

Metadata

Metadata

Assignees

Labels

#g-softwareSoftware product group:releaseReady to write code. Scheduled in a release. See "Making changes" in handbook.storyA user story defining an entire feature~assisting g-orchestrationThis is a #g-orchestration issue that another product group is assisting~frontendFrontend-related issue.

Type

No type

Projects

Status

🐣 In progress

Status

No status

Milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions