From b6444e4e67a4b04b39fc4d610f57278b1f851d94 Mon Sep 17 00:00:00 2001 From: Luiz Kowalski Date: Thu, 23 Nov 2023 15:05:11 -0300 Subject: [PATCH 1/3] Handle Contact Us button for Simple sites on the usage panel --- .../components/usage-panel/index.tsx | 60 ++++++++++++++++--- 1 file changed, 51 insertions(+), 9 deletions(-) diff --git a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/usage-panel/index.tsx b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/usage-panel/index.tsx index 6821d1844a06c..c709aa97cddf8 100644 --- a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/usage-panel/index.tsx +++ b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/usage-panel/index.tsx @@ -1,6 +1,8 @@ /** * External dependencies */ +import { getRedirectUrl } from '@automattic/jetpack-components'; +import { isAtomicSite, isSimpleSite } from '@automattic/jetpack-shared-extension-utils'; import { Button } from '@wordpress/components'; import { __, sprintf } from '@wordpress/i18n'; import React from 'react'; @@ -11,6 +13,7 @@ import './style.scss'; import useAICheckout from '../../../../blocks/ai-assistant/hooks/use-ai-checkout'; import useAiFeature from '../../../../blocks/ai-assistant/hooks/use-ai-feature'; import { canUserPurchasePlan } from '../../../../blocks/ai-assistant/lib/connection'; +import useAutosaveAndRedirect from '../../../../shared/use-autosave-and-redirect'; import UsageControl from '../usage-bar'; import './style.scss'; import { PLAN_TYPE_FREE, PLAN_TYPE_TIERED, PLAN_TYPE_UNLIMITED } from '../usage-bar/types'; @@ -97,8 +100,28 @@ const useUpgradeButtonText = ( planType: PlanType, nextTierRequestLimit: number ); }; +/** + * Helper to get the Contact Us URL + * @returns {object} an object with the Contact Us URL, the autosaveAndRedirect function and a boolean indicating if we are redirecting + */ +const useAIContactUs = (): { + contactUsURL: string; + autosaveAndRedirectContactUs: () => void; + isRedirectingContactUs: boolean; +} => { + const contactUsURL = getRedirectUrl( 'jetpack-ai-tiers-more-requests-contact' ); + const { autosaveAndRedirect, isRedirecting } = useAutosaveAndRedirect( contactUsURL ); + + return { + contactUsURL, + autosaveAndRedirectContactUs: autosaveAndRedirect, + isRedirectingContactUs: isRedirecting, + }; +}; + export default function UsagePanel() { const { checkoutUrl, autosaveAndRedirect, isRedirecting } = useAICheckout(); + const { contactUsURL, autosaveAndRedirectContactUs } = useAIContactUs(); const canUpgrade = canUserPurchasePlan(); // fetch usage data @@ -120,6 +143,10 @@ export default function UsagePanel() { // Determine the upgrade button text const upgradeButtonText = useUpgradeButtonText( planType, nextTier?.limit ); + // Handle upgrade for simple and atomic sites on the last plan + const showContactUsCallToAction = + ( isSimpleSite() || isAtomicSite() ) && planType === PLAN_TYPE_TIERED && ! nextTier; + return (
<> @@ -133,15 +160,30 @@ export default function UsagePanel() { { ( planType === PLAN_TYPE_FREE || planType === PLAN_TYPE_TIERED ) && canUpgrade && (
- + { showContactUsCallToAction && ( + <> +

{ __( 'Need more requests?', 'jetpack' ) }

+ + + ) } + { ! showContactUsCallToAction && ( + + ) }
) } From 911f888663b81499841b80f08df640f4bdbab43d Mon Sep 17 00:00:00 2001 From: Luiz Kowalski Date: Thu, 23 Nov 2023 15:06:39 -0300 Subject: [PATCH 2/3] Add changelog file --- ...pdate-jetpack-ai-handle-contact-us-upgrade-on-simple-sites | 4 ++++ 1 file changed, 4 insertions(+) create mode 100644 projects/plugins/jetpack/changelog/update-jetpack-ai-handle-contact-us-upgrade-on-simple-sites diff --git a/projects/plugins/jetpack/changelog/update-jetpack-ai-handle-contact-us-upgrade-on-simple-sites b/projects/plugins/jetpack/changelog/update-jetpack-ai-handle-contact-us-upgrade-on-simple-sites new file mode 100644 index 0000000000000..0fdffae2222f2 --- /dev/null +++ b/projects/plugins/jetpack/changelog/update-jetpack-ai-handle-contact-us-upgrade-on-simple-sites @@ -0,0 +1,4 @@ +Significance: patch +Type: other + +Jetpack AI: Handle Contact Us button on the Usage Panel when the site is a Simple or Atomic site. From 0de8f82cd2b79c9d1d06d890ebad32313a1f8de5 Mon Sep 17 00:00:00 2001 From: Luiz Kowalski Date: Fri, 24 Nov 2023 10:30:34 -0300 Subject: [PATCH 3/3] Drop the AI portion on hook name, to simplify it --- .../ai-assistant-plugin/components/usage-panel/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/usage-panel/index.tsx b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/usage-panel/index.tsx index c709aa97cddf8..dc8c0e93d9dfe 100644 --- a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/usage-panel/index.tsx +++ b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/usage-panel/index.tsx @@ -104,7 +104,7 @@ const useUpgradeButtonText = ( planType: PlanType, nextTierRequestLimit: number * Helper to get the Contact Us URL * @returns {object} an object with the Contact Us URL, the autosaveAndRedirect function and a boolean indicating if we are redirecting */ -const useAIContactUs = (): { +const useContactUsLink = (): { contactUsURL: string; autosaveAndRedirectContactUs: () => void; isRedirectingContactUs: boolean; @@ -121,7 +121,7 @@ const useAIContactUs = (): { export default function UsagePanel() { const { checkoutUrl, autosaveAndRedirect, isRedirecting } = useAICheckout(); - const { contactUsURL, autosaveAndRedirectContactUs } = useAIContactUs(); + const { contactUsURL, autosaveAndRedirectContactUs } = useContactUsLink(); const canUpgrade = canUserPurchasePlan(); // fetch usage data