diff --git a/projects/js-packages/publicize-components/changelog/update-direct-authors-to-user-connection b/projects/js-packages/publicize-components/changelog/update-direct-authors-to-user-connection new file mode 100644 index 0000000000000..1b561bc7a665e --- /dev/null +++ b/projects/js-packages/publicize-components/changelog/update-direct-authors-to-user-connection @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Update the Social sidebar share post panel to direct non-admin authors to user connection if there is no user connection. diff --git a/projects/js-packages/publicize-components/package.json b/projects/js-packages/publicize-components/package.json index 1185121f18a8a..d6e0b430762f3 100644 --- a/projects/js-packages/publicize-components/package.json +++ b/projects/js-packages/publicize-components/package.json @@ -1,7 +1,7 @@ { "private": true, "name": "@automattic/jetpack-publicize-components", - "version": "0.49.2", + "version": "0.49.3-alpha", "description": "A library of JS components required by the Publicize editor plugin", "homepage": "https://github.com/Automattic/jetpack/tree/HEAD/projects/js-packages/publicize-components/#readme", "bugs": { diff --git a/projects/js-packages/publicize-components/src/components/form/connections-list.tsx b/projects/js-packages/publicize-components/src/components/form/connections-list.tsx index 404f3d72c1e2f..0620cac7cbdcb 100644 --- a/projects/js-packages/publicize-components/src/components/form/connections-list.tsx +++ b/projects/js-packages/publicize-components/src/components/form/connections-list.tsx @@ -1,3 +1,4 @@ +import { useConnection } from '@automattic/jetpack-connection'; import useSocialMediaConnections from '../../hooks/use-social-media-connections'; import PublicizeConnection from '../connection'; import PublicizeSettingsButton from '../settings-button'; @@ -9,6 +10,8 @@ export const ConnectionsList: React.FC = () => { const { canBeTurnedOn, shouldBeDisabled } = useConnectionState(); + const { isUserConnected } = useConnection(); + return ( ); }; diff --git a/projects/js-packages/publicize-components/src/components/form/index.tsx b/projects/js-packages/publicize-components/src/components/form/index.tsx index 04a723df4e5b6..ec45fac260dc8 100644 --- a/projects/js-packages/publicize-components/src/components/form/index.tsx +++ b/projects/js-packages/publicize-components/src/components/form/index.tsx @@ -6,6 +6,7 @@ * sharing message. */ +import { useConnection } from '@automattic/jetpack-connection'; import { Disabled, ExternalLink, PanelRow } from '@wordpress/components'; import { useSelect } from '@wordpress/data'; import { Fragment, useMemo } from '@wordpress/element'; @@ -45,6 +46,8 @@ export default function PublicizeForm() { const { isPublicizeEnabled, isPublicizeDisabledBySitePlan, connectionsAdminUrl } = usePublicizeConfig(); + const useConnectionUrl = useSelect( select => select( socialStore ).userConnectionUrl(), [] ); + const { numberOfSharesRemaining } = useSelect( select => { return { showShareLimits: select( socialStore ).showShareLimits(), @@ -90,6 +93,8 @@ export default function PublicizeForm() { refreshConnections(); + const { isUserConnected } = useConnection(); + return ( { hasConnections ? ( @@ -113,13 +118,44 @@ export default function PublicizeForm() { /> ) ) } - ) : ( - - - { __( 'Connect an account', 'jetpack' ) } - - - ) } + ) : null } + + { + // Use IIFE make it more readable and avoid nested ternary operators. + ( () => { + if ( ! isUserConnected ) { + return ( +

+ { __( + 'You must connect your WordPress.com account to be able to add social media connections.', + 'jetpack' + ) } +   + { __( 'Connect now', 'jetpack' ) } +

+ ); + } + + if ( ! hasConnections ) { + return ( +

+ { __( + 'Sharing is disabled because there are no social media accounts connected.', + 'jetpack' + ) } +
+ + { __( 'Connect an account', 'jetpack' ) } + +

+ ); + } + + return null; + } )() + } + + { ! isPublicizeDisabledBySitePlan && ( { isPublicizeEnabled && hasEnabledConnections && } diff --git a/projects/js-packages/publicize-components/src/components/panel/index.jsx b/projects/js-packages/publicize-components/src/components/panel/index.jsx index 0c22ad4df2ea5..a9c6d1ec7a2de 100644 --- a/projects/js-packages/publicize-components/src/components/panel/index.jsx +++ b/projects/js-packages/publicize-components/src/components/panel/index.jsx @@ -59,7 +59,7 @@ const PublicizePanel = ( { prePublish, children } ) => { ) } onChange={ togglePublicizeFeature } - checked={ isPublicizeEnabled } + checked={ isPublicizeEnabled && hasConnections } disabled={ ! hasConnections } /> ) } 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 1b0c803357c9d..e92dee882c9d2 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 @@ -14,6 +14,7 @@ const reducer = combineReducers( { socialImageGeneratorSettings, autoConversionSettings, hasPaidPlan: ( state = false ) => state, + userConnectionUrl: ( state = '' ) => state, } ); export default reducer; 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 f5dfd2193546b..b95e8fa8bbfd7 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 @@ -12,6 +12,7 @@ const selectors = { ...sharesData, ...socialImageGeneratorSettingsSelectors, ...autoConversionSettingsSelectors, + userConnectionUrl: state => state.userConnectionUrl, }; export default selectors; diff --git a/projects/plugins/jetpack/changelog/update-direct-authors-to-user-connection b/projects/plugins/jetpack/changelog/update-direct-authors-to-user-connection new file mode 100644 index 0000000000000..f77676c785ab6 --- /dev/null +++ b/projects/plugins/jetpack/changelog/update-direct-authors-to-user-connection @@ -0,0 +1,4 @@ +Significance: patch +Type: other + +Add the userConnectionUrl to initial state to use in Social sidebar diff --git a/projects/plugins/jetpack/class.jetpack-gutenberg.php b/projects/plugins/jetpack/class.jetpack-gutenberg.php index a3fd261432d22..b06c1426eadbd 100644 --- a/projects/plugins/jetpack/class.jetpack-gutenberg.php +++ b/projects/plugins/jetpack/class.jetpack-gutenberg.php @@ -757,6 +757,7 @@ public static function enqueue_block_editor_assets() { 'supportedAdditionalConnections' => $publicize->get_supported_additional_connections(), 'autoConversionSettings' => $settings['autoConversionSettings'], 'jetpackSharingSettingsUrl' => esc_url_raw( admin_url( 'admin.php?page=jetpack#/sharing' ) ), + 'userConnectionUrl' => esc_url_raw( admin_url( 'admin.php?page=my-jetpack#/connection' ) ), ); } diff --git a/projects/plugins/social/changelog/update-direct-authors-to-user-connection b/projects/plugins/social/changelog/update-direct-authors-to-user-connection new file mode 100644 index 0000000000000..1b561bc7a665e --- /dev/null +++ b/projects/plugins/social/changelog/update-direct-authors-to-user-connection @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Update the Social sidebar share post panel to direct non-admin authors to user connection if there is no user connection. diff --git a/projects/plugins/social/src/class-jetpack-social.php b/projects/plugins/social/src/class-jetpack-social.php index 6d2fe0e45f0f5..cbd45db7e5c16 100644 --- a/projects/plugins/social/src/class-jetpack-social.php +++ b/projects/plugins/social/src/class-jetpack-social.php @@ -350,6 +350,7 @@ class_exists( 'Jetpack' ) || 'autoConversionSettings' => $settings['autoConversionSettings'], 'dismissedNotices' => Dismissed_Notices::get_dismissed_notices(), 'supportedAdditionalConnections' => $publicize->get_supported_additional_connections(), + 'userConnectionUrl' => esc_url_raw( admin_url( 'admin.php?page=my-jetpack#/connection' ) ), ), ) );