diff --git a/core/screens/notifications/components/NotificationSettingsList.tsx b/core/screens/notifications/components/NotificationSettingsList.tsx index 4407abf4f690132c2c1980c77ebedc696f33a60d..953eb2d7d0cf161faad77727b3ba6bec203ada04 100644 --- a/core/screens/notifications/components/NotificationSettingsList.tsx +++ b/core/screens/notifications/components/NotificationSettingsList.tsx @@ -25,6 +25,8 @@ import HoliLoader from '@holi/ui/components/molecules/HoliLoader' import HoliRoundedSection from '@holi/ui/components/molecules/HoliRoundedSection' import Spacing from '@holi/ui/foundations/Spacing' import { HoliTheme, useTheme } from '@holi/ui/styles/theme' +import useTracking from '@holi/core/tracking/hooks/useTracking' +import { TrackingEvent } from '@holi/core/tracking' const CATEGORY_ILLUSTRATIONS = { GLOBAL: require('@holi/ui/assets/img/illustrations/illustration_bell.svg'), @@ -144,19 +146,28 @@ const WorkflowSettings = ({ const { t } = useTranslation() const { theme } = useTheme() const styles = useMemo(() => getStyles(theme), [theme]) + const { track } = useTracking() + + const workflowName = t(`profile.settings.notifications.workflow.${workflow.id}`) + + const onSelect = (channel: Channel, checked: boolean) => { + track(TrackingEvent.NotificationPreferenceChanged(workflow.id, workflowName, channel, checked)) + + updatePreference(workflow.id, channel, checked) + } return ( <View style={[styles.row, style]} testID={workflow.id}> <HoliColumns> <SettingsNameColumn> - <HoliText>{t(`profile.settings.notifications.workflow.${workflow.id}`)}</HoliText> + <HoliText>{workflowName}</HoliText> </SettingsNameColumn> <SettingsCheckBoxColumn> {workflow.preferences.push !== null && ( <HoliCheckbox checked={workflow.preferences.push} aria-label={t('profile.settings.notifications.channel.push')} - onSelect={(checked) => updatePreference(workflow.id, Channel.PUSH, checked)} + onSelect={(checked) => onSelect(Channel.PUSH, checked)} testID="push" /> )} @@ -166,7 +177,7 @@ const WorkflowSettings = ({ <HoliCheckbox checked={workflow.preferences.email} aria-label={t('profile.settings.notifications.channel.email')} - onSelect={(checked) => updatePreference(workflow.id, Channel.EMAIL, checked)} + onSelect={(checked) => onSelect(Channel.EMAIL, checked)} testID="email" /> )} diff --git a/core/tracking/events.ts b/core/tracking/events.ts index a46a7f3011a24bd4fc3b9fe410d6f9648d3d1c1d..f2e478a88a4947e96243c96c943010f44db8365f 100644 --- a/core/tracking/events.ts +++ b/core/tracking/events.ts @@ -1,5 +1,6 @@ /* eslint-disable @typescript-eslint/no-namespace */ import type { SignupModalPressedTrigger } from '@holi/core/tracking/types' +import { Channel } from '@holi/core/screens/notifications/hooks/useNotificationPreferences' type RecommendationType = 'space' | 'donation' | 'volunteering_opportunity' | 'goodnews' | 'space_task' @@ -410,6 +411,21 @@ export namespace TrackingEvent { ...versionOne, }), } + + export const NotificationPreferenceChanged = ( + workflowId: string, + workflowName: string, + channel: Channel, + newState: boolean + ): TrackingEvent => ({ + ...versionOne, + name: 'notificationPreferenceChanged', + properties: { + workflowId, + channel, + newState, + }, + }) } export const Unknown: TrackingEvent = {