feat: redesign Upgrade to Pro (Premium) admin page#1896
Open
arifulhoque7 wants to merge 3 commits into
Open
Conversation
Rebuild the free-only Premium page (admin.php?page=wpuf_premium) to match the WPUF "Upgrade to Pro" Figma redesign. - Hero (crown + soft glow, "Up to 30% Off" badge), Lite-vs-Pro feature comparison table, "What Changes" 9-card grid, modules/integrations grid, pricing with Annual/Lifetime toggle, refund policy, and CTA banner - Full-width white admin header band matching the post-forms header - Self-hosted Inter + Caveat fonts via @font-face (no Google CDN dependency) - Annual/Lifetime toggle (vanilla JS) swaps price, period suffix, and the lifetime discount chip + strikethrough original price - Figma-exact assets: feature icons, module tiles, payment logos with dividers, money-back badge (transparent) - Scoped resets so WP admin core CSS cannot leak into the page; bands run edge-to-edge Files: - includes/Admin/views/premium.php — rewritten marketing view - includes/Admin/Menu.php — enqueue_premium_script() on the premium hook - assets/css/admin/premium.css, assets/js/admin/premium.js - assets/fonts/{inter,caveat}, assets/images/premium/* Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Since v4.3.8 untracked the generated assets (built in CI), `npm run build` only ran Vite + Tailwind and skipped `grunt less`, `grunt concat`, and `grunt uglify`. After a fresh pull those outputs were missing locally — registration-forms.css, admin.css, frontend-forms.css, the form-builder JS, and frontend-form/upload .min.js — so pages that enqueue them (e.g. the free Registration page) rendered unstyled. Add a `build:legacy` step (less + concat + uglify) to the build chain so a single `npm run build` produces a fully working plugin locally, matching what `grunt release` ships in CI. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (2)
🚧 Files skipped from review as they are similar to previous changes (2)
WalkthroughReplaces the legacy WPUF Premium admin page with a redesigned marketing page. A new ChangesPremium Page Redesign
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related PRs
Suggested labels
Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
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. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
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 `@assets/css/admin/premium.css`:
- Around line 110-113: The `.wpuf-premium-page a:focus` rule and its
corresponding button focus rule (around line 137) are removing outline and
box-shadow properties without providing replacement keyboard-visible focus
styles. Instead of removing these focus indicators with `outline: none` and
`box-shadow: none`, replace them with alternative visible focus styles such as a
colored outline, box-shadow with a distinct color, or a border that makes the
focused element clearly visible for keyboard navigation. Apply consistent focus
styling to both the anchor and button focus states to ensure all interactive
controls are discernible during keyboard navigation.
In `@includes/Admin/views/premium.php`:
- Line 361: The dynamic output in HTML attributes on lines 361 and 376 is not
properly escaped for security. Wrap the conditional ternary expressions that
output `$plan['featured']` logic with the `esc_attr()` function. Specifically,
for the class attribute containing the wpuf-pp-plan conditional logic and the
style attribute on line 376, apply `esc_attr()` around the entire ternary
expression (e.g., `esc_attr($plan['featured'] ? 'value' : '')`) to ensure proper
attribute escaping according to WordPress coding standards.
🪄 Autofix (Beta)
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: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 0dfd77cb-6f5e-48a9-ade3-179beace4d96
⛔ Files ignored due to path filters (23)
assets/fonts/caveat/Caveat-latin.woff2is excluded by!**/*.woff2assets/fonts/inter/Inter-latin.woff2is excluded by!**/*.woff2assets/images/premium/hero-crown.pngis excluded by!**/*.pngassets/images/premium/hero-glow.pngis excluded by!**/*.pngassets/images/premium/icons/feat-1.pngis excluded by!**/*.pngassets/images/premium/icons/feat-2.pngis excluded by!**/*.pngassets/images/premium/icons/feat-3.pngis excluded by!**/*.pngassets/images/premium/icons/feat-4.pngis excluded by!**/*.pngassets/images/premium/icons/feat-5.pngis excluded by!**/*.pngassets/images/premium/icons/feat-6.pngis excluded by!**/*.pngassets/images/premium/icons/feat-7.pngis excluded by!**/*.pngassets/images/premium/icons/feat-8.pngis excluded by!**/*.pngassets/images/premium/icons/feat-9.pngis excluded by!**/*.pngassets/images/premium/mod-buddypress.pngis excluded by!**/*.pngassets/images/premium/mod-html-email.pngis excluded by!**/*.pngassets/images/premium/mod-mailchimp.pngis excluded by!**/*.pngassets/images/premium/mod-pmpro.pngis excluded by!**/*.pngassets/images/premium/mod-qr.pngis excluded by!**/*.pngassets/images/premium/mod-seo.pngis excluded by!**/*.pngassets/images/premium/mod-sms.pngis excluded by!**/*.pngassets/images/premium/mod-zapier.pngis excluded by!**/*.pngassets/images/premium/payment-logos.pngis excluded by!**/*.pngassets/images/premium/refund-badge.pngis excluded by!**/*.png
📒 Files selected for processing (5)
assets/css/admin/premium.cssassets/js/admin/premium.jsincludes/Admin/Menu.phpincludes/Admin/views/premium.phppackage.json
Address CodeRabbit review on PR weDevsOfficial#1896: - premium.php: wrap plan class/style ternaries in esc_attr() - premium.css: add :focus-visible rule for links and buttons Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Ref: weDevsOfficial/wpuf-pro#1489
Summary
Rebuilds the free-only Premium page (
admin.php?page=wpuf_premium) to match the WPUF "Upgrade to Pro" Figma redesign. The page is gated to the free version (! class_exists( 'WP_User_Frontend_Pro' )) — unchanged.What's included
Implementation notes
assets/css/admin/premium.css+assets/js/admin/premium.js, enqueued only on the premium page hook (enqueue_premium_script()inMenu.php)@font-face(no Google Fonts CDN dependency)assets/images/premium/Build fix (2nd commit)
npm run buildpreviously ran only Vite + Tailwind, skippinggrunt less/concat/uglify. After v4.3.8 untracked the generated assets, a fresh local pull leftregistration-forms.css, the form-builder JS, etc. missing — so the free Registration page rendered unstyled. Added abuild:legacystep so a singlenpm run buildproduces a fully working plugin locally, matching whatgrunt releaseships in CI.Test plan
composer phpcsclean on changed PHPnpm run buildnow regenerates the legacy LESS/concat/uglify assets🤖 Generated with Claude Code
Summary by CodeRabbit