@automattic/newspack-blocks 1.0.0-hotfix-cap-count-user-posts-dedup.1

package/src/blocks/donate/frequency-based/style.scss

@@ -0,0 +1,245 @@
+@use "newspack-colors" as np-colors;
+@use "../../../shared/sass/mixins";
+@use "../../../shared/sass/variables";
+
+.wpbnbd--frequency-based {
+	background: np-colors.$neutral-000;
+	border: 1px solid np-colors.$neutral-300;
+	color: np-colors.$neutral-900;
+	position: relative;
+	width: 100%;
+
+	// Hide some radio buttons absolutely.
+	input[type="radio"] {
+		position: absolute;
+		left: -99999em;
+
+		// And hide the ones being replaced by tabs completely.
+		&[name="donation_frequency"],
+		&[name="donation_frequency"] + label {
+			display: none;
+		}
+	}
+
+	input[readonly] {
+		background-color: np-colors.$neutral-050;
+		color: np-colors.$neutral-600;
+	}
+
+	.freq-label,
+	.tier-label,
+	.input-container {
+		display: block;
+		font-weight: bold;
+		cursor: pointer;
+	}
+
+	.freq-label {
+		box-sizing: border-box;
+		overflow: hidden;
+		white-space: nowrap;
+		width: 100%;
+		z-index: 1;
+	}
+
+	button,
+	.submit-button {
+		margin: 0 0.76rem 0.76rem;
+
+		@include mixins.media( tablet ) {
+			margin: 0 1.5rem 1.5rem;
+		}
+		&:disabled {
+			opacity: 0.5;
+		}
+	}
+	.wpbnbd {
+		&__button {
+			font-size: 16px;
+			text-transform: uppercase;
+		}
+	}
+
+	.thanks {
+		color: np-colors.$neutral-600;
+		font-size: variables.$font__size-sm;
+		margin: 0.38rem 0.76rem 0.76rem;
+		display: none;
+
+		@include mixins.media( mobile ) {
+			display: block;
+		}
+		@include mixins.media( tablet ) {
+			margin-left: 1.5rem;
+			margin-right: 1.5rem;
+		}
+	}
+}
+
+.wpbnbd.tiered {
+	.tiers {
+		margin: 0.38rem;
+		display: none;
+		flex-wrap: wrap;
+		position: relative;
+
+		@include mixins.media( tablet ) {
+			margin: 1.12rem 1.12rem 0.38rem;
+		}
+
+		.tier-label {
+			border: 1px solid np-colors.$neutral-300;
+			border-radius: 5px;
+			margin: 0.38rem;
+			padding: 0.38rem 0.76rem;
+
+			&:hover {
+				background: np-colors.$neutral-050;
+			}
+		}
+
+		input[type="radio"] {
+			&:focus + .tier-label {
+				background: np-colors.$neutral-050;
+				outline: 1px dotted currentcolor;
+				outline-offset: -4px;
+			}
+
+			&:checked + .tier-label {
+				background-color: np-colors.$neutral-600;
+				border-color: transparent;
+				color: np-colors.$neutral-000;
+			}
+		}
+
+		// other-donate-label
+		.odl {
+			font-weight: bold;
+			left: 0.38rem;
+			position: absolute;
+			bottom: calc(1.6em + 1.1rem + 2px);
+		}
+
+		input.other-input {
+			~ .money-input,
+			~ .odl { // other-donate-label
+				display: none;
+			}
+
+			&:checked ~ .money-input {
+				display: flex;
+			}
+
+			&:checked ~ .odl {
+				display: block;
+			}
+
+			&:checked + label {
+				margin-bottom: calc(3.2em + 1.86rem + 2px);
+			}
+		}
+	}
+
+	.money-input {
+		bottom: 0.38rem;
+		left: 0.38rem;
+		position: absolute;
+	}
+}
+
+.wpbnbd.untiered {
+	&.wpbnbd--nyp-disabled .tier-label {
+		border: none;
+		font-size: 1.25rem;
+		padding: 0;
+	}
+	.input-container {
+		margin: 0.76rem;
+		display: none;
+
+		@include mixins.media( tablet ) {
+			margin: 1.5rem 1.5rem 0.76rem;
+		}
+	}
+
+	input[type="radio"]:checked ~ .input-container {
+		display: block;
+	}
+}
+
+.wpbnbd .money-input {
+	display: flex;
+	align-items: center;
+	position: relative;
+	max-width: 200px;
+	background-color: np-colors.$neutral-000;
+	border-radius: 3px;
+	border: 1px solid np-colors.$neutral-300;
+
+	&:focus-within {
+		border-color: np-colors.$neutral-900;
+		outline: thin solid rgba(np-colors.$neutral-900, 0.15);
+		outline-offset: -4px;
+	}
+
+	.currency {
+		cursor: default;
+		font-size: variables.$font__size-sm;
+		padding-left: 0.5em;
+	}
+
+	input[type="number"] {
+		border: none;
+		outline: none;
+		box-shadow: none;
+		background: none;
+		max-width: 174px;
+
+		&:focus {
+			border: none;
+			outline: none;
+			box-shadow: none;
+		}
+	}
+}
+
+.wpbnbd {
+	.frequencies {
+		position: relative;
+		font-size: variables.$font__size-xs;
+		@include mixins.media( mobile ) {
+			font-size: variables.$font__size-sm;
+		}
+	}
+
+	.frequency input[type="radio"]:checked ~ .tiers {
+		display: flex;
+	}
+
+	.tab-container {
+		display: flex;
+		.freq-label {
+			border-radius: 0;
+			margin: 0;
+
+			&.wpbnbd__button--active {
+				color: np-colors.$neutral-900;
+			}
+
+			&:focus {
+				outline: 0;
+				text-decoration: underline;
+				text-decoration-style: dotted;
+				text-decoration-thickness: 1px;
+			}
+		}
+	}
+}
+
+.wp-block-newspack-blocks-donate {
+	&__frequency-label {
+		display: flex;
+		align-items: center;
+		padding-left: 8px;
+	}
+}

package/src/blocks/donate/frontend/class-newspack-blocks-donate-renderer-base.php

@@ -0,0 +1,225 @@
+<?php
+/**
+ * Server-side rendering of the `newspack-blocks/donate` block.
+ *
+ * @package WordPress
+ */
+
+defined( 'ABSPATH' ) || exit;
+
+/**
+ * Handles the Donate block rendering functionality.
+ */
+abstract class Newspack_Blocks_Donate_Renderer_Base {
+	const FREQUENCY_PARAM   = 'donation_frequency';
+	const TIER_PARAM_PREFIX = 'donation_value_';
+
+	private static $configurations_cache = []; // phpcs:ignore Squiz.Commenting.VariableComment.Missing
+
+	/**
+	 * Get translatable frequency label.
+	 *
+	 * @param string $frequency_slug Frequency slug.
+	 * @param bool   $hide_once_label Whether to hide the "once" label.
+	 *
+	 * @return string
+	 */
+	public static function get_frequency_label( $frequency_slug, $hide_once_label = false ) {
+		switch ( $frequency_slug ) {
+			case 'once':
+				return $hide_once_label ? '' : ' ' . __( 'once', 'newspack-blocks' );
+			case 'month':
+				return ' ' . __( 'per month', 'newspack-blocks' );
+			case 'year':
+				return ' ' . __( 'per year', 'newspack-blocks' );
+		}
+	}
+
+	/**
+	 * Get configuration, based on block attributes and global settings.
+	 *
+	 * @param array $attributes Block attributes.
+	 */
+	public static function get_configuration( $attributes = [] ) {
+		$attributes_hash = md5( wp_json_encode( $attributes ) );
+		if ( isset( self::$configurations_cache[ $attributes_hash ] ) ) {
+			return self::$configurations_cache[ $attributes_hash ];
+		}
+		$configuration = Newspack\Donations::get_donation_settings();
+		if ( is_wp_error( $configuration ) ) {
+			return new \WP_Error( 'newspack_blocks_donation', __( 'Could not retrieve donation settings.', 'newspack-blocks' ) );
+		}
+
+		$configuration['defaultFrequency'] = $attributes['defaultFrequency'];
+
+		/* If block is in "manual" mode, override certain state properties with values stored in attributes */
+		if ( Newspack_Blocks::can_use_name_your_price() && ! empty( $attributes['manual'] ) ) {
+			// Migrate old attributes.
+			if ( empty( $attributes['amounts'] ) && isset( $attributes['suggestedAmounts'] ) ) {
+				$other_amount = $configuration['amounts']['month'][3];
+				if ( isset( $attributes['suggestedAmountUntiered'] ) ) {
+					$other_amount = $attributes['suggestedAmountUntiered'];
+				}
+				$suggested_amounts     = $attributes['suggestedAmounts'];
+				$multiplied_amounts    = [
+					$suggested_amounts[0] * 12,
+					$suggested_amounts[1] * 12,
+					$suggested_amounts[2] * 12,
+					$other_amount * 12,
+				];
+				$attributes['amounts'] = [
+					'once'  => $multiplied_amounts,
+					'month' => [
+						$suggested_amounts[0],
+						$suggested_amounts[1],
+						$suggested_amounts[2],
+						$other_amount,
+					],
+					'year'  => $multiplied_amounts,
+				];
+			}
+			$configuration['tiered'] = $attributes['tiered'] && Newspack_Blocks::can_use_name_your_price();
+			if ( isset( $attributes['amounts'] ) && ! empty( $attributes['amounts'] ) ) {
+				$configuration['amounts'] = $attributes['amounts'];
+			}
+
+			if ( isset( $attributes['minimumDonation'] ) ) {
+				$configuration['minimumDonation'] = $attributes['minimumDonation'];
+			}
+
+			// Override defaults with manual config.
+			$configuration['defaultFrequency']    = $attributes['defaultFrequency'];
+			$configuration['disabledFrequencies'] = $attributes['disabledFrequencies'];
+		}
+
+		// Ensure default frequency is valid (not disabled).
+		foreach ( array_keys( $configuration['disabledFrequencies'] ) as $frequency_slug ) {
+			if ( $configuration['defaultFrequency'] === $frequency_slug && $configuration['disabledFrequencies'][ $frequency_slug ] ) {
+				$non_disabled_frequencies          = array_keys(
+					array_filter(
+						$configuration['disabledFrequencies'],
+						function ( $item ) {
+							return ! $item;
+						}
+					)
+				);
+				$configuration['defaultFrequency'] = $non_disabled_frequencies[0];
+			}
+		}
+
+		$is_tiers_based                        = $configuration['tiered'] && 'tiers' === $attributes['layoutOption'];
+		$configuration['is_tier_based_layout'] = $is_tiers_based;
+		$tier_style                            = $attributes['tierStyle'];
+
+		$frequencies = [
+			'once'  => __( 'One-time', 'newspack-blocks' ),
+			'month' => __( 'Monthly', 'newspack-blocks' ),
+			'year'  => __( 'Annually', 'newspack-blocks' ),
+		];
+		foreach ( array_keys( $frequencies ) as $frequency_slug ) {
+			if ( $configuration['disabledFrequencies'][ $frequency_slug ] ) {
+				unset( $frequencies[ $frequency_slug ] );
+			}
+		}
+		$configuration['frequencies'] = $frequencies;
+
+		/* If block has additional CSS class(es)  */
+		if ( isset( $attributes['className'] ) ) {
+			$classname = $attributes['className'];
+		} else {
+			$classname = 'is-style-default';
+		}
+
+		$layout_version = ( $is_tiers_based ? 'tiers' : 'frequency' );
+		$class_names    = [
+			'wp-block-newspack-blocks-donate',
+			'wpbnbd',
+			'wpbnbd--' . $layout_version . '-based',
+			'wpbnbd--platform-' . $configuration['platform'],
+			$classname,
+			'wpbnbd-frequencies--' . count( $configuration['frequencies'] ),
+			$is_tiers_based ? 'wpbnbd--tier-style-' . $tier_style : null,
+		];
+		if ( ! Newspack_Blocks::can_use_name_your_price() ) {
+			$class_names[] = 'wpbnbd--nyp-disabled';
+		}
+		$configuration['container_classnames'] = implode( ' ', $class_names );
+
+		if ( isset( $configuration['minimumDonation'] ) ) {
+			foreach ( $configuration['amounts'] as $frequency => $amounts ) {
+				foreach ( $amounts as $index => $amount ) {
+					$configuration['amounts'][ $frequency ][ $index ] = max( (float) $configuration['minimumDonation'], $amount );
+				}
+			}
+		}
+
+		$configuration['uid'] = uniqid();
+
+		self::$configurations_cache[ $attributes_hash ] = $configuration;
+
+		return $configuration;
+	}
+
+	/**
+	 * Get style for a button.
+	 *
+	 * @param array $attributes Block attributes.
+	 * @param array $is_reverse_style Reverse background/foreground colors.
+	 */
+	protected static function get_button_style( $attributes, $is_reverse_style = false ) {
+		$button_color      = $attributes['buttonColor'];
+		$button_text_color = Newspack_Blocks::get_color_for_contrast( $button_color );
+		if ( $is_reverse_style ) {
+			return 'border-color: ' . esc_attr( $button_color ) . '; color: ' . esc_attr( $button_color ) . '; background: transparent;';
+		} else {
+			return 'border-color: ' . esc_attr( $button_color ) . '; background-color: ' . esc_attr( $button_color ) . '; color: ' . esc_attr( $button_text_color ) . ';';
+		}
+	}
+
+	/**
+	 * Render hidden form inputs.
+	 *
+	 * @param array $attributes The block attributes.
+	 */
+	protected static function render_hidden_form_inputs( $attributes ) {
+		ob_start();
+		/**
+		 * Action to add custom fields before the form fields of the donation block.
+		 */
+		do_action( 'newspack_blocks_donate_before_form_fields' );
+
+		$currency = function_exists( 'get_woocommerce_currency' ) ? \get_woocommerce_currency() : 'USD';
+
+		$donate_child_ids = [];
+		if ( method_exists( 'Newspack\Donations', 'get_donation_product' ) ) {
+			$donate_child_ids['year']  = Newspack\Donations::get_donation_product( 'year' );
+			$donate_child_ids['month'] = Newspack\Donations::get_donation_product( 'month' );
+			$donate_child_ids['once']  = Newspack\Donations::get_donation_product( 'once' );
+		}
+		wp_referer_field();
+		?>
+			<input type='hidden' name='newspack_donate' value='1' />
+			<input type='hidden' name='donation_currency' value='<?php echo esc_attr( $currency ); ?>' />
+			<input type='hidden' name='frequency_ids' value='<?php echo esc_attr( wp_json_encode( $donate_child_ids ) ); ?>' />
+		<?php
+
+		if ( ! \Newspack_Blocks\Modal_Checkout::has_unsupported_payment_gateway() ) {
+			foreach ( [ [ 'afterSuccessBehavior', 'after_success_behavior' ], [ 'afterSuccessButtonLabel', 'after_success_button_label' ], [ 'afterSuccessURL', 'after_success_url' ] ] as $attribute ) {
+				$attribute_name = $attribute[0];
+				$param_name     = $attribute[1];
+				$value          = isset( $attributes[ $attribute_name ] ) ? $attributes[ $attribute_name ] : '';
+				?>
+					<input type='hidden' name='<?php echo esc_attr( $param_name ); ?>' value='<?php echo esc_attr( $value ); ?>' />
+				<?php
+			}
+		}
+		return ob_get_clean();
+	}
+
+	/**
+	 * Render the block HTML.
+	 *
+	 * @param array $attributes Block attributes.
+	 */
+	abstract public static function render( $attributes );
+}