refactor: legacy free user with offload check

Author: Soare-Robert-Daniel

assets/src/dashboard/parts/connected/settings/OffloadMedia.js

@@ -1,8 +1,8 @@
 /* global optimoleDashboardApp */
 
 import classnames from 'classnames';
-import { useEffect, useState } from '@wordpress/element';
-import { useDispatch, useSelect, useMemo } from '@wordpress/data';
+import { useEffect, useState, useMemo } from '@wordpress/element';
+import { useDispatch, useSelect } from '@wordpress/data';
 import { Icon } from '@wordpress/icons';
 
 import { warning, rollback as rollbackIcon, offload, warningAlt, sync } from '../../../utils/icons';
@@ -38,8 +38,8 @@ const OffloadMedia = ({ settings, canSave, setSettings, setCanSave }) => {
 		offloadFinishNotice,
 		offloadLimitReached,
 		offloadLimit,
-		canUseMediaOffloading,
-		isMediaOffloadingLegacyFreeUser
+		canUseMediaOffloadingFlag,
+		canShowFreeUserWithOffloadNoticeFlag
 	} = useSelect( select => {
 		const {
 			getOffloadConflicts,
@@ -54,12 +54,11 @@ const OffloadMedia = ({ settings, canSave, setSettings, setCanSave }) => {
 			isLoading,
 			getSiteSettings,
 			getOffloadLimit,
-			getUserData
+			getUserData,
+			canShowFreeUserWithOffloadNotice
 		} = select( 'optimole' );
 
 		const userData = getUserData();
-		const canUseMediaOffloading = Boolean( userData?.can_use_offloading );
-		const isMediaOffloadingLegacyFreeUser = Boolean( userData?.is_legacy_offloading_free_user );
 
 		return {
 			offloadConflicts: getOffloadConflicts(),
@@ -75,8 +74,8 @@ const OffloadMedia = ({ settings, canSave, setSettings, setCanSave }) => {
 			offloadFinishNotice: getSiteSettings( 'show_offload_finish_notice' ),
 			offloadLimitReached: 'enabled' === getSiteSettings( 'offload_limit_reached' ),
 			offloadLimit: getOffloadLimit(),
-			canUseMediaOffloading,
-			isMediaOffloadingLegacyFreeUser
+			canUseMediaOffloadingFlag: Boolean( userData?.can_use_offloading ),
+			canShowFreeUserWithOffloadNoticeFlag: canShowFreeUserWithOffloadNotice()
 		};
 	}, []);
 
@@ -94,8 +93,8 @@ const OffloadMedia = ({ settings, canSave, setSettings, setCanSave }) => {
 	const isRollbackInProgress = 'disabled' !== settings['rollback_status'];
 
 	const showDisabledOffloadingNotice = useMemo( () => {
-		return ! canUseMediaOffloading && isMediaOffloadingLegacyFreeUser && 'enabled' === settings?.['offload_media'];
-	}, [ settings, canUseMediaOffloading, isMediaOffloadingLegacyFreeUser ]);
+		return 'enabled' === settings?.['offload_media'] && ! canUseMediaOffloadingFlag && canShowFreeUserWithOffloadNoticeFlag;
+	}, [ settings, canUseMediaOffloadingFlag, canShowFreeUserWithOffloadNoticeFlag ]);
 
 	useEffect( () => {
 		if ( isOffloadingInProgress ) {
@@ -193,7 +192,7 @@ const OffloadMedia = ({ settings, canSave, setSettings, setCanSave }) => {
 			[MODAL_STATE_OFFLOAD]: {
 				icon: offload,
 				onConfirm: () => {
-					if ( canUseMediaOffloading ) {
+					if ( canUseMediaOffloadingFlag ) {
 						onOffloadMedia();
 					} else {
 						window.open( optimoleDashboardApp.optimoleHome +  'pricing', '_blank' );
@@ -203,9 +202,9 @@ const OffloadMedia = ({ settings, canSave, setSettings, setCanSave }) => {
 				labels: {
 					title: options_strings.offloading_start_title,
 					description: options_strings.offloading_start_description,
-					action: canUseMediaOffloading ? options_strings.offloading_start_action : optimoleDashboardApp.strings.upgrade.title_long
+					action: canUseMediaOffloadingFlag ? options_strings.offloading_start_action : optimoleDashboardApp.strings.upgrade.title_long
 				},
-				afterContentChildren: ! canUseMediaOffloading && (
+				afterContentChildren: ! canUseMediaOffloadingFlag && (
 					<Notice
 						type="warning"
 						text={options_strings.upgrade_to_use_offloading_notice_desc}

assets/src/dashboard/store/reducer.js

@@ -31,7 +31,8 @@ const DEFAULT_STATE = {
 	logs: {
 		offload: '',
 		rollback: ''
-	}
+	},
+	canShowFreeUserWithOffloadNotice: 'yes' === optimoleDashboardApp?.show_free_user_with_offload_notice
 };
 
 const reducer = ( state = DEFAULT_STATE, action ) => {

assets/src/dashboard/store/selectors.js

@@ -96,6 +96,9 @@ const selectors = {
 	},
 	isSubApiKey( state ) {
 		return state.apiKey && state.apiKey.startsWith( 'optml-s' );
+	},
+	canShowFreeUserWithOffloadNotice( state ) {
+		return Boolean( state?.canShowFreeUserWithOffloadNotice );
 	}
 };
 

inc/admin.php

@@ -113,6 +113,7 @@ public function __construct() {
 		}
 
 		add_filter( 'themeisle-sdk/survey/' . OPTML_PRODUCT_SLUG, [ $this, 'get_survey_metadata' ], 10, 2 );
+		add_action( 'admin_init', [ $this, 'mark_free_user_with_offload' ] );
 	}
 
 	/**
@@ -1368,6 +1369,7 @@ private function localize_dashboard_app() {
 			'bf_notices'                 => $this->get_bf_notices(),
 			'spc_banner'                 => $this->get_spc_banner(),
 			'show_exceed_plan_quota_notice' => $this->should_show_exceed_quota_warning(),
+			'show_free_user_with_offload_notice' => get_option( 'optml_free_user_with_offload', 'no' ),
 		];
 	}
 
@@ -2276,4 +2278,28 @@ public function should_show_exceed_quota_warning() {
 
 		return true;
 	}
+
+	/**
+	 * Mark the users that are on free plan and have offload enabled.
+	 *
+	 * User for displaying a notice after plugin update about offload restrictions.
+	 *
+	 * @return void
+	 */
+	public function mark_free_user_with_offload() {
+		if ( ! $this->settings->is_connected() ) {
+			return;
+		}
+
+		$service_data = $this->settings->get( 'service_data' );
+		if ( isset( $service_data['plan'] ) && 'free' !== $service_data['plan'] ) {
+			return;
+		}
+
+		if ( false !== get_option( 'optml_free_user_with_offload', false ) ) {
+			return;
+		}
+
+		update_option( 'optml_free_user_with_offload', $this->settings->is_offload_enabled() ? 'yes' : 'no' );
+	}
 }

inc/main.php

@@ -7,7 +7,7 @@ final class Optml_Main {
 	/**
 	 * Optml_Main The single instance of Starter_Plugin.
 	 *
-	 * @var    object
+	 * @var      Optml_Main|null
 	 * @access   private
 	 * @since    1.0.0
 	 */