diff --git a/packages/console/src/components/Conversion/utils.ts b/packages/console/src/components/Conversion/utils.ts index 730ab9f49..1b73ba0a9 100644 --- a/packages/console/src/components/Conversion/utils.ts +++ b/packages/console/src/components/Conversion/utils.ts @@ -7,6 +7,8 @@ export const gtagAwTrackingId = 'AW-11124811245'; export enum GtagConversionId { /** This ID indicates a user has truly signed up for Logto Cloud. */ SignUp = 'AW-11192640559/ZuqUCLvNpasYEK_IiNkp', + /** This ID indicates a user has created their first app. */ + CreateFirstApp = 'AW-11192640559/jbsaCPS67q8ZEK_IiNkp', /** This ID indicates a user has created a production tenant. */ CreateProductionTenant = 'AW-11192640559/m04fCMDrxI0ZEK_IiNkp', /** This ID indicates a user has purchased a Pro plan. */ @@ -102,7 +104,7 @@ type ReportConversionOptions = { redditType?: RedditReportType; }; -export const reportConversion = async ({ +export const reportConversion = ({ gtagId, redditType, transactionId, @@ -112,8 +114,11 @@ export const reportConversion = async ({ return; } - return Promise.all([ - gtagId ? reportToGoogle(gtagId, { transactionId }) : undefined, - redditType ? reportToReddit(redditType) : undefined, - ]); + if (gtagId) { + reportToGoogle(gtagId, { transactionId }); + } + + if (redditType) { + reportToReddit(redditType); + } }; diff --git a/packages/console/src/onboarding/pages/SignInExperience/index.tsx b/packages/console/src/onboarding/pages/SignInExperience/index.tsx index c31a6dedb..fb195df72 100644 --- a/packages/console/src/onboarding/pages/SignInExperience/index.tsx +++ b/packages/console/src/onboarding/pages/SignInExperience/index.tsx @@ -118,18 +118,17 @@ function SignInExperience() { } } - const [updatedData] = await Promise.all([ - api - .patch(buildUrl('api/sign-in-exp', { removeUnusedDemoSocialConnector: '1' }), { - json: formDataParser.toUpdateOnboardingSieData(formData, signInExperience), - }) - .json(), - reportConversion({ - gtagId: GtagConversionId.SignUp, - redditType: 'SignUp', - transactionId: user?.id, - }), - ]); + const updatedData = await api + .patch(buildUrl('api/sign-in-exp', { removeUnusedDemoSocialConnector: '1' }), { + json: formDataParser.toUpdateOnboardingSieData(formData, signInExperience), + }) + .json(); + + reportConversion({ + gtagId: GtagConversionId.SignUp, + redditType: 'SignUp', + transactionId: user?.id, + }); void mutate(updatedData); diff --git a/packages/console/src/pages/Applications/components/CreateForm/index.tsx b/packages/console/src/pages/Applications/components/CreateForm/index.tsx index 98f75844b..31c172a89 100644 --- a/packages/console/src/pages/Applications/components/CreateForm/index.tsx +++ b/packages/console/src/pages/Applications/components/CreateForm/index.tsx @@ -7,12 +7,14 @@ import { toast } from 'react-hot-toast'; import { useTranslation } from 'react-i18next'; import Modal from 'react-modal'; +import { GtagConversionId, reportConversion } from '@/components/Conversion/utils'; import DynamicT from '@/ds-components/DynamicT'; import FormField from '@/ds-components/FormField'; import ModalLayout from '@/ds-components/ModalLayout'; import RadioGroup, { Radio } from '@/ds-components/RadioGroup'; import TextInput from '@/ds-components/TextInput'; import useApi from '@/hooks/use-api'; +import useCurrentUser from '@/hooks/use-current-user'; import * as modalStyles from '@/scss/modal.module.scss'; import { applicationTypeI18nKey } from '@/types/applications'; import { trySubmitSafe } from '@/utils/form'; @@ -50,6 +52,7 @@ function CreateForm({ } = useForm({ defaultValues: { type: defaultCreateType, isThirdParty: isDefaultCreateThirdParty }, }); + const { user } = useCurrentUser(); const { field: { onChange, value, name, ref }, @@ -69,6 +72,11 @@ function CreateForm({ } const createdApp = await api.post('api/applications', { json: data }).json(); + + // Report the conversion event after the application is created. Note that the conversion + // should be set as count once since this will be reported multiple times. + reportConversion({ gtagId: GtagConversionId.CreateFirstApp, transactionId: user?.id }); + toast.success(t('applications.application_created')); onClose?.(createdApp); })