From fd7761aeb54564c2fcc0b537cd00c4858fc4c455 Mon Sep 17 00:00:00 2001 From: Garth Gutenberg Date: Thu, 2 Mar 2023 10:58:47 -0500 Subject: [PATCH 1/8] Toggle Distributor controls when post status changes --- assets/css/push.scss | 4 ++++ assets/js/gutenberg-plugin.js | 6 ++++++ includes/push-ui.php | 4 ---- package.json | 1 + 4 files changed, 11 insertions(+), 4 deletions(-) diff --git a/assets/css/push.scss b/assets/css/push.scss index de050c5cb..96d3f0216 100644 --- a/assets/css/push.scss +++ b/assets/css/push.scss @@ -16,6 +16,10 @@ $mediaSmallScreen : "min-width: 480px"; $mediaMediumScreen : "min-width: 768px"; $mediaGutenbergSmallScreen : "max-width: 782px"; +#wp-admin-bar-distributor.hide { + display: none; +} + #distributor-push-wrapper, #wpadminbar #wp-admin-bar-distributor-placeholder > .ab-item { display: none; diff --git a/assets/js/gutenberg-plugin.js b/assets/js/gutenberg-plugin.js index dd5255f29..007cdb972 100644 --- a/assets/js/gutenberg-plugin.js +++ b/assets/js/gutenberg-plugin.js @@ -179,11 +179,16 @@ const DistributorPlugin = () => { return null; } + const distributorTopMenu = document.querySelector( + '#wp-admin-bar-distributor' + ); + // If we are on a non-supported post status, change what we show if ( dtGutenberg.supportedPostStati && ! dtGutenberg.supportedPostStati.includes( postStatus ) ) { + distributorTopMenu.classList.add( 'hide' ); return ( { ); } + distributorTopMenu.classList.remove( 'hide' ); return ( post_status, \Distributor\Utils\distributable_post_statuses(), true ) ) { - return false; - } - if ( ! in_array( get_post_type(), $distributable_post_types, true ) || ( ! empty( $_GET['post_type'] ) && 'dt_ext_connection' === $_GET['post_type'] ) ) { // @codingStandardsIgnoreLine Nonce not required return false; } diff --git a/package.json b/package.json index eb17ff335..4f421833d 100644 --- a/package.json +++ b/package.json @@ -37,6 +37,7 @@ }, "scripts": { "build": "wp-scripts build", + "watch": "wp-scripts build --watch", "build:docs": "rm -rf docs-built && jsdoc -c hookdoc-conf.json distributor.php includes", "check-engines": "wp-scripts check-engines", "check-licenses": "wp-scripts check-licenses", From f384c5dfeb2a3501358d4d16259809e95b14f8d4 Mon Sep 17 00:00:00 2001 From: Garth Gutenberg Date: Fri, 3 Mar 2023 09:59:37 -0500 Subject: [PATCH 2/8] Address PR comments --- assets/js/gutenberg-plugin.js | 4 ++-- includes/push-ui.php | 7 ++++--- 2 files changed, 6 insertions(+), 5 deletions(-) diff --git a/assets/js/gutenberg-plugin.js b/assets/js/gutenberg-plugin.js index 007cdb972..68217344d 100644 --- a/assets/js/gutenberg-plugin.js +++ b/assets/js/gutenberg-plugin.js @@ -188,7 +188,7 @@ const DistributorPlugin = () => { dtGutenberg.supportedPostStati && ! dtGutenberg.supportedPostStati.includes( postStatus ) ) { - distributorTopMenu.classList.add( 'hide' ); + distributorTopMenu?.classList.add( 'hide' ); return ( { ); } - distributorTopMenu.classList.remove( 'hide' ); + distributorTopMenu?.classList.remove( 'hide' ); return ( Date: Fri, 3 Mar 2023 10:41:25 -0500 Subject: [PATCH 3/8] Update post title in top menu when it changes --- assets/js/gutenberg-plugin.js | 7 +++++++ assets/js/push.js | 11 +++++++++-- templates/show-connections-amp.php | 2 +- templates/show-connections.php | 2 +- 4 files changed, 18 insertions(+), 4 deletions(-) diff --git a/assets/js/gutenberg-plugin.js b/assets/js/gutenberg-plugin.js index 68217344d..b12bec298 100644 --- a/assets/js/gutenberg-plugin.js +++ b/assets/js/gutenberg-plugin.js @@ -183,6 +183,13 @@ const DistributorPlugin = () => { '#wp-admin-bar-distributor' ); + // eslint-disable-next-line no-shadow, react-hooks/rules-of-hooks -- permission checks are needed. + const post = useSelect( ( select ) => + select( 'core/editor' ).getCurrentPost() + ); + // Make the post title available to the top menu. + dtGutenberg.postTitle = post.title; + // If we are on a non-supported post status, change what we show if ( dtGutenberg.supportedPostStati && diff --git a/assets/js/push.js b/assets/js/push.js index 3ac74476c..97581adc5 100755 --- a/assets/js/push.js +++ b/assets/js/push.js @@ -4,7 +4,7 @@ import jQuery from 'jquery'; import _ from 'underscore'; import Mustache from 'mustache'; -const { document, dt } = window; +const { document, dt, dtGutenberg } = window; let selectedConnections = {}, searchString = ''; @@ -344,9 +344,14 @@ jQuery( window ).on( 'load', () => { // Determine if we need to hide the admin bar maybeHideAdminBar(); - if ( distributorPushWrapper.classList.contains( 'loaded' ) ) { + // If the post title has changed, we need to reload the template. + if ( + distributorPushWrapper.classList.contains( 'loaded' ) && + dtGutenberg.postTitle === dtGutenberg.previousPostTitle + ) { return; } + dtGutenberg.previousPostTitle = dtGutenberg.postTitle; distributorPushWrapper.classList.remove( 'message-error' ); distributorPushWrapper.classList.add( 'loaded' ); @@ -394,6 +399,7 @@ jQuery( window ).on( 'load', () => { connections: mustacheData.connections, foundConnections: mustacheData.connections.length, showSearch: 5 < mustacheData.connections.length, + postTitle: dtGutenberg.postTitle, } ); @@ -401,6 +407,7 @@ jQuery( window ).on( 'load', () => { } else { distributorPushWrapper.innerHTML = template( { connections: dtConnections, + postTitle: dtGutenberg.postTitle, } ); } diff --git a/templates/show-connections-amp.php b/templates/show-connections-amp.php index 2306d6701..98cdda683 100644 --- a/templates/show-connections-amp.php +++ b/templates/show-connections-amp.php @@ -11,7 +11,7 @@
{{#foundConnections}} -

ID ) ) ); ?>

+

diff --git a/templates/show-connections.php b/templates/show-connections.php index 97a2db556..af4b81150 100644 --- a/templates/show-connections.php +++ b/templates/show-connections.php @@ -11,7 +11,7 @@
<# if ( ! _.isEmpty( connections ) ) { #> -

ID ) ) ); ?>

+

From 33679559cece65e2f0969d62318f72c2ef3fd104 Mon Sep 17 00:00:00 2001 From: Peter Wilson <519727+peterwilsoncc@users.noreply.github.com> Date: Mon, 6 Mar 2023 11:41:52 +1100 Subject: [PATCH 4/8] Include the original post title when loading pages. --- includes/push-ui.php | 1 + 1 file changed, 1 insertion(+) diff --git a/includes/push-ui.php b/includes/push-ui.php index be67aa32b..7752cb202 100644 --- a/includes/push-ui.php +++ b/includes/push-ui.php @@ -418,6 +418,7 @@ function enqueue_scripts( $hook ) { 'nonce' => wp_create_nonce( 'dt-push' ), 'loadConnectionsNonce' => wp_create_nonce( 'dt-load-connections' ), 'postId' => (int) get_the_ID(), + 'postTitle' => get_the_title(), 'ajaxurl' => esc_url( admin_url( 'admin-ajax.php' ) ), 'messages' => array( 'ajax_error' => __( 'Ajax error:', 'distributor' ), From f538b9d1c1f07e5ed05546dabcdcbd5caca59002 Mon Sep 17 00:00:00 2001 From: Garth Gutenberg Date: Mon, 6 Mar 2023 17:36:36 -0500 Subject: [PATCH 5/8] Address PR comments --- assets/js/gutenberg-plugin.js | 2 +- assets/js/push.js | 10 +++++----- includes/push-ui.php | 4 ++++ package.json | 1 - 4 files changed, 10 insertions(+), 7 deletions(-) diff --git a/assets/js/gutenberg-plugin.js b/assets/js/gutenberg-plugin.js index b12bec298..1bf16792d 100644 --- a/assets/js/gutenberg-plugin.js +++ b/assets/js/gutenberg-plugin.js @@ -188,7 +188,7 @@ const DistributorPlugin = () => { select( 'core/editor' ).getCurrentPost() ); // Make the post title available to the top menu. - dtGutenberg.postTitle = post.title; + window.dt.postTitle = post.title; // If we are on a non-supported post status, change what we show if ( diff --git a/assets/js/push.js b/assets/js/push.js index 97581adc5..d6c16aebd 100755 --- a/assets/js/push.js +++ b/assets/js/push.js @@ -4,7 +4,7 @@ import jQuery from 'jquery'; import _ from 'underscore'; import Mustache from 'mustache'; -const { document, dt, dtGutenberg } = window; +const { document, dt } = window; let selectedConnections = {}, searchString = ''; @@ -347,11 +347,11 @@ jQuery( window ).on( 'load', () => { // If the post title has changed, we need to reload the template. if ( distributorPushWrapper.classList.contains( 'loaded' ) && - dtGutenberg.postTitle === dtGutenberg.previousPostTitle + dt.postTitle === dt.previousPostTitle ) { return; } - dtGutenberg.previousPostTitle = dtGutenberg.postTitle; + dt.previousPostTitle = dt.postTitle; distributorPushWrapper.classList.remove( 'message-error' ); distributorPushWrapper.classList.add( 'loaded' ); @@ -399,7 +399,7 @@ jQuery( window ).on( 'load', () => { connections: mustacheData.connections, foundConnections: mustacheData.connections.length, showSearch: 5 < mustacheData.connections.length, - postTitle: dtGutenberg.postTitle, + postTitle: dt.postTitle, } ); @@ -407,7 +407,7 @@ jQuery( window ).on( 'load', () => { } else { distributorPushWrapper.innerHTML = template( { connections: dtConnections, - postTitle: dtGutenberg.postTitle, + postTitle: dt.postTitle, } ); } diff --git a/includes/push-ui.php b/includes/push-ui.php index 7752cb202..1710155e6 100644 --- a/includes/push-ui.php +++ b/includes/push-ui.php @@ -83,6 +83,10 @@ function syndicatable() { return; } + if ( ! use_block_editor_for_post( $post ) && ! in_array( $post->post_status, \Distributor\Utils\distributable_post_statuses(), true ) ) { + return false; + } + $distributable_post_types = array_diff( $distributable_post_types, array( 'dt_ext_connection' ) ); if ( ! in_array( get_post_type(), $distributable_post_types, true ) ) { return false; diff --git a/package.json b/package.json index 4f421833d..eb17ff335 100644 --- a/package.json +++ b/package.json @@ -37,7 +37,6 @@ }, "scripts": { "build": "wp-scripts build", - "watch": "wp-scripts build --watch", "build:docs": "rm -rf docs-built && jsdoc -c hookdoc-conf.json distributor.php includes", "check-engines": "wp-scripts check-engines", "check-licenses": "wp-scripts check-licenses", From e66b2f866076907141c30e28669977fd7acc39e9 Mon Sep 17 00:00:00 2001 From: Garth Gutenberg Date: Tue, 7 Mar 2023 10:41:52 -0500 Subject: [PATCH 6/8] Make dt a dependency of dtGutenberg --- assets/js/gutenberg-plugin.js | 4 ++-- includes/push-ui.php | 1 + includes/syndicated-post-ui.php | 1 + 3 files changed, 4 insertions(+), 2 deletions(-) diff --git a/assets/js/gutenberg-plugin.js b/assets/js/gutenberg-plugin.js index 1bf16792d..6d8306c24 100644 --- a/assets/js/gutenberg-plugin.js +++ b/assets/js/gutenberg-plugin.js @@ -6,7 +6,7 @@ import { PluginDocumentSettingPanel } from '@wordpress/edit-post'; import { __, _n, _x, sprintf } from '@wordpress/i18n'; import { registerPlugin } from '@wordpress/plugins'; -const { document, dtGutenberg, MouseEvent } = window; +const { document, dt, dtGutenberg, MouseEvent } = window; /** * Add ability to show the admin bar, if needed @@ -188,7 +188,7 @@ const DistributorPlugin = () => { select( 'core/editor' ).getCurrentPost() ); // Make the post title available to the top menu. - window.dt.postTitle = post.title; + dt.postTitle = post.title; // If we are on a non-supported post status, change what we show if ( diff --git a/includes/push-ui.php b/includes/push-ui.php index 1710155e6..89c8d7e8b 100644 --- a/includes/push-ui.php +++ b/includes/push-ui.php @@ -83,6 +83,7 @@ function syndicatable() { return; } + // If we're using the classic editor, we need to make sure the post has a distributable status. if ( ! use_block_editor_for_post( $post ) && ! in_array( $post->post_status, \Distributor\Utils\distributable_post_statuses(), true ) ) { return false; } diff --git a/includes/syndicated-post-ui.php b/includes/syndicated-post-ui.php index e970abf56..1f5e2e505 100644 --- a/includes/syndicated-post-ui.php +++ b/includes/syndicated-post-ui.php @@ -644,6 +644,7 @@ function enqueue_gutenberg_edit_scripts() { if ( file_exists( $asset_file ) ) { $asset_data = require $asset_file; } + $asset_data['dependencies'][] = 'dt-push'; wp_enqueue_script( 'dt-gutenberg-syndicated-post', plugins_url( '/dist/js/gutenberg-syndicated-post.min.js', __DIR__ ), $asset_data['dependencies'], $asset_data['version'], true ); wp_set_script_translations( 'dt-gutenberg-syndicated-post', 'distributor', DT_PLUGIN_PATH . 'lang' ); From d9f355a1776c723c67bf6b5341c818fd83243b03 Mon Sep 17 00:00:00 2001 From: Peter Wilson <519727+peterwilsoncc@users.noreply.github.com> Date: Wed, 8 Mar 2023 15:23:56 +1100 Subject: [PATCH 7/8] Add test to ensure the button distributor panel toggles on publish. --- .../e2e/distributor-menu-toggles.test.js | 50 +++++++++++++++++++ 1 file changed, 50 insertions(+) create mode 100644 tests/cypress/e2e/distributor-menu-toggles.test.js diff --git a/tests/cypress/e2e/distributor-menu-toggles.test.js b/tests/cypress/e2e/distributor-menu-toggles.test.js new file mode 100644 index 000000000..355049875 --- /dev/null +++ b/tests/cypress/e2e/distributor-menu-toggles.test.js @@ -0,0 +1,50 @@ +describe( 'Distributor post toggles as expected in block editor', () => { + before( () => { + cy.login(); + } ); + + it( 'Distribution info is hidden when post is not published', () => { + cy.createPost( { + title: 'Test Post', + content: 'Test Content', + status: 'draft', + } ).then( ( post ) => { + cy.openDocumentSettingsPanel( 'Distributor' ); + cy.get( '.distributor-panel > p' ).should( + 'contain.text', + 'Distribution options available once published' + ); + + cy.get( '.editor-post-publish-panel__toggle' ).should( + 'be.enabled' + ); + cy.get( '.editor-post-publish-panel__toggle' ).click(); + cy.intercept( { method: 'POST' }, ( req ) => { + const body = req.body; + if ( body.status === 'publish' ) { + req.alias = 'publishPost'; + } + } ); + cy.get( '.editor-post-publish-button' ).click(); + cy.get( + '.components-snackbar, .components-notice.is-success' + ).should( 'be.visible' ); + cy.wait( '@publishPost' ).then( ( response ) => { + let _a; + cy.wrap( + ( _a = response.response ) === null || _a === void 0 + ? void 0 + : _a.body + ); + } ); + } ); + cy.get( + '.editor-post-publish-panel__header .components-button' + ).click(); + cy.openDocumentSettingsPanel( 'Distributor' ); + cy.get( '.distributor-panel .distributor-toggle button' ).should( + 'contain.text', + 'Distribute post' + ); + } ); +} ); From 90315038f6fdbc169d11c6b67f2a27fee7b061ca Mon Sep 17 00:00:00 2001 From: Peter Wilson <519727+peterwilsoncc@users.noreply.github.com> Date: Wed, 8 Mar 2023 15:29:13 +1100 Subject: [PATCH 8/8] Revert "Add test to ensure the button distributor panel toggles on publish." This reverts commit d9f355a1776c723c67bf6b5341c818fd83243b03. --- .../e2e/distributor-menu-toggles.test.js | 50 ------------------- 1 file changed, 50 deletions(-) delete mode 100644 tests/cypress/e2e/distributor-menu-toggles.test.js diff --git a/tests/cypress/e2e/distributor-menu-toggles.test.js b/tests/cypress/e2e/distributor-menu-toggles.test.js deleted file mode 100644 index 355049875..000000000 --- a/tests/cypress/e2e/distributor-menu-toggles.test.js +++ /dev/null @@ -1,50 +0,0 @@ -describe( 'Distributor post toggles as expected in block editor', () => { - before( () => { - cy.login(); - } ); - - it( 'Distribution info is hidden when post is not published', () => { - cy.createPost( { - title: 'Test Post', - content: 'Test Content', - status: 'draft', - } ).then( ( post ) => { - cy.openDocumentSettingsPanel( 'Distributor' ); - cy.get( '.distributor-panel > p' ).should( - 'contain.text', - 'Distribution options available once published' - ); - - cy.get( '.editor-post-publish-panel__toggle' ).should( - 'be.enabled' - ); - cy.get( '.editor-post-publish-panel__toggle' ).click(); - cy.intercept( { method: 'POST' }, ( req ) => { - const body = req.body; - if ( body.status === 'publish' ) { - req.alias = 'publishPost'; - } - } ); - cy.get( '.editor-post-publish-button' ).click(); - cy.get( - '.components-snackbar, .components-notice.is-success' - ).should( 'be.visible' ); - cy.wait( '@publishPost' ).then( ( response ) => { - let _a; - cy.wrap( - ( _a = response.response ) === null || _a === void 0 - ? void 0 - : _a.body - ); - } ); - } ); - cy.get( - '.editor-post-publish-panel__header .components-button' - ).click(); - cy.openDocumentSettingsPanel( 'Distributor' ); - cy.get( '.distributor-panel .distributor-toggle button' ).should( - 'contain.text', - 'Distribute post' - ); - } ); -} );