Clicking "Maybe later" will dismiss feature announcement for 3 days (#…

…2762) * Clicking "Maybe later" will dismiss the modal for 3 days * Do not display modal if it's previously dismissed * Don't show the modal if the page isn't refreshed * EOL in new file * Apply suggestions from code review Lint fixes. Co-authored-by: André Kallehauge <3846700+kallehauge@users.noreply.github.com> --------- Co-authored-by: André Kallehauge <3846700+kallehauge@users.noreply.github.com>
Automattic · Jul 30, 2024 · d6c6784 · d6c6784
1 parent c1da943
commit d6c6784
Show file tree

Hide file tree

Showing 5 changed files with 21 additions and 6 deletions.
diff --git a/classes/class-wc-connect-service-settings-store.php b/classes/class-wc-connect-service-settings-store.php
@@ -617,12 +617,17 @@ public function get_package_lookup() {
 		}
 
 		public function is_eligible_for_migration() {
+			$migration_dismissed = false;
+			if ( isset( $_COOKIE[ WC_Connect_Loader::MIGRATION_DISMISSAL_COOKIE_KEY ] ) && (int) $_COOKIE[ WC_Connect_Loader::MIGRATION_DISMISSAL_COOKIE_KEY ] === 1 ) {
+				$migration_dismissed = true;
+			}
+
 			$migration_state = WC_Connect_Options::get_option( 'wcshipping_migration_state' );
 
 			$migration_pending = WC_Connect_WCST_To_WCShipping_Migration_State_Enum::COMPLETED !== $migration_state;
 			$migration_enabled = $this->service_schemas_store->is_wcship_wctax_migration_enabled();
 
-			return $migration_pending && $migration_enabled;
+			return $migration_pending && $migration_enabled && ! $migration_dismissed;
 		}
 
 		private function translate_unit( $value ) {

diff --git a/client/components/migration/constants.js b/client/components/migration/constants.js
@@ -0,0 +1 @@
+export const TIME_TO_REMMEMBER_DISMISSAL_SECONDS = 3 * 24 * 60 * 60; // 3 Days - number of seconds
diff --git a/client/components/migration/feature-announcement.jsx b/client/components/migration/feature-announcement.jsx
@@ -3,7 +3,7 @@
  */
 import React from 'react';
 import { Flex, FlexItem, Modal, Icon, Button } from '@wordpress/components';
-import { useState } from '@wordpress/element';
+import { useState, useEffect } from '@wordpress/element';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 import { localize } from 'i18n-calypso';
@@ -18,17 +18,26 @@ import {
 	wcshippingMigrationState,
 } from 'woocommerce/woocommerce-services/state/shipping-label/selectors';
 import { installAndActivatePlugins } from './migration-runner';
+import { TIME_TO_REMMEMBER_DISMISSAL_SECONDS } from './constants';
 
 const FeatureAnnouncement = ( { translate, isEligable, previousMigrationState } ) => {
 	const [isOpen, setIsOpen] = useState(isEligable);
 	const [isUpdating, setIsUpdating] = useState(false);
 
+	useEffect( () => {
+		const isMigrationDismissed = window.wpCookies.get( 'wcst-wcshipping-migration-dismissed' ) && parseInt( window.wpCookies.get( 'wcst-wcshipping-migration-dismissed' ) );
+		if ( isMigrationDismissed ) {
+			setIsOpen( false );
+		}
+	}, [] );
+
 	const closeModal = () => {
 		setIsOpen(false);
 	};
 
 	const snooze = () => {
-		// Todo: implement maybe later
+		window.wpCookies.set( 'wcst-wcshipping-migration-dismissed', 1, TIME_TO_REMMEMBER_DISMISSAL_SECONDS );
+		setIsOpen( false );
 	};
 
 	const update = async () => {

diff --git a/client/wcshipping-migration-admin-notice.js b/client/wcshipping-migration-admin-notice.js
@@ -13,6 +13,7 @@ import '../assets/stylesheets/migration_to_wcshipping_admin_notice.scss';
 import FeatureAnnouncement from 'components/migration/feature-announcement';
 import ShippingLabel from 'wcs-client/apps/shipping-label';
 import { setNonce, setBaseURL } from 'wcs-client/api/request';
+import { TIME_TO_REMMEMBER_DISMISSAL_SECONDS } from 'components/migration/constants';
 
 const container = document.getElementById('wcst_wcshipping_migration_admin_notice_feature_announcement');
 const args = container.dataset.args && JSON.parse( container.dataset.args ) || {};
@@ -23,7 +24,6 @@ const store = createStore(ShippingLabelStore.getReducer(), ShippingLabelStore.ge
 
 const wcstWCShippingMigrationNoticeButton = document.getElementById('wcst-wcshipping-migration-notice__click');
 const wcstMigrationNoticeDimissButton = document.querySelector('.wcst-wcshipping-migration-notice button.notice-dismiss');
-const TIME_TO_REMMEMBER_DISMISSAL_SECONDS = 3 * 24 * 60 * 60; // 3 Days - number of seconds
 
 // Add all button events
 ["click", "keydown"].forEach(eventName => {

diff --git a/woocommerce-services.php b/woocommerce-services.php
@@ -254,7 +254,7 @@ class WC_Connect_Loader {
 
 		protected static $wcs_version;
 
-		const MIGRATION_DISMISSAL_COOKIE_KEY = 'wcst-wcshipping-migration-dismissed';
+		public const MIGRATION_DISMISSAL_COOKIE_KEY = 'wcst-wcshipping-migration-dismissed';
 
 		public static function plugin_deactivation() {
 			wp_clear_scheduled_hook( 'wc_connect_fetch_service_schemas' );
@@ -1554,7 +1554,7 @@ public function edit_orders_page_actions() {
 				return;
 			}
 
-			// Add the WCS&T to WCShipping migratio notice, creating a button to update.
+			// Add the WCS&T to WCShipping migration notice, creating a button to update.
 			$settings_store = $this->get_service_settings_store();
 			if ( $settings_store->is_eligible_for_migration() ) {
 				add_action( 'admin_notices', array( $this, 'display_wcst_to_wcshipping_migration_notice' ) );