Skip to content

Conversation

@acicovic
Copy link
Collaborator

@acicovic acicovic commented May 20, 2025

Description

With this work, we're merging the Traffic Boost feature to our develop branch.

Most of the code was authored by @vaurdan, with @alecgeatches and myself completing the work. It introduces a Parse.ly menu in the WordPress admin, which links to the new Traffic Boost feature and the plugin's settings.

Motivation and context

Implements #2887.

Screenshots

image-15-1

Summary by CodeRabbit

  • New Features

    • Introduced the "Traffic Boost" feature, allowing users to increase page views by adding links to key content within high-performing articles.
    • Added a new dashboard with posts table, search, and statistics, including paginated views and smart link counts.
    • Implemented Traffic Boost sidebar and preview interfaces for managing and reviewing suggested inbound links.
    • Added settings and permissions controls for enabling/disabling Traffic Boost.
    • Enhanced REST API endpoints to support Traffic Boost operations and smart link management.
  • Improvements

    • Updated smart linking to support ITM campaign parameters and improved link status handling.
    • Enhanced dashboard and sidebar UI with new components, styling, and accessibility improvements.
    • Improved error handling, loading indicators, and user feedback throughout the dashboard and Traffic Boost features.
  • Bug Fixes

    • Fixed admin settings and site health links to direct users to the correct settings page.
    • Corrected display of post type labels and improved handling of canonical URLs.
  • Documentation

    • Updated README and in-app help to describe the new Traffic Boost feature and its capabilities.
  • Chores

    • Added new dependencies and type definitions to support Traffic Boost and dashboard enhancements.
    • Refactored and reorganized code for better maintainability and scalability.

vaurdan and others added 30 commits January 27, 2025 11:22
# Conflicts:
#	package-lock.json
#	src/content-helper/common/settings/provider.tsx
Traffic Boost: Add backend implementation
@acicovic acicovic added this to the 3.19.0 milestone May 20, 2025
@acicovic acicovic added Changelog: Added PR to be added under the changelog's "Added" section Feature: PCI Ticket/PR related to Content Intelligence Feature: Engagement Boost Ticket/PR related to Engagement Boost labels May 20, 2025
@coderabbitai
Copy link
Contributor

coderabbitai bot commented May 20, 2025

Caution

Review failed

Failed to post review comments.

📝 Walkthrough

Walkthrough

This update introduces a comprehensive "Traffic Boost" feature for the Parse.ly WordPress plugin, including backend REST API endpoints, WordPress admin UI integration, React-based dashboard pages, and supporting infrastructure for managing and previewing smart links. It also refactors smart link handling to support ITM parameters, adds new provider classes, updates type definitions, and enhances error handling, permissions, and settings management.

Changes

File(s) / Path(s) Change Summary
.husky/pre-commit Increased PHPStan memory limit from 1GB to 2GB.
composer.json, package.json, phpstan.neon Added new PHP and JS dependencies for HTML parsing and type definitions. Adjusted PHPStan type coverage thresholds.
README.md Documented the new "Traffic Boost" feature and updated screenshots.
src/class-parsely.php, src/class-permissions.php, src/UI/class-settings-page.php, src/UI/class-dashboard-page.php, src/UI/class-row-actions.php, src/UI/class-recommended-widget.php, src/UI/class-site-health.php Added "Traffic Boost" to Content Helper features, permissions, and settings. Integrated Traffic Boost into admin menus, row actions, and settings UI. Updated settings URLs and menu slugs for consistency.
src/Endpoints/class-rest-metadata.php, src/Models/class-smart-link.php, src/Models/class-inbound-smart-link.php, src/Models/class-smart-link-status.php Refactored smart link models: introduced status tracking, context, and improved caching. Added new methods for handling inbound smart links, placements, and validation using DOM parsing. Introduced Smart_Link_Status class as a status enum. Enhanced REST metadata with smart link and traffic boost suggestion counts.
src/Utils/class-utils.php Improved URL-to-post ID caching and added ITM parameter appending utility.
src/@types/assets/window.d.ts Added a nonce property for Traffic Boost preview to the global Window interface.
src/Telemetry/telemetry-init.php Updated telemetry event and class references for settings tracking.
src/content-helper/common/... (multiple files: components, icons, providers, settings, utils, css, etc.) Introduced reusable loading and snackbar notice components, error icons, and enhanced type definitions for permissions and settings (including Traffic Boost). Added utility functions for ITM URL handling. Updated providers to support new REST endpoints and metadata.
src/content-helper/dashboard-page/... (all files) Added a new React-based dashboard with routing, page structure components, posts table with stats, and Traffic Boost management UI. Implemented preview, sidebar, and link management components for Traffic Boost. Added Redux store for state management. Introduced extensive SCSS styling for dashboard and sidebar.
src/content-helper/editor-sidebar/smart-linking/... (provider, utils, component, hooks, review-modal, etc.) Refactored smart linking to support ITM URLs, status, and enriched inbound link data. Updated provider and utilities for new href structure and status. Adjusted UI and messaging for consistency.
src/rest-api/class-base-validation.php Added a base validation class for REST parameter validation and sanitization.
src/rest-api/content-helper/class-content-helper-controller.php, src/rest-api/content-helper/class-endpoint-check-auth.php, src/rest-api/content-helper/class-endpoint-traffic-boost.php, src/rest-api/content-helper/class-endpoint-smart-linking.php Added REST API endpoints for Traffic Boost and authorization checking. Updated smart linking endpoint to use status, context, and improved validation.
src/css/admin-settings.scss, src/js/admin-settings.ts Updated admin settings styles and added logic to show Content Helper section messages based on authorization state.

Sequence Diagram(s)

sequenceDiagram
    participant AdminUser
    participant WP_Admin_UI
    participant DashboardReactApp
    participant REST_API
    participant SmartLinkModel
    participant TrafficBoostProvider

    AdminUser->>WP_Admin_UI: Navigates to Parse.ly Dashboard
    WP_Admin_UI->>DashboardReactApp: Loads React app container
    DashboardReactApp->>REST_API: Fetch posts, metadata, smart links, suggestions
    REST_API->>SmartLinkModel: Get smart link counts, statuses
    REST_API->>TrafficBoostProvider: Get/generate suggestions, placements
    REST_API-->>DashboardReactApp: Return posts, links, suggestions, stats

    AdminUser->>DashboardReactApp: Interacts with Traffic Boost UI (search, select post)
    DashboardReactApp->>REST_API: Generate/accept/discard/update inbound links
    REST_API->>TrafficBoostProvider: Process link actions, update models
    TrafficBoostProvider->>SmartLinkModel: Apply/remove/update smart links
    TrafficBoostProvider-->>REST_API: Return updated link state
    REST_API-->>DashboardReactApp: Respond with result

    AdminUser->>DashboardReactApp: Opens post preview
    DashboardReactApp->>REST_API: Request preview nonce, post content
    REST_API-->>DashboardReactApp: Return preview data
    DashboardReactApp->>WP_Admin_UI: Render preview iframe with highlights, controls
Loading
sequenceDiagram
    participant AdminUser
    participant SettingsPage
    participant REST_API
    participant CheckAuthProvider

    AdminUser->>SettingsPage: Opens Content Helper settings
    SettingsPage->>CheckAuthProvider: Request Suggestions API and Traffic Boost auth status
    CheckAuthProvider->>REST_API: POST /check-auth (for each scope)
    REST_API-->>CheckAuthProvider: Return auth status
    CheckAuthProvider-->>SettingsPage: Provide status
    SettingsPage->>SettingsPage: Display status messages (access, request, or contact support)
Loading
sequenceDiagram
    participant WP_Post
    participant SmartLinkModel
    participant InboundSmartLink
    participant HTML5Parser

    SmartLinkModel->>InboundSmartLink: Create inbound smart link
    InboundSmartLink->>WP_Post: Fetch post content
    InboundSmartLink->>HTML5Parser: Parse HTML content, locate paragraph/text
    HTML5Parser-->>InboundSmartLink: Return DOM node/paragraph
    InboundSmartLink->>WP_Post: Apply/remove/update link in content
    WP_Post-->>InboundSmartLink: Save updated content/meta
Loading

Warning

There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

npm warn config production Use --omit=dev instead.
npm error Exit handler never called!
npm error This is an error with npm itself. Please report this error at:
npm error https://github.com/npm/cli/issues
npm error A complete log of this run can be found in: /.npm/_logs/2025-05-20T13_07_47_695Z-debug-0.log

✨ Finishing Touches
  • 📝 Generate Docstrings

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
🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>, please review it.
    • Explain this complex logic.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
    • @coderabbitai explain this code block.
    • @coderabbitai modularize this function.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
    • @coderabbitai read src/utils.ts and explain its main purpose.
    • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
    • @coderabbitai help me debug CodeRabbit configuration file.

Support

Need help? Create a ticket on our support page for assistance with any issues or questions.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai full review to do a full review from scratch and review all the files again.
  • @coderabbitai summary to regenerate the summary of the PR.
  • @coderabbitai generate docstrings to generate docstrings for this PR.
  • @coderabbitai generate sequence diagram to generate a sequence diagram of the changes in this PR.
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
  • @coderabbitai help to get help.

Other keywords and placeholders

  • Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
  • Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
  • Add @coderabbitai anywhere in the PR title to generate the title automatically.

Documentation and Community

  • Visit our Documentation for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

@acicovic acicovic marked this pull request as ready for review May 20, 2025 13:06
@acicovic acicovic requested a review from a team as a code owner May 20, 2025 13:06
@acicovic acicovic merged commit e1a9cc2 into develop May 20, 2025
41 checks passed
@acicovic acicovic deleted the add/traffic-boost branch May 20, 2025 13:14
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Changelog: Added PR to be added under the changelog's "Added" section Feature: Engagement Boost Ticket/PR related to Engagement Boost Feature: PCI Ticket/PR related to Content Intelligence

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants