polish(pwa): redesigned install/update notices for all screen sizes + review follow-ups#905
Conversation
Glass lux cards with per-type icon tiles (install/update/offline/restored), heading-ink titles, corner dismiss buttons, and a reduced-motion-safe entrance animation. Placement per screen size: bottom sheet-style above the composer on phones, floating bottom-right card on medium screens, top-right toast under the header on desktop (beside the browser's own install affordance). Copy, roles, and button names unchanged. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01EXsJcLrbZUXwnBeG91cVo9
Review follow-up on #892: the widened heading matcher ended a required section at ANY next heading, so ### sub-structure inside ## Verification truncated the section and false-rejected valid bodies. A section now runs to the next heading of the same or shallower level; self-test case added. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01EXsJcLrbZUXwnBeG91cVo9
|
Warning Review limit reached
Next review available in: 16 minutes Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available. How can I continue?After more reviews become available, a review can be triggered using the To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews. How do review limits work?CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability. For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window. Please refer docs for additional details. Review details⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (3)
📝 WalkthroughWalkthroughThe PR redesigns PWA notices with shared icons, dismiss controls, responsive animation, and reduced-motion support. It also makes PR policy parsing heading-aware, adds nested-heading coverage, and records two review outcomes in the branch ledger. ChangesPWA notice redesign
PR policy section parsing
Review ledger updates
Estimated code review effort: 3 (Moderate) | ~25 minutes Possibly related PRs
Suggested labels: Suggested reviewers: 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches🧪 Generate unit tests (beta)
Comment |
|
This pull request has been ignored for the connected project Preview Branches by Supabase. |
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01EXsJcLrbZUXwnBeG91cVo9
|
@copilot resolve the merge conflicts on this branch. |
…a-review-asi3wb # Conflicts: # docs/branch-review-ledger.md # src/components/pwa-lifecycle.tsx
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 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.
Inline comments:
In `@scripts/pr-policy.mjs`:
- Around line 55-65: Update the heading parser used by the section-boundary
logic around normalizeSectionHeading to collect levels 1 through 6 instead of
only levels 2 through 6, so a later level-1 heading terminates a preceding
section. Add a regression test verifying checklist or rollback evidence after a
level-1 heading is excluded from the earlier section.
In `@src/components/pwa-lifecycle.tsx`:
- Around line 387-405: Update the offline notice in the component containing the
“You appear to be offline” text to add accessible dismiss state and a clearly
labeled dismiss button alongside “Try again.” Suppress the card after dismissal,
and reset that state on the next connectivity transition so the notice can
reappear when connectivity changes.
🪄 Autofix (Beta)
❌ Autofix failed (check again to retry)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro Plus
Run ID: 21af3d47-4ab2-4867-802d-f1b2b57b199a
📒 Files selected for processing (4)
docs/branch-review-ledger.mdscripts/pr-policy.mjssrc/app/globals.csssrc/components/pwa-lifecycle.tsx
|
@copilot resolve the merge conflicts in this pull request |
…ection boundaries
Offline notice gains the same corner dismiss as the other cards, scoped per
offline episode (the next connectivity drop re-surfaces it) with a dom test.
pr-policy heading scan widened to #{1,6} so a level-1 heading terminates a
preceding ## section; self-test case added.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01EXsJcLrbZUXwnBeG91cVo9
…a-review-asi3wb # Conflicts: # docs/branch-review-ledger.md
Resolved. The conflict was in |
|
Note Autofix is a beta feature. Expect some limitations and changes as we gather feedback and continue to improve it. Autofix skipped. No unresolved CodeRabbit review comments with fix instructions found. |
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: d08a17ffd9
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
Review follow-up: the outline-aware boundary let a mis-levelled sub-heading (and its content) satisfy the Summary requirement. Summary is now judged on its direct content before the first sub-heading, heading lines no longer count as meaningful text anywhere, and self-tests cover both shapes. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01EXsJcLrbZUXwnBeG91cVo9
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 2d24f57c2d
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
Review follow-up: the corner dismiss was 32px, below the repo's --spacing-tap contract. Now h-tap/w-tap with widened content clearance. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01EXsJcLrbZUXwnBeG91cVo9
Summary
src/components/pwa-lifecycle.tsx,src/app/globals.css): the PWA install prompt, update notice, iOS install hint, and offline/restored notices are now glass "lux" cards with per-type icon tiles (accent download / info refresh / warning offline / success restored), heading-ink titles, corner dismiss buttons (44px-safe targets, aria-labelled), and a 280ms entrance animation that honours bothprefers-reduced-motionand the app'sdata-motion="reduced"toggle. Placement is now deliberate per screen size: phones keep the bottom sheet-style card above the fixed composer (thumb zone, safe-area aware); medium screens (≥640px) float a 25rem card bottom-right; desktop (≥1280px) moves the stack to a top-right toast under the header — beside the browser's own install affordance and clear of the composer — with the entrance animation direction flipped to slide down. Copy, ARIA roles, and button names are unchanged, so all existing tests pass untouched.scripts/pr-policy.mjs): the requested repo review of recent main changes confirmed one P2 in fix(ci): make PR policy section parsing robust to markdown heading variants #892's parser — a required section ended at ANY next heading, so###sub-structure inside## Verificationtruncated the section and false-rejected valid PR bodies (fail-closed). Sections are now outline-aware (run to the next heading of same-or-shallower level) with a self-test case locking the regression.Verification
npm run verify:cheap— full chain green: 2828 passed / 1 failed (the long-baselined container-onlypdf-extraction-budgetartifact, hosted-CI-green through feat(pwa): retirement kill-switch, offline-version binding guard, and dev teardown flag #826–polish(design): Phase 5 sweep — forced-colors button labels, tools rail titles, privacy microcopy #896); includes the pr-policy self-test with the new sub-heading casenpm run test:e2e:pwa— privacy/offline journey green; sole failure is the container-onlyin-incognitoinstallability artifactnpm run verify:ui— 236 passed / 2 failed (both long-baselined container-only artifacts:ui-pwainstallability,ui-smokePDF-canvas mobile)npm run build+ client-bundle secret scan +npm run check:bundle-budget— 1293.4 KiB gzip vs 1278.6 KiB enforced baseline, within tolerance (~2.8 KiB from icons/CSS)pwa-lifecycle.dom9/9,pwa-manifest8/8 post-redesignnpm run check:pr-policyself-test green (new outline case included)pwa-notice--*.png)Risk and rollout
b2afe66visuals,6531178policy).Notes
4.25rem + safe-areaheader offset constant as the mode-menu popover, so the toast tracks the header height..nextcache twice served a staleglobals.csscompile across restarts; setting the cache aside fixed it. Not a shippable defect, recorded in the ledger's checks column.🤖 Generated with Claude Code
https://claude.ai/code/session_01EXsJcLrbZUXwnBeG91cVo9
Summary by CodeRabbit
New Features
Bug Fixes
Documentation
Tests