Skip to content

Commit

Permalink
Newsletter Preview: Add Tracks (#39032)
Browse files Browse the repository at this point in the history
  • Loading branch information
lezama authored Aug 22, 2024
1 parent b1c37fb commit 76b328b
Show file tree
Hide file tree
Showing 2 changed files with 28 additions and 6 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
Significance: patch
Type: other

adds tracks to featured flagged feature
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ export function NewsletterTestEmailModal( { isOpen, onClose } ) {
const { tracks } = useAnalytics();

const sendTestEmail = async () => {
tracks.recordEvent( 'jetpack_send_email_preview', { post_id: postId } );
tracks.recordEvent( 'jetpack_newsletter_test_email_send', { post_id: postId } );
setIsEmailSending( true );
await __unstableSaveForPreview();

Expand Down Expand Up @@ -115,6 +115,12 @@ const previewDevices = [
const PreviewDeviceSelector = ( { selectedDevice, setSelectedDevice } ) => {
const [ isMedium ] = useBreakpointMatch( 'md' );
const [ isSmall ] = useBreakpointMatch( 'sm' );
const { tracks } = useAnalytics();

const handleDeviceChange = device => {
tracks.recordEvent( 'jetpack_newsletter_preview_device_change', { device } );
setSelectedDevice( device );
};

if ( isSmall ) {
return null;
Expand All @@ -126,7 +132,7 @@ const PreviewDeviceSelector = ( { selectedDevice, setSelectedDevice } ) => {
return (
<ToggleGroupControl
__nextHasNoMarginBottom
onChange={ setSelectedDevice }
onChange={ handleDeviceChange }
value={ selectedDevice }
isBlock
>
Expand All @@ -146,6 +152,7 @@ const PreviewAccessSelector = ( { selectedAccess, setSelectedAccess } ) => {
const [ isSmall ] = useBreakpointMatch( 'sm' );
const postType = useSelect( select => select( editorStore ).getCurrentPostType(), [] );
const accessLevel = useAccessLevel( postType );
const { tracks } = useAnalytics();

const isPaidOptionDisabled = ! accessLevel || accessLevel !== accessOptions.paid_subscribers.key;

Expand All @@ -161,6 +168,7 @@ const PreviewAccessSelector = ( { selectedAccess, setSelectedAccess } ) => {

const handleChange = value => {
if ( ! isPaidOptionDisabled ) {
tracks.recordEvent( 'jetpack_newsletter_preview_access_change', { access: value } );
setSelectedAccess( value );
}
};
Expand Down Expand Up @@ -225,6 +233,7 @@ export function NewsletterPreviewModal( { isOpen, onClose, postId } ) {
const [ previewCache, setPreviewCache ] = useState( {} );
const [ selectedAccess, setSelectedAccess ] = useState( accessOptions.subscribers.key );
const [ selectedDevice, setSelectedDevice ] = useState( 'desktop' );
const { tracks } = useAnalytics();

const fetchPreview = useCallback(
async accessLevel => {
Expand Down Expand Up @@ -271,17 +280,26 @@ export function NewsletterPreviewModal( { isOpen, onClose, postId } ) {
}
}, [ isOpen, selectedAccess, fetchPreview, previewCache ] );

useEffect( () => {
if ( isOpen ) {
tracks.recordEvent( 'jetpack_newsletter_preview_modal_open', { post_id: postId } );
}
}, [ isOpen, postId, tracks ] );

const handleClose = () => {
tracks.recordEvent( 'jetpack_newsletter_preview_modal_close', { post_id: postId } );
onClose();
setPreviewCache( {} );
};

const deviceWidth = previewDevices.find( device => device.name === selectedDevice ).width;

return (
isOpen && (
<Modal
isFullScreen={ true }
title={ __( 'Preview email', 'jetpack' ) }
onRequestClose={ () => {
onClose();
setPreviewCache( {} );
} }
onRequestClose={ handleClose }
headerActions={
<PreviewControls
selectedAccess={ selectedAccess }
Expand Down

0 comments on commit 76b328b

Please sign in to comment.