From 91ee294ee584a7a08ed5fef3df2acb1ae0efc40c Mon Sep 17 00:00:00 2001 From: Manzoor Wani Date: Fri, 18 Oct 2024 01:42:01 -0700 Subject: [PATCH] Social | Initial State: Migrate URLs on Social admin page (#39797) * Pass the URLs from backend * Install dependency * Update URLs on Social admin page * Add changelog * Update pnpm-lock.yaml * Clean up --- pnpm-lock.yaml | 3 +++ ...initial-state-migrate-urls-on-social-admin | 4 ++++ .../publicize-components/src/types/types.ts | 5 ++++ .../publicize-components/src/utils/index.js | 1 + ...initial-state-migrate-urls-on-social-admin | 4 ++++ .../src/class-publicize-script-data.php | 22 +++++++++++++++++- ...initial-state-migrate-urls-on-social-admin | 4 ++++ projects/plugins/social/package.json | 1 + .../js/components/admin-page/header/index.jsx | 5 ++-- .../social/src/js/components/header/index.js | 23 ++++++++----------- .../components/social-module-toggle/index.tsx | 10 ++++---- .../components/social-notes-toggle/index.tsx | 6 +++-- .../social/src/js/components/types/types.ts | 1 - 13 files changed, 65 insertions(+), 24 deletions(-) create mode 100644 projects/js-packages/publicize-components/changelog/update-social-initial-state-migrate-urls-on-social-admin create mode 100644 projects/packages/publicize/changelog/update-social-initial-state-migrate-urls-on-social-admin create mode 100644 projects/plugins/social/changelog/update-social-initial-state-migrate-urls-on-social-admin diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 224c12b5751f7..d366a6857df79 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -4324,6 +4324,9 @@ importers: '@automattic/jetpack-publicize-components': specifier: workspace:* version: link:../../js-packages/publicize-components + '@automattic/jetpack-script-data': + specifier: workspace:* + version: link:../../js-packages/script-data '@automattic/jetpack-shared-extension-utils': specifier: workspace:* version: link:../../js-packages/shared-extension-utils diff --git a/projects/js-packages/publicize-components/changelog/update-social-initial-state-migrate-urls-on-social-admin b/projects/js-packages/publicize-components/changelog/update-social-initial-state-migrate-urls-on-social-admin new file mode 100644 index 0000000000000..c23ee0fbdc59a --- /dev/null +++ b/projects/js-packages/publicize-components/changelog/update-social-initial-state-migrate-urls-on-social-admin @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Initial State: Migrated URLs to script data diff --git a/projects/js-packages/publicize-components/src/types/types.ts b/projects/js-packages/publicize-components/src/types/types.ts index 44b6c00c8342e..b2d7cd344ef90 100644 --- a/projects/js-packages/publicize-components/src/types/types.ts +++ b/projects/js-packages/publicize-components/src/types/types.ts @@ -1,3 +1,7 @@ +export interface SocialUrls { + connectionsManagementPage: string; +} + export type SharesData = { to_be_publicized_count: number; publicized_count: number; @@ -31,6 +35,7 @@ export interface SocialScriptData { feature_flags: FeatureFlags; supported_services: Array< ConnectionService >; shares_data: SharesData; + urls: SocialUrls; } type JetpackSettingsSelectors = { diff --git a/projects/js-packages/publicize-components/src/utils/index.js b/projects/js-packages/publicize-components/src/utils/index.js index 65f2dd163c5c5..6e0284f7b9870 100644 --- a/projects/js-packages/publicize-components/src/utils/index.js +++ b/projects/js-packages/publicize-components/src/utils/index.js @@ -2,3 +2,4 @@ export * from './get-share-message-max-length'; export * from './get-supported-additional-connections'; export * from './request-external-access'; export * from './types'; +export * from './script-data'; diff --git a/projects/packages/publicize/changelog/update-social-initial-state-migrate-urls-on-social-admin b/projects/packages/publicize/changelog/update-social-initial-state-migrate-urls-on-social-admin new file mode 100644 index 0000000000000..c23ee0fbdc59a --- /dev/null +++ b/projects/packages/publicize/changelog/update-social-initial-state-migrate-urls-on-social-admin @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Initial State: Migrated URLs to 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 053ad74a938ee..8931878b16ab5 100644 --- a/projects/packages/publicize/src/class-publicize-script-data.php +++ b/projects/packages/publicize/src/class-publicize-script-data.php @@ -86,6 +86,7 @@ public static function get_admin_script_data() { 'feature_flags' => self::get_feature_flags(), 'supported_services' => array(), 'shares_data' => array(), + 'urls' => array(), ); if ( ! Utils::is_publicize_active() ) { @@ -105,9 +106,9 @@ public static function get_admin_script_data() { 'api_paths' => self::get_api_paths(), 'supported_services' => self::get_supported_services(), 'shares_data' => self::get_shares_data(), + 'urls' => self::get_urls(), /** * 'store' => self::get_store_script_data(), - * 'urls' => self::get_urls(), */ ) ); @@ -216,4 +217,23 @@ public static function get_api_paths() { 'resharePost' => '/jetpack/v4/publicize/{postId}', ); } + + /** + * Get the URLs. + * + * @return array + */ + public static function get_urls() { + + $urls = array( + 'connectionsManagementPage' => self::publicize()->publicize_connections_url( + 'jetpack-social-connections-admin-page' + ), + ); + + // Escape the URLs. + array_walk( $urls, 'esc_url_raw' ); + + return $urls; + } } diff --git a/projects/plugins/social/changelog/update-social-initial-state-migrate-urls-on-social-admin b/projects/plugins/social/changelog/update-social-initial-state-migrate-urls-on-social-admin new file mode 100644 index 0000000000000..c23ee0fbdc59a --- /dev/null +++ b/projects/plugins/social/changelog/update-social-initial-state-migrate-urls-on-social-admin @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Initial State: Migrated URLs to script data diff --git a/projects/plugins/social/package.json b/projects/plugins/social/package.json index 2684baf5c991f..f5c3bd624b4d2 100644 --- a/projects/plugins/social/package.json +++ b/projects/plugins/social/package.json @@ -30,6 +30,7 @@ "@automattic/jetpack-components": "workspace:*", "@automattic/jetpack-connection": "workspace:*", "@automattic/jetpack-publicize-components": "workspace:*", + "@automattic/jetpack-script-data": "workspace:*", "@automattic/jetpack-shared-extension-utils": "workspace:*", "@wordpress/api-fetch": "7.9.0", "@wordpress/components": "28.9.0", diff --git a/projects/plugins/social/src/js/components/admin-page/header/index.jsx b/projects/plugins/social/src/js/components/admin-page/header/index.jsx index 0a2eb23d3509a..cc6aad10da338 100644 --- a/projects/plugins/social/src/js/components/admin-page/header/index.jsx +++ b/projects/plugins/social/src/js/components/admin-page/header/index.jsx @@ -1,4 +1,5 @@ import { SOCIAL_STORE_ID } from '@automattic/jetpack-publicize-components'; +import { getMyJetpackUrl } from '@automattic/jetpack-script-data'; import { useSelect } from '@wordpress/data'; import { createInterpolateElement } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; @@ -6,14 +7,14 @@ import Logo from './../../logo'; import styles from './styles.module.scss'; const AdminPageHeader = () => { - const { showPricingPage, activateLicenseUrl } = useSelect( select => { + const { showPricingPage } = useSelect( select => { const store = select( SOCIAL_STORE_ID ); return { showPricingPage: store.showPricingPage(), - activateLicenseUrl: `${ store.getAdminUrl() }admin.php?page=my-jetpack#/add-license`, }; } ); + const activateLicenseUrl = getMyJetpackUrl( '#/add-license' ); return (
diff --git a/projects/plugins/social/src/js/components/header/index.js b/projects/plugins/social/src/js/components/header/index.js index 868c0756b61fe..742c758aa957f 100644 --- a/projects/plugins/social/src/js/components/header/index.js +++ b/projects/plugins/social/src/js/components/header/index.js @@ -13,6 +13,7 @@ import { getSharedPostsCount, store as socialStore, } from '@automattic/jetpack-publicize-components'; +import { getAdminUrl } from '@automattic/jetpack-script-data'; import { useDispatch, useSelect } from '@wordpress/data'; import { __ } from '@wordpress/i18n'; import { Icon, postList } from '@wordpress/icons'; @@ -20,24 +21,17 @@ import StatCards from '../stat-cards'; 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, - } = useSelect( select => { + const { hasConnections, isModuleEnabled } = useSelect( select => { const store = select( socialStore ); return { - connectionsAdminUrl: connectionData.adminUrl, hasConnections: store.getConnections().length > 0, isModuleEnabled: store.isModuleEnabled(), - newPostUrl: `${ store.getAdminUrl() }post-new.php`, }; } ); - const { useAdminUiV1 } = getSocialScriptData().feature_flags; + const { urls, feature_flags } = getSocialScriptData(); + + const useAdminUiV1 = feature_flags.useAdminUiV1; const { hasConnectionError } = useConnectionErrorNotice(); @@ -71,13 +65,16 @@ const Header = () => { { __( 'Connect accounts', 'jetpack-social' ) } ) : ( - ) } ) } -
diff --git a/projects/plugins/social/src/js/components/social-module-toggle/index.tsx b/projects/plugins/social/src/js/components/social-module-toggle/index.tsx index bb7c0ef23dbb9..77345ba97de14 100644 --- a/projects/plugins/social/src/js/components/social-module-toggle/index.tsx +++ b/projects/plugins/social/src/js/components/social-module-toggle/index.tsx @@ -22,7 +22,6 @@ import styles from './styles.module.scss'; const SocialModuleToggle: React.FC = () => { const { // TODO - replace some of these with values from initial state - connectionsAdminUrl, isModuleEnabled, isUpdating, siteSuffix, @@ -33,14 +32,15 @@ const SocialModuleToggle: React.FC = () => { return { isModuleEnabled: store.isModuleEnabled(), isUpdating: store.isUpdatingJetpackSettings(), - connectionsAdminUrl: store.getConnectionsAdminUrl(), siteSuffix: store.getSiteSuffix(), blogID: store.getBlogID(), hasPaidFeatures: store.hasPaidFeatures(), }; }, [] ); - const { useAdminUiV1 } = getSocialScriptData().feature_flags; + const { urls, feature_flags } = getSocialScriptData(); + + const useAdminUiV1 = feature_flags.useAdminUiV1; const updateOptions = useDispatch( SOCIAL_STORE_ID ).updateJetpackSettings; @@ -65,13 +65,13 @@ const SocialModuleToggle: React.FC = () => { ) : null; } - return connectionsAdminUrl ? ( + return urls.connectionsManagementPage ? (