Skip to content

Commit

Permalink
Merge pull request #381 from ConvertKit/broadcasts-no-posts
Browse files Browse the repository at this point in the history
Broadcasts Block: Display message in editor when no Broadcasts exist
  • Loading branch information
n7studios authored Oct 27, 2022
2 parents 27df3a4 + 3e801fa commit 5c0aac2
Show file tree
Hide file tree
Showing 5 changed files with 148 additions and 16 deletions.
6 changes: 3 additions & 3 deletions .github/workflows/coding-standards.yml
Original file line number Diff line number Diff line change
Expand Up @@ -116,12 +116,12 @@ jobs:
working-directory: ${{ env.PLUGIN_DIR }}
run: composer dump-autoload

# Run PSR-12 Coding Standards on Tests.
- name: Run PSR-12 Coding Standards on Tests
# Run Coding Standards on Tests.
- name: Run Coding Standards on Tests
working-directory: ${{ env.PLUGIN_DIR }}
run: php vendor/bin/phpcs ./tests --standard=phpcs.tests.xml -v -s

# Run WordPress Coding Standards.
# Run WordPress Coding Standards on Plugin.
- name: Run WordPress Coding Standards
working-directory: ${{ env.PLUGIN_DIR }}
run: php vendor/bin/phpcs ./ --standard=phpcs.xml -v -s
Expand Down
48 changes: 36 additions & 12 deletions includes/blocks/class-convertkit-block-broadcasts.php
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,9 @@ public function __construct() {
// Register this as a Gutenberg block in the ConvertKit Plugin.
add_filter( 'convertkit_blocks', array( $this, 'register' ) );

// Enqueue scripts and styles for this Gutenberg Block in the editor view.
add_action( 'convertkit_gutenberg_enqueue_scripts', array( $this, 'enqueue_scripts_editor' ) );

// Enqueue scripts and styles for this Gutenberg Block in the editor and frontend views.
add_action( 'convertkit_gutenberg_enqueue_scripts_editor_and_frontend', array( $this, 'enqueue_scripts' ) );
add_action( 'convertkit_gutenberg_enqueue_styles_editor_and_frontend', array( $this, 'enqueue_styles' ) );
Expand All @@ -40,6 +43,17 @@ public function __construct() {
/**
* Enqueues scripts for this Gutenberg Block in the editor view.
*
* @since 2.0.1
*/
public function enqueue_scripts_editor() {

wp_enqueue_script( 'convertkit-gutenberg-block-broadcasts', CONVERTKIT_PLUGIN_URL . 'resources/backend/js/gutenberg-block-broadcasts.js', array( 'convertkit-gutenberg' ), CONVERTKIT_PLUGIN_VERSION, true );

}

/**
* Enqueues scripts for this Gutenberg Block in the editor and frontend views.
*
* @since 1.9.7.6
*/
public function enqueue_scripts() {
Expand Down Expand Up @@ -98,37 +112,47 @@ public function get_name() {
*/
public function get_overview() {

// Fetch Posts.
$posts = new ConvertKit_Resource_Posts( 'output_broadcasts' );

return array(
'title' => __( 'ConvertKit Broadcasts', 'convertkit' ),
'description' => __( 'Displays a list of your ConvertKit broadcasts.', 'convertkit' ),
'icon' => 'resources/backend/images/block-icon-broadcasts.png',
'category' => 'convertkit',
'keywords' => array(
'title' => __( 'ConvertKit Broadcasts', 'convertkit' ),
'description' => __( 'Displays a list of your ConvertKit broadcasts.', 'convertkit' ),
'icon' => 'resources/backend/images/block-icon-broadcasts.png',
'category' => 'convertkit',
'keywords' => array(
__( 'ConvertKit', 'convertkit' ),
__( 'Broadcasts', 'convertkit' ),
__( 'Posts', 'convertkit' ),
),

// Function to call when rendering as a block or a shortcode on the frontend web site.
'render_callback' => array( $this, 'render' ),
'render_callback' => array( $this, 'render' ),

// Shortcode: TinyMCE / QuickTags Modal Width and Height.
'modal' => array(
'modal' => array(
'width' => 500,
'height' => 580,
),

// Shortcode: Include a closing [/shortcode] tag when using TinyMCE or QuickTag Modals.
'shortcode_include_closing_tag' => false,
'shortcode_include_closing_tag' => false,

// Gutenberg: Block Icon in Editor.
'gutenberg_icon' => file_get_contents( CONVERTKIT_PLUGIN_PATH . '/resources/backend/images/block-icon-broadcasts.svg' ), /* phpcs:ignore */
'gutenberg_icon' => file_get_contents( CONVERTKIT_PLUGIN_PATH . '/resources/backend/images/block-icon-broadcasts.svg' ), /* phpcs:ignore */

// Gutenberg: Example image showing how this block looks when choosing it in Gutenberg.
'gutenberg_example_image' => CONVERTKIT_PLUGIN_URL . 'resources/backend/images/block-example-broadcasts.png',
'gutenberg_example_image' => CONVERTKIT_PLUGIN_URL . 'resources/backend/images/block-example-broadcasts.png',

// Gutenberg: Help description, displayed when no Posts exist.
'gutenberg_help_description' => __( 'No Broadcasts exist in ConvertKit. Send your first Broadcast in ConvertKit to see the link to it here.', 'convertkit' ),

// Gutenberg: JS function to call when rendering the block preview in the Gutenberg editor.
// If not defined, render_callback above will be used.
'gutenberg_preview_render_callback' => 'convertKitGutenbergBroadcastsBlockRenderPreview',

// Gutenberg: Help description, displayed when no settings defined for a newly added Block.
'gutenberg_help_description' => __( 'Define this Block\'s settings in the Gutenberg sidebar to display a list of your broadcasts.', 'convertkit' ),
// Flag to determine if Broadcasts exist.
'has_posts' => $posts->exist(),
);

}
Expand Down
3 changes: 3 additions & 0 deletions readme.txt
Original file line number Diff line number Diff line change
Expand Up @@ -117,6 +117,9 @@ Full Plugin documentation can be found [here](https://help.convertkit.com/en/art

== Changelog ==

### 2.0.1 2022-10-xx
* Added: Broadcasts: Block: Display message in editor when no Broadcasts exist in ConvertKit

### 2.0.0 2022-10-24
* Added: ConvertKit Products Block, to output a button linking to a ConvertKit Product or Tip Jar
* Added: ConvertKit Products Shortcode, to output a button linking to a ConvertKit Product or Tip Jar
Expand Down
41 changes: 41 additions & 0 deletions resources/backend/js/gutenberg-block-broadcasts.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
/**
* Broadcasts Block specific functions for Gutenberg.
*
* @since 2.0.1
*
* @package ConvertKit
* @author ConvertKit
*/

/**
* Custom callback function to render the ConvertKit Broadcasts Block preview in the Gutenberg Editor.
*
* @since 2.0.1
*/
function convertKitGutenbergBroadcastsBlockRenderPreview( block, props ) {

// If no Broadcasts exist, return a prompt to tell the editor what to do.
if ( ! block.has_posts ) {
return wp.element.createElement(
'div',
{
// convertkit-no-content class allows resources/backend/css/gutenberg.css
// to apply styling/branding to the block.
className: 'convertkit-' + block.name + ' convertkit-no-content'
},
block.gutenberg_help_description
);
}

// A Product is specified.
// Use the block's PHP's render() function by calling the ServerSideRender component.
return wp.element.createElement(
wp.components.ServerSideRender,
{
block: 'convertkit/' + block.name,
attributes: props.attributes,
className: 'convertkit-' + block.name,
}
);

}
66 changes: 65 additions & 1 deletion tests/acceptance/broadcasts/PageBlockBroadcastsCest.php
Original file line number Diff line number Diff line change
Expand Up @@ -16,8 +16,40 @@ class PageBlockBroadcastsCest
public function _before(AcceptanceTester $I)
{
$I->activateConvertKitPlugin($I);
$I->setupConvertKitPlugin($I);
}

/**
* Test the Broadcasts block outputs a message when no Broadcasts exist.
*
* @since 2.0.1
*
* @param AcceptanceTester $I Tester.
*/
public function testBroadcastsBlockWithNoBroadcasts(AcceptanceTester $I)
{
// Setup Plugin with API keys for ConvertKit Account that has no Broadcasts, and enable debug log.
$I->setupConvertKitPlugin($I, $_ENV['CONVERTKIT_API_KEY_NO_DATA'], $_ENV['CONVERTKIT_API_SECRET_NO_DATA']);
$I->enableDebugLog($I);

// Add a Page using the Gutenberg editor.
$I->addGutenbergPage($I, 'page', 'ConvertKit: Page: Broadcasts: No Broadcasts');

// Add block to Page.
$I->addGutenbergBlock($I, 'ConvertKit Broadcasts', 'convertkit-broadcasts');

// Confirm that the Broadcasts block tells the user that no Broadcasts exist in ConvertKit.
$I->see(
'No Broadcasts exist in ConvertKit. Send your first Broadcast in ConvertKit to see the link to it here.',
[
'css' => '.convertkit-no-content',
]
);

// Publish and view the Page on the frontend site.
$I->publishAndViewGutenbergPage($I);

// Confirm that no ConvertKit Broadcasts are displayed.
$I->dontSeeElementInDOM('div.convertkit-broadcasts');
}

/**
Expand All @@ -29,6 +61,10 @@ public function _before(AcceptanceTester $I)
*/
public function testBroadcastsBlockWithDefaultParameters(AcceptanceTester $I)
{
// Setup Plugin and enable debug log.
$I->setupConvertKitPlugin($I);
$I->enableDebugLog($I);

// Add a Page using the Gutenberg editor.
$I->addGutenbergPage($I, 'page', 'ConvertKit: Page: Broadcasts: Default Params');

Expand Down Expand Up @@ -57,6 +93,10 @@ public function testBroadcastsBlockWithDefaultParameters(AcceptanceTester $I)
*/
public function testBroadcastsBlockWithDateFormatParameter(AcceptanceTester $I)
{
// Setup Plugin and enable debug log.
$I->setupConvertKitPlugin($I);
$I->enableDebugLog($I);

// Add a Page using the Gutenberg editor.
$I->addGutenbergPage($I, 'page', 'ConvertKit: Page: Broadcasts: Date Format Param');

Expand Down Expand Up @@ -92,6 +132,10 @@ public function testBroadcastsBlockWithDateFormatParameter(AcceptanceTester $I)
*/
public function testBroadcastsBlockWithLimitParameter(AcceptanceTester $I)
{
// Setup Plugin and enable debug log.
$I->setupConvertKitPlugin($I);
$I->enableDebugLog($I);

// Add a Page using the Gutenberg editor.
$I->addGutenbergPage($I, 'page', 'ConvertKit: Page: Broadcasts: Limit Param');

Expand Down Expand Up @@ -124,6 +168,10 @@ public function testBroadcastsBlockWithLimitParameter(AcceptanceTester $I)
*/
public function testBroadcastsBlockWithBlankLimitParameter(AcceptanceTester $I)
{
// Setup Plugin and enable debug log.
$I->setupConvertKitPlugin($I);
$I->enableDebugLog($I);

// Add a Page using the Gutenberg editor.
$I->addGutenbergPage($I, 'page', 'ConvertKit: Page: Broadcasts: Blank Limit Param');

Expand Down Expand Up @@ -157,6 +205,10 @@ public function testBroadcastsBlockWithBlankLimitParameter(AcceptanceTester $I)
*/
public function testBroadcastsBlockWithPaginationEnabled(AcceptanceTester $I)
{
// Setup Plugin and enable debug log.
$I->setupConvertKitPlugin($I);
$I->enableDebugLog($I);

// Add a Page using the Gutenberg editor.
$I->addGutenbergPage($I, 'page', 'ConvertKit: Page: Broadcasts: Pagination');

Expand Down Expand Up @@ -187,6 +239,10 @@ public function testBroadcastsBlockWithPaginationEnabled(AcceptanceTester $I)
*/
public function testBroadcastsBlockWithPaginationLabelParameters(AcceptanceTester $I)
{
// Setup Plugin and enable debug log.
$I->setupConvertKitPlugin($I);
$I->enableDebugLog($I);

// Add a Page using the Gutenberg editor.
$I->addGutenbergPage($I, 'page', 'ConvertKit: Page: Broadcasts: Pagination Labels');

Expand Down Expand Up @@ -219,6 +275,10 @@ public function testBroadcastsBlockWithPaginationLabelParameters(AcceptanceTeste
*/
public function testBroadcastsBlockWithThemeColorParameters(AcceptanceTester $I)
{
// Setup Plugin and enable debug log.
$I->setupConvertKitPlugin($I);
$I->enableDebugLog($I);

// Define colors.
$backgroundColor = 'white';
$textColor = 'purple';
Expand Down Expand Up @@ -262,6 +322,10 @@ public function testBroadcastsBlockWithThemeColorParameters(AcceptanceTester $I)
*/
public function testBroadcastsBlockWithHexColorParameters(AcceptanceTester $I)
{
// Setup Plugin and enable debug log.
$I->setupConvertKitPlugin($I);
$I->enableDebugLog($I);

// Define colors.
$backgroundColor = '#ee1616';
$textColor = '#1212c0';
Expand Down

0 comments on commit 5c0aac2

Please sign in to comment.