From bae165e142babbe625d23e07e54179c2e905a6dd Mon Sep 17 00:00:00 2001 From: Manzoor Wani Date: Wed, 21 Aug 2024 09:38:23 -0700 Subject: [PATCH] Social | Migrate shares data from initial state to new script data (#38988) * Social | Migrate shares data from initial state to new script data * Add changelog * Fix the export --- ...e-social-initial-state-migrate-shares-data | 4 + .../js-packages/publicize-components/index.ts | 1 + .../src/social-store/reducer/index.js | 2 - .../src/social-store/reducer/shares-data.js | 5 -- .../src/social-store/selectors/index.js | 2 - .../src/social-store/selectors/shares-data.ts | 47 ------------ .../selectors/test/shares-data.test.js | 73 ------------------- .../src/social-store/types.ts | 8 -- .../publicize-components/src/types/types.ts | 13 ++-- .../src/utils/shares-data.ts | 47 ++++++++++++ ...e-social-initial-state-migrate-shares-data | 4 + .../src/class-publicize-script-data.php | 13 +++- ...e-social-initial-state-migrate-shares-data | 4 + .../social/src/js/components/header/index.js | 17 ++--- .../social/src/js/components/types/types.ts | 8 -- 15 files changed, 87 insertions(+), 161 deletions(-) create mode 100644 projects/js-packages/publicize-components/changelog/update-social-initial-state-migrate-shares-data delete mode 100644 projects/js-packages/publicize-components/src/social-store/reducer/shares-data.js delete mode 100644 projects/js-packages/publicize-components/src/social-store/selectors/shares-data.ts delete mode 100644 projects/js-packages/publicize-components/src/social-store/selectors/test/shares-data.test.js create mode 100644 projects/js-packages/publicize-components/src/utils/shares-data.ts create mode 100644 projects/packages/publicize/changelog/update-social-initial-state-migrate-shares-data create mode 100644 projects/plugins/social/changelog/update-social-initial-state-migrate-shares-data diff --git a/projects/js-packages/publicize-components/changelog/update-social-initial-state-migrate-shares-data b/projects/js-packages/publicize-components/changelog/update-social-initial-state-migrate-shares-data new file mode 100644 index 0000000000000..40880a44a4eaa --- /dev/null +++ b/projects/js-packages/publicize-components/changelog/update-social-initial-state-migrate-shares-data @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Social: Migrated shares data to the new script data diff --git a/projects/js-packages/publicize-components/index.ts b/projects/js-packages/publicize-components/index.ts index ae4ab198d4d45..f3764bec1f7a4 100644 --- a/projects/js-packages/publicize-components/index.ts +++ b/projects/js-packages/publicize-components/index.ts @@ -35,3 +35,4 @@ export * from './src/hooks/use-saving-post'; export * from './src/hooks/use-post-meta'; export * from './src/components/share-buttons'; export * from './src/components/manage-connections-modal'; +export * from './src/utils/shares-data'; diff --git a/projects/js-packages/publicize-components/src/social-store/reducer/index.js b/projects/js-packages/publicize-components/src/social-store/reducer/index.js index 6bb4ca08a345b..fa4027af48c30 100644 --- a/projects/js-packages/publicize-components/src/social-store/reducer/index.js +++ b/projects/js-packages/publicize-components/src/social-store/reducer/index.js @@ -1,12 +1,10 @@ import { combineReducers } from '@wordpress/data'; import connectionData from './connection-data'; import jetpackSettings from './jetpack-settings'; -import sharesData from './shares-data'; import siteData from './site-data'; import socialImageGeneratorSettings from './social-image-generator-settings'; const reducer = combineReducers( { - sharesData, siteData, connectionData, jetpackSettings, diff --git a/projects/js-packages/publicize-components/src/social-store/reducer/shares-data.js b/projects/js-packages/publicize-components/src/social-store/reducer/shares-data.js deleted file mode 100644 index ced3f29eef446..0000000000000 --- a/projects/js-packages/publicize-components/src/social-store/reducer/shares-data.js +++ /dev/null @@ -1,5 +0,0 @@ -const sharesData = ( state = {} ) => { - return state; -}; - -export default sharesData; diff --git a/projects/js-packages/publicize-components/src/social-store/selectors/index.js b/projects/js-packages/publicize-components/src/social-store/selectors/index.js index 00b33e2c69533..e2ce7f00223c6 100644 --- a/projects/js-packages/publicize-components/src/social-store/selectors/index.js +++ b/projects/js-packages/publicize-components/src/social-store/selectors/index.js @@ -1,6 +1,5 @@ import * as connectionDataSelectors from './connection-data'; import jetpackSettingSelectors from './jetpack-settings'; -import * as sharesData from './shares-data'; import siteDataSelectors from './site-data'; import socialImageGeneratorSettingsSelectors from './social-image-generator-settings'; @@ -8,7 +7,6 @@ const selectors = { ...siteDataSelectors, ...connectionDataSelectors, ...jetpackSettingSelectors, - ...sharesData, ...socialImageGeneratorSettingsSelectors, userConnectionUrl: state => state.userConnectionUrl, useAdminUiV1: state => state.useAdminUiV1, diff --git a/projects/js-packages/publicize-components/src/social-store/selectors/shares-data.ts b/projects/js-packages/publicize-components/src/social-store/selectors/shares-data.ts deleted file mode 100644 index deb1d4194e4eb..0000000000000 --- a/projects/js-packages/publicize-components/src/social-store/selectors/shares-data.ts +++ /dev/null @@ -1,47 +0,0 @@ -import { SocialStoreState } from '../types'; - -/** - * Returns the total number of shares already used. - * - * @param {SocialStoreState} state - Global state tree - * - * @return {number} Total number of shares used - */ -export function getSharesUsedCount( state: SocialStoreState ) { - return state.sharesData?.publicized_count ?? 0; -} - -/** - * Returns the number of shares scheduled. - * - * @param {SocialStoreState} state - Global state tree - * - * @return {number} Number of shares scheduled - */ -export function getScheduledSharesCount( state: SocialStoreState ) { - return state.sharesData?.to_be_publicized_count ?? 0; -} - -/** - * Returns the total number of shares used and scheduled. - * - * @param {SocialStoreState} state - Global state tree - * - * @return {number} Total number of shares used and scheduled - */ -export function getTotalSharesCount( state: SocialStoreState ) { - const count = getSharesUsedCount( state ) + getScheduledSharesCount( state ); - - return Math.max( count, 0 ); -} - -/** - * Number of posts shared this month - * - * @param {SocialStoreState} state - Global state tree - * - * @return {number} Number of posts shared this month - */ -export function getSharedPostsCount( state: SocialStoreState ) { - return state.sharesData?.shared_posts_count ?? 0; -} diff --git a/projects/js-packages/publicize-components/src/social-store/selectors/test/shares-data.test.js b/projects/js-packages/publicize-components/src/social-store/selectors/test/shares-data.test.js deleted file mode 100644 index 603bdaec779ce..0000000000000 --- a/projects/js-packages/publicize-components/src/social-store/selectors/test/shares-data.test.js +++ /dev/null @@ -1,73 +0,0 @@ -import { - getScheduledSharesCount, - getSharedPostsCount, - getSharesUsedCount, - getTotalSharesCount, -} from '../shares-data'; - -describe( 'Social store selectors: sharesData', () => { - describe( 'getSharesUsedCount', () => { - it( 'should return the default value when no data', () => { - expect( getSharesUsedCount( {} ) ).toBe( 0 ); - expect( getSharesUsedCount( { sharesData: {} } ) ).toBe( 0 ); - } ); - - it( 'should return the value from state', () => { - expect( getSharesUsedCount( { sharesData: { publicized_count: 100 } } ) ).toBe( 100 ); - expect( getSharesUsedCount( { sharesData: { publicized_count: 0 } } ) ).toBe( 0 ); - } ); - } ); - - describe( 'getScheduledSharesCount', () => { - it( 'should return the default value when no data', () => { - expect( getScheduledSharesCount( {} ) ).toBe( 0 ); - expect( getScheduledSharesCount( { sharesData: {} } ) ).toBe( 0 ); - } ); - - it( 'should return the value from state', () => { - expect( getScheduledSharesCount( { sharesData: { to_be_publicized_count: 100 } } ) ).toBe( - 100 - ); - expect( getScheduledSharesCount( { sharesData: { to_be_publicized_count: 0 } } ) ).toBe( 0 ); - } ); - } ); - - describe( 'getTotalSharesCount', () => { - it( 'should return the default value when no data', () => { - expect( getTotalSharesCount( {} ) ).toBe( 0 ); - expect( getTotalSharesCount( { sharesData: {} } ) ).toBe( 0 ); - } ); - - it( 'should return the value from state', () => { - const cases = [ - [ [ 100, 100 ], 200 ], - [ [ 0, 0 ], 0 ], - [ [ 100, 0 ], 100 ], - [ [ 0, 100 ], 100 ], - ]; - - for ( const [ [ publicized_count, to_be_publicized_count ], result ] of cases ) { - expect( - getTotalSharesCount( { - sharesData: { - to_be_publicized_count, - publicized_count, - }, - } ) - ).toBe( result ); - } - } ); - } ); - - describe( 'getSharedPostsCount', () => { - it( 'should return the default value when no data', () => { - expect( getSharedPostsCount( {} ) ).toBe( 0 ); - expect( getSharedPostsCount( { sharesData: {} } ) ).toBe( 0 ); - } ); - - it( 'should return the value from state', () => { - expect( getSharedPostsCount( { sharesData: { shared_posts_count: 100 } } ) ).toBe( 100 ); - expect( getSharedPostsCount( { sharesData: { shared_posts_count: 0 } } ) ).toBe( 0 ); - } ); - } ); -} ); diff --git a/projects/js-packages/publicize-components/src/social-store/types.ts b/projects/js-packages/publicize-components/src/social-store/types.ts index d51b0ae8b88e5..1c3c235fac366 100644 --- a/projects/js-packages/publicize-components/src/social-store/types.ts +++ b/projects/js-packages/publicize-components/src/social-store/types.ts @@ -1,9 +1,3 @@ -export type SharesData = { - to_be_publicized_count: number; - publicized_count: number; - shared_posts_count: number; -}; - export type ConnectionStatus = 'ok' | 'broken'; export type Connection = { @@ -40,8 +34,6 @@ export type JetpackSettings = { // TODO we should have a consistent structure across all the pages - editor, dashboard, admin page etc. export type SocialStoreState = { - connectionData: ConnectionData; - sharesData: SharesData; // on post editor hasPaidPlan?: boolean; // on Jetack Social admin page diff --git a/projects/js-packages/publicize-components/src/types/types.ts b/projects/js-packages/publicize-components/src/types/types.ts index 4134cea695179..58c8fe8f50183 100644 --- a/projects/js-packages/publicize-components/src/types/types.ts +++ b/projects/js-packages/publicize-components/src/types/types.ts @@ -1,3 +1,9 @@ +export type SharesData = { + to_be_publicized_count: number; + publicized_count: number; + shared_posts_count: number; +}; + export interface FeatureFlags { useAdminUiV1: boolean; } @@ -22,6 +28,7 @@ export interface SocialScriptData { is_publicize_enabled: boolean; feature_flags: FeatureFlags; supported_services: Array< ConnectionService >; + shares_data: SharesData; } type JetpackSettingsSelectors = { @@ -42,11 +49,6 @@ type ConnectionDataSelectors = { hasConnections: () => boolean; }; -type SharesDataSelectors = { - getSharesCount: () => number; - getPostsCount: () => number; -}; - type SiteDataSelectors = { getSiteData: () => Array< object >; getSiteTitle: () => string; @@ -73,6 +75,5 @@ type SocialImageGeneratorSettingsSelectors = { */ export type SocialStoreSelectors = JetpackSettingsSelectors & ConnectionDataSelectors & - SharesDataSelectors & SiteDataSelectors & SocialImageGeneratorSettingsSelectors; diff --git a/projects/js-packages/publicize-components/src/utils/shares-data.ts b/projects/js-packages/publicize-components/src/utils/shares-data.ts new file mode 100644 index 0000000000000..9dcafa007676a --- /dev/null +++ b/projects/js-packages/publicize-components/src/utils/shares-data.ts @@ -0,0 +1,47 @@ +import { getSocialScriptData } from './script-data'; + +/** + * Returns the shares data. + * + * @return {import('../types/types').SharesData} Shares data + */ +export function getSharesData() { + return getSocialScriptData().shares_data; +} +/** + * Returns the total number of shares already used. + * + * @return {number} Total number of shares used + */ +export function getSharesUsedCount() { + return getSharesData().publicized_count ?? 0; +} + +/** + * Returns the number of shares scheduled. + * + * @return {number} Number of shares scheduled + */ +export function getScheduledSharesCount() { + return getSharesData().to_be_publicized_count ?? 0; +} + +/** + * Returns the total number of shares used and scheduled. + * + * @return {number} Total number of shares used and scheduled + */ +export function getTotalSharesCount() { + const count = getSharesUsedCount() + getScheduledSharesCount(); + + return Math.max( count, 0 ); +} + +/** + * Number of posts shared this month + * + * @return {number} Number of posts shared this month + */ +export function getSharedPostsCount() { + return getSharesData().shared_posts_count ?? 0; +} diff --git a/projects/packages/publicize/changelog/update-social-initial-state-migrate-shares-data b/projects/packages/publicize/changelog/update-social-initial-state-migrate-shares-data new file mode 100644 index 0000000000000..40880a44a4eaa --- /dev/null +++ b/projects/packages/publicize/changelog/update-social-initial-state-migrate-shares-data @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Social: Migrated shares data to the new script data diff --git a/projects/packages/publicize/src/class-publicize-script-data.php b/projects/packages/publicize/src/class-publicize-script-data.php index ba9d6631e41cb..96f4d3d4934b0 100644 --- a/projects/packages/publicize/src/class-publicize-script-data.php +++ b/projects/packages/publicize/src/class-publicize-script-data.php @@ -12,6 +12,7 @@ use Automattic\Jetpack\Current_Plan; use Automattic\Jetpack\Publicize\Publicize_Utils as Utils; use Automattic\Jetpack\Status\Host; +use Jetpack_Options; /** * Publicize_Script_Data class. @@ -84,6 +85,7 @@ public static function get_admin_script_data() { 'is_publicize_enabled' => Utils::is_publicize_active(), 'feature_flags' => self::get_feature_flags(), 'supported_services' => array(), + 'shares_data' => array(), ); if ( ! Utils::is_publicize_active() ) { @@ -102,10 +104,10 @@ public static function get_admin_script_data() { array( 'api_paths' => self::get_api_paths(), 'supported_services' => self::get_supported_services(), + 'shares_data' => self::get_shares_data(), /** * 'store' => self::get_store_script_data(), * 'urls' => self::get_urls(), - * 'shares_data' => self::get_shares_data(), */ ) ); @@ -153,6 +155,15 @@ public static function has_feature_flag( $feature ): bool { return Current_Plan::supports( 'social-' . $feature ); } + /** + * Get the shares data. + * + * @return ?array + */ + public static function get_shares_data() { + return self::publicize()->get_publicize_shares_info( Jetpack_Options::get_option( 'id' ) ); + } + /** * Get the list of supported Publicize services. * diff --git a/projects/plugins/social/changelog/update-social-initial-state-migrate-shares-data b/projects/plugins/social/changelog/update-social-initial-state-migrate-shares-data new file mode 100644 index 0000000000000..40880a44a4eaa --- /dev/null +++ b/projects/plugins/social/changelog/update-social-initial-state-migrate-shares-data @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Social: Migrated shares data to the new script data diff --git a/projects/plugins/social/src/js/components/header/index.js b/projects/plugins/social/src/js/components/header/index.js index 8d5678ab91821..d25b3697b7aa3 100644 --- a/projects/plugins/social/src/js/components/header/index.js +++ b/projects/plugins/social/src/js/components/header/index.js @@ -7,7 +7,11 @@ import { getUserLocale, } from '@automattic/jetpack-components'; import { ConnectionError, useConnectionErrorNotice } from '@automattic/jetpack-connection'; -import { store as socialStore } from '@automattic/jetpack-publicize-components'; +import { + store as socialStore, + getTotalSharesCount, + getSharedPostsCount, +} from '@automattic/jetpack-publicize-components'; import { getScriptData } from '@automattic/jetpack-script-data'; import { useDispatch, useSelect } from '@wordpress/data'; import { __ } from '@wordpress/i18n'; @@ -18,12 +22,11 @@ import styles from './styles.module.scss'; const Header = () => { const connectionData = window.jetpackSocialInitialState.connectionData ?? {}; const { + // TODO - Replace some of these with data from initial state connectionsAdminUrl, hasConnections, isModuleEnabled, newPostUrl, - postsCount, - totalShareCount, } = useSelect( select => { const store = select( socialStore ); return { @@ -31,8 +34,6 @@ const Header = () => { hasConnections: store.getConnections().length > 0, isModuleEnabled: store.isModuleEnabled(), newPostUrl: `${ store.getAdminUrl() }post-new.php`, - postsCount: store.getSharedPostsCount(), - totalShareCount: store.getTotalSharesCount(), }; } ); // TODO - Replace this with a utility function like `getSocialFeatureFlags` when available @@ -87,14 +88,12 @@ const Header = () => { { icon: , label: __( 'Total shares past 30 days', 'jetpack-social' ), - loading: null === totalShareCount, - value: formatter.format( totalShareCount ), + value: formatter.format( getTotalSharesCount() ), }, { icon: , label: __( 'Posted this month', 'jetpack-social' ), - loading: null === postsCount, - value: formatter.format( postsCount ), + value: formatter.format( getSharedPostsCount() ), }, ] } /> diff --git a/projects/plugins/social/src/js/components/types/types.ts b/projects/plugins/social/src/js/components/types/types.ts index a4cc238aae514..fa7aecea67e22 100644 --- a/projects/plugins/social/src/js/components/types/types.ts +++ b/projects/plugins/social/src/js/components/types/types.ts @@ -18,13 +18,6 @@ type ConnectionDataSelectors = { hasConnections: () => boolean; }; -type SharesDataSelectors = { - getSharesCount: () => number; - getPostsCount: () => number; - isShareLimitEnabled: () => boolean; - numberOfSharesRemaining: () => number; -}; - type SiteDataSelectors = { getSiteData: () => Array< object >; getSiteTitle: () => string; @@ -58,7 +51,6 @@ type SocialNotesSettingsSelectors = { */ export type SocialStoreSelectors = JetpackSettingsSelectors & ConnectionDataSelectors & - SharesDataSelectors & SiteDataSelectors & SocialImageGeneratorSettingsSelectors & SocialNotesSettingsSelectors;