Fleet UI: Policy details page followup by RachelElysia · Pull Request #43324 · fleetdm/fleet

RachelElysia · 2026-04-09T14:44:31Z

Issue

Closes #41753
Closes #43263

Description

Followups from claude code review on previous PR Fleet UI: *New* policy details page + updates to the edit policy and edit report pages #43102
adds a dedicated live-run route (/policies/:id/live, plus /policies/new/live) mirroring reports routes
Reorganizes /policies frontend directories to mirror the /queries structure and updates internal imports/URL params.

Screen recording

Watch in 2x
https://fleetdm.zoom.us/clips/share/hjB-2XOJQj2qQEncAImRgQ

More

Changes file added for user-visible changes in changes/, orbit/changes/ or ee/fleetd-chrome/changes.
See Changes files for more information.

Testing

QA'd all new/changed functionality manually

claude

Claude Code Review

This repository is configured for manual code reviews. Comment @claude review to trigger a review and subscribe this PR to future pushes, or @claude review once for a one-time review.

_{Tip: disable this comment in your organization's Code Review settings.}

RachelElysia · 2026-04-09T14:57:02Z

frontend/router/index.tsx

          <Redirect from="queries/:id" to="reports/:id" />
          <Redirect from="queries/:id/edit" to="reports/:id/edit" />
          <Redirect from="queries/:id/live" to="reports/:id/live" />
          <Route path="reports">


/policies URL routes now match /reports URL routes

Copilot

Pull request overview

This PR follows up on #41753 by restructuring the policies UI/routes so policy SQL is less prominent, introducing a read-only policy details view and separating edit + live-run flows.

Changes:

Adds a new policy details page (/policies/:id) with read-only policy information and action buttons.
Splits policy editing into a dedicated edit route (/policies/:id/edit) and adds a dedicated live-run route (/policies/:id/live, plus /policies/new/live).
Reorganizes /policies frontend directories to mirror the /queries structure and updates internal imports/URL params.

Reviewed changes

Copilot reviewed 15 out of 39 changed files in this pull request and generated 4 comments.

Show a summary per file

File	Description
frontend/router/paths.ts	Adds `LIVE_POLICY` path helper for `/policies/:id/live` and `/policies/new/live`.
frontend/router/index.tsx	Updates routing to use new policies details/edit/live pages and nested `new/live` route.
frontend/pages/policies/PolicyPage/index.ts	Removes legacy re-export for the old PolicyPage location.
frontend/pages/policies/ManagePoliciesPage/components/PoliciesTable/PoliciesTableConfig.tsx	Updates policy details link query param to `fleet_id`.
frontend/pages/policies/live/screens/RunQuery.tsx	Repoints `PolicyResults` import to the new edit components location.
frontend/pages/policies/live/LivePolicyPage/LivePolicyPage.tsx	Introduces the live policy run flow page (targets + run).
frontend/pages/policies/live/LivePolicyPage/index.ts	Barrel export for `LivePolicyPage`.
frontend/pages/policies/live/LivePolicyPage/_styles.scss	Styles for the new live policy page wrapper.
frontend/pages/policies/edit/screens/QueryEditor.tsx	Updates PolicyForm import path and switches URL param to `fleet_id` for back navigation.
frontend/pages/policies/edit/index.ts	Barrel export for `EditPolicyPage`.
frontend/pages/policies/edit/EditPolicyPage.tsx	Refactors the policy edit page to route into the new live flow instead of in-page steps.
frontend/pages/policies/edit/components/SaveNewPolicyModal/SaveNewPolicyModal.tsx	Adds a modal for saving a new policy (name/description/resolution/platform/labels/critical).
frontend/pages/policies/edit/components/SaveNewPolicyModal/SaveNewPolicyModal.tests.tsx	Adds tests for SaveNewPolicyModal behavior (tier gating + label payload behavior).
frontend/pages/policies/edit/components/SaveNewPolicyModal/index.ts	Barrel export for `SaveNewPolicyModal`.
frontend/pages/policies/edit/components/SaveNewPolicyModal/_styles.scss	Adds styles for the modal’s “Critical” checkbox label weight.
frontend/pages/policies/edit/components/PolicyResultsTable/PolicyResultsTableConfig.tsx	New table config for live policy results host list.
frontend/pages/policies/edit/components/PolicyResultsTable/PolicyResultsTable.tsx	New PolicyResultsTable wrapper around `TableContainer`.
frontend/pages/policies/edit/components/PolicyResultsTable/index.ts	Barrel export for `PolicyResultsTable`.
frontend/pages/policies/edit/components/PolicyResultsTable/_styles.scss	Styles for PolicyResultsTable UI.
frontend/pages/policies/edit/components/PolicyResults/PolicyResults.tsx	Adds live policy results UI with Results/Errors tabs and export + show query.
frontend/pages/policies/edit/components/PolicyResults/index.ts	Barrel export for `PolicyResults`.
frontend/pages/policies/edit/components/PolicyResults/helpers.tsx	Adds helper for yes/no counts used by results UI.
frontend/pages/policies/edit/components/PolicyResults/_styles.scss	Styles for the new results UI.
frontend/pages/policies/edit/components/PolicyForm/PolicyForm.tsx	Updates redirect effect dependency list (permissions/route inputs).
frontend/pages/policies/edit/components/PolicyForm/PolicyForm.tests.tsx	Adds/updates tests for PolicyForm behavior (tier gating, targeting, patch policies).
frontend/pages/policies/edit/components/PolicyForm/index.ts	Barrel export for `PolicyForm`.
frontend/pages/policies/edit/components/PolicyForm/_styles.scss	Updates warning class selector to match renamed edit policy base class.
frontend/pages/policies/edit/components/PolicyErrorsTable/PolicyErrorsTableConfig.tsx	New table config for live policy errors list.
frontend/pages/policies/edit/components/PolicyErrorsTable/PolicyErrorsTable.tsx	New PolicyErrorsTable wrapper around `TableContainer`.
frontend/pages/policies/edit/components/PolicyErrorsTable/index.ts	Barrel export for `PolicyErrorsTable`.
frontend/pages/policies/edit/components/PolicyErrorsTable/_styles.scss	Styles for PolicyErrorsTable UI.
frontend/pages/policies/edit/components/PolicyAutomations/PolicyAutomations.tsx	Moves/introduces PolicyAutomations component under the new edit component tree.
frontend/pages/policies/edit/components/PolicyAutomations/index.ts	Barrel export for `PolicyAutomations`.
frontend/pages/policies/edit/components/PolicyAutomations/_styles.scss	Styles for PolicyAutomations UI.
frontend/pages/policies/edit/_styles.scss	Adds new base styles for the refactored edit policy page.
frontend/pages/policies/details/PolicyDetailsPage/PolicyDetailsPage.tsx	Adds team-aware policy loading, updates buttons to edit/live routes, and updates `fleet_id` usage.
frontend/pages/policies/details/PolicyDetailsPage/index.ts	Barrel export for `PolicyDetailsPage`.
frontend/pages/policies/details/PolicyDetailsPage/_styles.scss	Adds styles for the new policy details page layout.
changes/41753-policy-details-page	Adds user-visible changelog entries for the new details/edit/live policy pages.

Comments suppressed due to low confidence (1)

frontend/pages/policies/edit/EditPolicyPage.tsx:52

The component in EditPolicyPage.tsx is still named PolicyPage and exported as such. Renaming the component to EditPolicyPage would better match the file/route name and reduce confusion when debugging React trees and stack traces.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

frontend/pages/policies/live/LivePolicyPage/LivePolicyPage.tsx

Copilot · 2026-04-09T14:57:32Z

frontend/pages/policies/live/LivePolicyPage/LivePolicyPage.tsx

+      onSuccess: (host) => {
+        setTargetedHosts((prevHosts) =>
+          prevHosts.filter((h) => h.id !== host.id).concat(host)
+        );
+        const targets = selectedTargets;
+        host.target_type = "hosts";
+        targets.push(host);
+        setSelectedTargets([...targets]);


onSuccess mutates stateful values directly (const targets = selectedTargets; targets.push(host); and host.target_type = ...). Mutating React state arrays/objects can cause hard-to-debug issues with stale renders. Prefer creating a new targets array via the setter’s functional form and avoid mutating the host object returned from the cache (derive a new object with target_type).

This follows the same pattern on LiveQueryPage and PolicyPage and this is intended

frontend/router/paths.ts

… queries url sub

codecov · 2026-04-09T15:03:33Z

Codecov Report

❌ Patch coverage is 0% with 1 line in your changes missing coverage. Please review.
✅ Project coverage is 66.86%. Comparing base (fc7cb8c) to head (ceaa959).
⚠️ Report is 10 commits behind head on main.

Files with missing lines	Patch %	Lines
frontend/router/paths.ts	0.00%	1 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main   #43324      +/-   ##
==========================================
- Coverage   66.88%   66.86%   -0.02%     
==========================================
  Files        2588     2586       -2     
  Lines      207496   207485      -11     
  Branches     9314     9209     -105     
==========================================
- Hits       138783   138743      -40     
- Misses      56090    56112      +22     
- Partials    12623    12630       +7

Flag	Coverage Δ
frontend	`54.77% <0.00%> (+0.02%)`	⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

RachelElysia requested a review from a team as a code owner April 9, 2026 14:44

Copilot AI review requested due to automatic review settings April 9, 2026 14:44

claude bot reviewed Apr 9, 2026

View reviewed changes

Copilot started reviewing on behalf of RachelElysia April 9, 2026 14:46 View session

RachelElysia changed the title ~~41753 followup~~ Fleet UI: Policy details page followup Apr 9, 2026

RachelElysia commented Apr 9, 2026

View reviewed changes

Copilot AI reviewed Apr 9, 2026

View reviewed changes

Rachel Perkins added 4 commits April 9, 2026 10:58

Update to use fleet_id

7e8a729

Update API call to include team policies, fix dependency array

afc5b6e

Rearrange files to match queries directory, update /live url to match…

59697f5

… queries url sub

Add changelog

0b21e36

RachelElysia force-pushed the 41753-followup branch from ac66fe7 to 0b21e36 Compare April 9, 2026 14:58

RachelElysia temporarily deployed to Docker Hub April 9, 2026 14:59 — with GitHub Actions Inactive

RachelElysia marked this pull request as draft April 9, 2026 15:02

Fix prettier

6822842

RachelElysia temporarily deployed to Docker Hub April 9, 2026 15:21 — with GitHub Actions Inactive

Fix lint on livepolicypage

6fa39c2

RachelElysia temporarily deployed to Docker Hub April 9, 2026 15:27 — with GitHub Actions Inactive

lint on editpolicy page

41f3fb9

RachelElysia temporarily deployed to Docker Hub April 9, 2026 15:34 — with GitHub Actions Inactive

RachelElysia marked this pull request as ready for review April 9, 2026 15:46

useEffect for re-route + parsed host id so react query caches properly

ceaa959

RachelElysia temporarily deployed to Docker Hub April 9, 2026 17:56 — with GitHub Actions Inactive

RachelElysia assigned cdcme and unassigned cdcme Apr 9, 2026

cdcme approved these changes Apr 9, 2026

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Fleet UI: Policy details page followup#43324

Fleet UI: Policy details page followup#43324
RachelElysia wants to merge 8 commits intomainfrom
41753-followup

RachelElysia commented Apr 9, 2026 •

edited

Loading

Uh oh!

claude bot left a comment

Uh oh!

RachelElysia Apr 9, 2026

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Uh oh!

Copilot AI Apr 9, 2026

Uh oh!

RachelElysia Apr 9, 2026

Uh oh!

Uh oh!

codecov bot commented Apr 9, 2026 •

edited

Loading

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Conversation

RachelElysia commented Apr 9, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Issue

Description

Screen recording

More

Testing

Uh oh!

claude bot left a comment

Choose a reason for hiding this comment

Claude Code Review

Uh oh!

RachelElysia Apr 9, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Uh oh!

Copilot AI Apr 9, 2026

Choose a reason for hiding this comment

Uh oh!

RachelElysia Apr 9, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

codecov bot commented Apr 9, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

RachelElysia commented Apr 9, 2026 •

edited

Loading

codecov bot commented Apr 9, 2026 •

edited

Loading