Skip to content

Software title page tweaks - #48577

Merged
noahtalerman merged 10 commits into
mainfrom
noahtalerman-patch-87
Jul 1, 2026
Merged

Software title page tweaks#48577
noahtalerman merged 10 commits into
mainfrom
noahtalerman-patch-87

Conversation

@noahtalerman

@noahtalerman noahtalerman commented Jul 1, 2026

Copy link
Copy Markdown
Member

We decided to remove the "Shield" icon for patch policies because they're already being used for critical policies.

Also, the tooltip copy isn't quite right.

Screenshot 2026-07-01 at 3 03 13 PM Screenshot 2026-07-01 at 3 03 32 PM

Also, smaller screen widths are strange:

Screenshot 2026-07-01 at 3 04 25 PM

I updated this to not wrap:

Screenshot 2026-07-01 at 3 15 30 PM

Also the veil in darkmode is strange:

Screenshot 2026-07-01 at 3 05 44 PM

Fix in this PR:

Screenshot 2026-07-01 at 3 19 32 PM

Summary by CodeRabbit

Summary by CodeRabbit

  • Bug Fixes
    • Simplified the Chip tooltip for single linked policies on software summary cards.
    • Adjusted Chip tooltip positioning for more consistent spacing.
  • UI Improvements
    • Updated the software details summary grid to place pills more predictably.
    • Refreshed the edit icon modal overlay gradient to be more theme-aware.
  • Documentation
    • Updated the related Storybook tooltip text to match the new user-facing wording.

Removed unnecessary line breaks from tooltip text.
@noahtalerman

noahtalerman commented Jul 1, 2026

Copy link
Copy Markdown
Member Author

FYI @RachelElysia @cdcme @marko-lisica

@noahtalerman
noahtalerman marked this pull request as ready for review July 1, 2026 16:41
@noahtalerman
noahtalerman requested a review from a team as a code owner July 1, 2026 16:41

@claude claude Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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.

@coderabbitai

coderabbitai Bot commented Jul 1, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: a50e3408-5c0e-462a-af34-51d8c7ad1335

📥 Commits

Reviewing files that changed from the base of the PR and between b189f3d and b446226.

📒 Files selected for processing (1)
  • frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/SoftwareSummaryCard/SoftwareSummaryCard.tsx
🚧 Files skipped from review as they are similar to previous changes (1)
  • frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/SoftwareSummaryCard/SoftwareSummaryCard.tsx

Walkthrough

This change updates policy-chip tooltip content and tooltip positioning in Chip and SoftwareSummaryCard, including removing the extra “Select to open policy.” line and clearing the icon for patch-policy-only chips. It also changes software page styles: the edit icon modal overlay now uses color-mix(), and the software details summary grid reserves an inline pills column with updated header pills layout.

Changes

  • Chip now passes tipOffset={8} when rendering a tooltip.
  • SoftwareSummaryCard uses a helper for policy-chip tooltip text and changes the patch-policy-only icon to undefined.
  • The Chip Storybook tooltip text was shortened.
  • Software page SCSS updates adjust the edit icon overlay gradient and the software details summary pills/grid layout.

Possibly related PRs

  • fleetdm/fleet#47682: Related Chip tooltip and policy-chip UI wiring on the Software title details page.
🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Description check ⚠️ Warning The description covers the gist, but it does not follow the template and is missing the required related issue line and most checklist sections. Add the template sections, especially a Related issue line and the relevant checklist/testing items, or remove sections that do not apply.
✅ Passed checks (4 passed)
Check name Status Explanation
Title check ✅ Passed The title is concise and related to the UI changes, though it is broad.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.
✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch noahtalerman-patch-87

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@codecov

codecov Bot commented Jul 1, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 68.00%. Comparing base (8cf4a7c) to head (b446226).

Additional details and impacted files
@@            Coverage Diff             @@
##             main   #48577      +/-   ##
==========================================
- Coverage   68.01%   68.00%   -0.02%     
==========================================
  Files        3678     3678              
  Lines      233758   233575     -183     
  Branches    12416    12305     -111     
==========================================
- Hits       158981   158831     -150     
+ Misses      60475    60452      -23     
+ Partials    14302    14292      -10     
Flag Coverage Δ
frontend 58.96% <100.00%> (+<0.01%) ⬆️

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

☔ View full report in Codecov by Harness.
📢 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.

cdcme
cdcme previously approved these changes Jul 1, 2026
@noahtalerman
noahtalerman requested a review from cdcme July 1, 2026 18:40
@noahtalerman
noahtalerman marked this pull request as draft July 1, 2026 19:02
@noahtalerman

noahtalerman commented Jul 1, 2026

Copy link
Copy Markdown
Member Author

Converting this to draft because I noticed that we're still using the "Shield" icon for patch policies. We decided to remove that because it's already being used for critical policies.

Also the tooltip copy isn't quite right.

Screenshot 2026-07-01 at 3 03 13 PM Screenshot 2026-07-01 at 3 03 32 PM

Also, smaller screen widths are strange:

Screenshot 2026-07-01 at 3 04 25 PM

Also the veil in darkmode is strange:

Screenshot 2026-07-01 at 3 05 44 PM

@noahtalerman noahtalerman changed the title Copy update: Remove redundant text Software title page tweaks Jul 1, 2026
@noahtalerman

Copy link
Copy Markdown
Member Author

We decided to remove the "Shield" icon for patch policies because they're already being used for critical policies.

Also, the tooltip copy isn't quite right.

Screenshot 2026-07-01 at 3 03 13 PM Screenshot 2026-07-01 at 3 03 32 PM

Also, smaller screen widths are strange:

Screenshot 2026-07-01 at 3 04 25 PM

I updated this to not wrap:

Screenshot 2026-07-01 at 3 15 30 PM

Also the veil in darkmode is strange:

Screenshot 2026-07-01 at 3 05 44 PM

Fix in this PR:

Screenshot 2026-07-01 at 3 19 32 PM

@RachelElysia @cdcme @marko-lisica I increased the scope of this PR to include the above updates. Please let me know if you disagree with any of the choices.

Also, Carlo, please let me know if you want me to break up this PR into smaller bites.

@noahtalerman
noahtalerman marked this pull request as ready for review July 1, 2026 19:34

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🧹 Nitpick comments (1)
frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/SoftwareSummaryCard/SoftwareSummaryCard.tsx (1)

47-61: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Fix prettier formatting flagged by lint.

Static analysis flags the multi-line JSX text on Lines 57-59; collapse it to match prettier formatting.

🎨 Proposed fix
   return isSinglePolicy ? (
     <>Policy triggers install.</>
   ) : (
-    <>
-      Policies trigger install.
-    </>
+    <>Policies trigger install.</>
   );
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In
`@frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/SoftwareSummaryCard/SoftwareSummaryCard.tsx`
around lines 47 - 61, The tooltip JSX in getPolicyChipTooltip is formatted in a
way that violates prettier rules; simplify the multi-line fragment in the
non-single-policy branch of SoftwareSummaryCard so it matches the same compact
JSX style used elsewhere and passes lint formatting.

Source: Linters/SAST tools

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Nitpick comments:
In
`@frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/SoftwareSummaryCard/SoftwareSummaryCard.tsx`:
- Around line 47-61: The tooltip JSX in getPolicyChipTooltip is formatted in a
way that violates prettier rules; simplify the multi-line fragment in the
non-single-policy branch of SoftwareSummaryCard so it matches the same compact
JSX style used elsewhere and passes lint formatting.

ℹ️ Review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: cc62db99-8b84-4f8d-b954-d36019850e5a

📥 Commits

Reviewing files that changed from the base of the PR and between e957383 and b189f3d.

📒 Files selected for processing (4)
  • frontend/components/Chip/Chip.tsx
  • frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/EditIconModal/_styles.scss
  • frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/SoftwareSummaryCard/SoftwareSummaryCard.tsx
  • frontend/pages/SoftwarePage/components/cards/SoftwareDetailsSummary/_styles.scss
✅ Files skipped from review due to trivial changes (1)
  • frontend/pages/SoftwarePage/SoftwareTitleDetailsPage/EditIconModal/_styles.scss

@cdcme cdcme left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No, @noahtalerman I think this looks good. Thanks!

@noahtalerman
noahtalerman merged commit b25b2ef into main Jul 1, 2026
25 of 26 checks passed
@noahtalerman
noahtalerman deleted the noahtalerman-patch-87 branch July 1, 2026 21:38
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants