Traffic Boost: Add UI components for the Traffic Boost functionality #3064

vaurdan · 2025-01-13T10:37:19Z

Description

This PR implements most of the UI functionality for the Traffic Boost functionality.

There are a couple mockup functions that will be removed once the missing backend is implemented.

Motivation and context

Implement the Traffic Boost UI as part of Implement Traffic Boost feature #2887

How has this been tested?

Tested on my local environment and on the latest Chrome.

Screenshots (if appropriate)

@coderabbitai ignore

Summary by CodeRabbit

Release Notes

New Features
- Added Traffic Boost functionality to help manage and optimize post linking strategies
- Introduced new sidebar and preview components for enhancing content linking
- Implemented dynamic link suggestions and inbound link management
Improvements
- Enhanced dashboard page with new UI components and styling
- Added more flexible pagination and search capabilities for posts
- Improved state management using WordPress data store
Components Added
- Traffic Boost preview and sidebar interfaces
- Link suggestion and management tools
- Thumbnail and snackbar notice components
Technical Enhancements
- Updated TypeScript interfaces and type definitions
- Improved internationalization support
- Added new CSS variables and styling classes

…URLs

wp-parsely.php

src/UI/class-dashboard-page.php

src/content-helper/common/css/variables.scss

…paragraph

# Conflicts: # build/content-helper/dashboard-page.asset.php # build/content-helper/dashboard-page.js

src/content-helper/dashboard-page/components/posts-table/style.scss

src/content-helper/dashboard-page/pages/traffic-boost/preview/preview.scss

...tent-helper/dashboard-page/pages/traffic-boost/sidebar/components/links-list/links-list.scss

...tent-helper/dashboard-page/pages/traffic-boost/sidebar/components/tabs/inbound-links-tab.tsx

src/content-helper/dashboard-page/pages/traffic-boost/sidebar/sidebar.scss

...ontent-helper/dashboard-page/pages/traffic-boost/sidebar/components/tabs/suggestions-tab.tsx

acicovic · 2025-01-16T08:38:36Z

src/content-helper/common/css/common.scss

@@ -7,6 +7,8 @@
 @import "../components/tone-selector/style";
 @import "../components/persona-selector/style";
 @import "../components/input-range/style";
+@import "../components/thumbnail/style";


Not necessarily a thing to do in this PR, but if we think that common.scss is becoming to big, loading to much CSS in places where it isn't needed, we could see how to improve that.

Yeah, I think ideally we should try to have the common components (and all its styles) as an independent module, so it would be loaded before all the other PCH code. This would probably help shrinking the size of the editor-sidebar.js module to be under 256kb and stop webpack from complaining.

But definitely it's work for another PR.

src/content-helper/dashboard-page/pages/traffic-boost/preview/components/preview-iframe.tsx

src/content-helper/dashboard-page/pages/traffic-boost/preview/hooks/use-iframe-highlight.ts

src/content-helper/dashboard-page/pages/traffic-boost/preview/preview.tsx

acicovic

This is excellent work, and a major contribution to our project. Thank you for working on this!

vaurdan added 30 commits December 2, 2024 12:16

Add initial table view for the Traffic Boost page

188ab72

Add Thumbnail component to the common components

d04ecb9

Add initial version of the sidebar

d918747

Cleaning up the LinkList component and bug fixing

2e97f70

Implement the boost links tab

9643ed4

Optimize total item changing handler to use useCallback

3698408

Finalize Suggestions and Boost LInks tabs

63f1567

Add some improvements to the link selection in the sidebar

cf7ece3

Add traffic boost preview panel

0690974

Add remaining functionalities for the traffic boost preview

9a74e07

Jump to smart link position when the DOM changes (component loaded?)

5372391

Change boost links to inbound links & some clean-up

db5ba4e

Prevent selecting a new link text when previewing inbound links

283d579

Implementation of the v3 footer

768b8ca

CSS fix on the suggestion select

9d8785d

Add better loading transitions on the preview iframe

ad50a68

Implement new header outbound links counter.

f23065e

Tweak preview sidebar to fit the new v4 styling.

19a2270

Improve preview footer and header interactions

af46315

Tweaked style of the text selection tooltip

f748ec4

Fix dependency issue when removing highlights

d021603

Add v4 actions to the preview footer.

3e53d0c

Fix minor animation bug in the text selection tooltip

7df8133

Make the highligh color the same as the text color

18d46b4

Fix visual issues with text highlighting

9c37e80

Add snackbar support and selection validations

9b9c769

Allow clicking on the selection to remove it

c322c4c

Allow clicking on a link to auto select it

76e783c

Implement the Add Link button and dialog

5fd646e

Implement adding new links and loading the suggestion.

5eb6679

Fix issue with invalid thumbnails preventing post list from loading.

adcb91c

acicovic added the Feature: PCH Ticket/PR related to the Content Helper label Jan 13, 2025

vaurdan added 2 commits January 13, 2025 16:56

Fix issue when previewing posts in front-end mode that have external …

2f1d3e1

…URLs

Fix issue when previewing posts in front-end mode that have external …

f306c95

…URLs

acicovic reviewed Jan 14, 2025

View reviewed changes

wp-parsely.php Outdated Show resolved Hide resolved

acicovic reviewed Jan 14, 2025

View reviewed changes

src/UI/class-dashboard-page.php Outdated Show resolved Hide resolved

src/content-helper/common/css/variables.scss Outdated Show resolved Hide resolved

src/content-helper/common/css/variables.scss Show resolved Hide resolved

vaurdan and others added 7 commits January 14, 2025 10:26

Fix unnecessary query when there are no inbound links.

51e88e7

Fix issue with wrong highlight when there is another match outside a …

9a73bc7

…paragraph

Minor improvements in the loading of the preview

03777bd

Address initial @acicovic feedback

c4f9522

Merge branch 'add/traffic-boost' into add/traffic-boost-ui

5921a39

# Conflicts: # build/content-helper/dashboard-page.asset.php # build/content-helper/dashboard-page.js

Rebuild assets

83d9ca4

Improve some comments and spacing

d043b94

acicovic reviewed Jan 15, 2025

View reviewed changes

Improve some comments and spacing

23e2c46

acicovic reviewed Jan 15, 2025

View reviewed changes

acicovic reviewed Jan 16, 2025

View reviewed changes

acicovic and others added 2 commits January 16, 2025 11:58

Improve some comments and spacing

ed35d90

Address @acicovic feedback

e3052b3

coderabbitai bot approved these changes Jan 16, 2025

View reviewed changes

vaurdan and others added 3 commits January 16, 2025 11:22

Apply CodeRabbit suggestions

7aaf4c7

Address SonarCloud issues

d62bd30

Improve some comments and sort extra colors in variables.scss

45e117f

acicovic approved these changes Jan 16, 2025

View reviewed changes

vaurdan merged commit 9d6f9cc into add/traffic-boost Jan 16, 2025
39 checks passed

vaurdan deleted the add/traffic-boost-ui branch January 16, 2025 14:12

acicovic removed Component: PHP labels Apr 2, 2025

acicovic modified the milestones: 3.18.0, 3.19.0 Apr 9, 2025

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Traffic Boost: Add UI components for the Traffic Boost functionality #3064

Traffic Boost: Add UI components for the Traffic Boost functionality #3064

vaurdan commented Jan 13, 2025 •

edited by coderabbitai bot

Loading

acicovic Jan 16, 2025

vaurdan Jan 16, 2025

acicovic left a comment

Traffic Boost: Add UI components for the Traffic Boost functionality #3064

Traffic Boost: Add UI components for the Traffic Boost functionality #3064

Conversation

vaurdan commented Jan 13, 2025 • edited by coderabbitai bot Loading

Description

Motivation and context

How has this been tested?

Screenshots (if appropriate)

Summary by CodeRabbit

Release Notes

acicovic Jan 16, 2025

Choose a reason for hiding this comment

vaurdan Jan 16, 2025

Choose a reason for hiding this comment

acicovic left a comment

Choose a reason for hiding this comment

vaurdan commented Jan 13, 2025 •

edited by coderabbitai bot

Loading