mirror of
				https://github.com/Unleash/unleash.git
				synced 2025-10-27 11:02:16 +01:00 
			
		
		
		
	refactor: change plausible events to be more specific at the top level (#3810)
Splits the `demo` event into multiple more specific events so it's easier to track on Plausible (fix `(none)` in Plausible).
This commit is contained in:
		
							parent
							
								
									e1dd1701cc
								
							
						
					
					
						commit
						0c538f070a
					
				@ -68,11 +68,7 @@ export const Demo = ({ children }: IDemoProps): JSX.Element => {
 | 
				
			|||||||
    const onFinish = () => {
 | 
					    const onFinish = () => {
 | 
				
			||||||
        setFinishOpen(true);
 | 
					        setFinishOpen(true);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
        trackEvent('demo', {
 | 
					        trackEvent('demo-finish');
 | 
				
			||||||
            props: {
 | 
					 | 
				
			||||||
                eventType: 'finish',
 | 
					 | 
				
			||||||
            },
 | 
					 | 
				
			||||||
        });
 | 
					 | 
				
			||||||
    };
 | 
					    };
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    const closeGuide = () => {
 | 
					    const closeGuide = () => {
 | 
				
			||||||
@ -91,11 +87,7 @@ export const Demo = ({ children }: IDemoProps): JSX.Element => {
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
                    setPlansOpen(true);
 | 
					                    setPlansOpen(true);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
                    trackEvent('demo', {
 | 
					                    trackEvent('demo-see-plans');
 | 
				
			||||||
                        props: {
 | 
					 | 
				
			||||||
                            eventType: 'see_plans',
 | 
					 | 
				
			||||||
                        },
 | 
					 | 
				
			||||||
                    });
 | 
					 | 
				
			||||||
                }}
 | 
					                }}
 | 
				
			||||||
            />
 | 
					            />
 | 
				
			||||||
            {children}
 | 
					            {children}
 | 
				
			||||||
@ -106,10 +98,10 @@ export const Demo = ({ children }: IDemoProps): JSX.Element => {
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
                    setExpanded(false);
 | 
					                    setExpanded(false);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
                    trackEvent('demo', {
 | 
					                    trackEvent('demo-close', {
 | 
				
			||||||
                        props: {
 | 
					                        props: {
 | 
				
			||||||
                            eventType: 'close',
 | 
					                            topic: 'welcome',
 | 
				
			||||||
                            topic: 'start',
 | 
					                            step: 'welcome',
 | 
				
			||||||
                        },
 | 
					                        },
 | 
				
			||||||
                    });
 | 
					                    });
 | 
				
			||||||
                }}
 | 
					                }}
 | 
				
			||||||
@ -118,11 +110,7 @@ export const Demo = ({ children }: IDemoProps): JSX.Element => {
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
                    onStart();
 | 
					                    onStart();
 | 
				
			||||||
 | 
					
 | 
				
			||||||
                    trackEvent('demo', {
 | 
					                    trackEvent('demo-start');
 | 
				
			||||||
                        props: {
 | 
					 | 
				
			||||||
                            eventType: 'start',
 | 
					 | 
				
			||||||
                        },
 | 
					 | 
				
			||||||
                    });
 | 
					 | 
				
			||||||
                }}
 | 
					                }}
 | 
				
			||||||
            />
 | 
					            />
 | 
				
			||||||
            <DemoDialogFinish
 | 
					            <DemoDialogFinish
 | 
				
			||||||
@ -135,11 +123,7 @@ export const Demo = ({ children }: IDemoProps): JSX.Element => {
 | 
				
			|||||||
                    setFinishOpen(false);
 | 
					                    setFinishOpen(false);
 | 
				
			||||||
                    onStart();
 | 
					                    onStart();
 | 
				
			||||||
 | 
					
 | 
				
			||||||
                    trackEvent('demo', {
 | 
					                    trackEvent('demo-restart');
 | 
				
			||||||
                        props: {
 | 
					 | 
				
			||||||
                            eventType: 'restart',
 | 
					 | 
				
			||||||
                        },
 | 
					 | 
				
			||||||
                    });
 | 
					 | 
				
			||||||
                }}
 | 
					                }}
 | 
				
			||||||
            />
 | 
					            />
 | 
				
			||||||
            <DemoDialogPlans
 | 
					            <DemoDialogPlans
 | 
				
			||||||
@ -158,10 +142,9 @@ export const Demo = ({ children }: IDemoProps): JSX.Element => {
 | 
				
			|||||||
                    setWelcomeOpen(false);
 | 
					                    setWelcomeOpen(false);
 | 
				
			||||||
                    setPlansOpen(false);
 | 
					                    setPlansOpen(false);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
                    trackEvent('demo', {
 | 
					                    trackEvent('demo-start-topic', {
 | 
				
			||||||
                        props: {
 | 
					                        props: {
 | 
				
			||||||
                            eventType: 'start_topic',
 | 
					                            topic: TOPICS[topic].title,
 | 
				
			||||||
                            step: TOPICS[topic].title,
 | 
					 | 
				
			||||||
                        },
 | 
					                        },
 | 
				
			||||||
                    });
 | 
					                    });
 | 
				
			||||||
                }}
 | 
					                }}
 | 
				
			||||||
@ -172,11 +155,7 @@ export const Demo = ({ children }: IDemoProps): JSX.Element => {
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
                    setWelcomeOpen(true);
 | 
					                    setWelcomeOpen(true);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
                    trackEvent('demo', {
 | 
					                    trackEvent('demo-view-demo-link');
 | 
				
			||||||
                        props: {
 | 
					 | 
				
			||||||
                            eventType: 'view_demo_link',
 | 
					 | 
				
			||||||
                        },
 | 
					 | 
				
			||||||
                    });
 | 
					 | 
				
			||||||
                }}
 | 
					                }}
 | 
				
			||||||
            />
 | 
					            />
 | 
				
			||||||
            <DemoSteps
 | 
					            <DemoSteps
 | 
				
			||||||
 | 
				
			|||||||
@ -47,11 +47,7 @@ export const DemoBanner = ({ onPlans }: IDemoBannerProps) => {
 | 
				
			|||||||
                target="_blank"
 | 
					                target="_blank"
 | 
				
			||||||
                rel="noreferrer"
 | 
					                rel="noreferrer"
 | 
				
			||||||
                onClick={() => {
 | 
					                onClick={() => {
 | 
				
			||||||
                    trackEvent('demo', {
 | 
					                    trackEvent('demo-ask-questions');
 | 
				
			||||||
                        props: {
 | 
					 | 
				
			||||||
                            eventType: 'ask_questions',
 | 
					 | 
				
			||||||
                        },
 | 
					 | 
				
			||||||
                    });
 | 
					 | 
				
			||||||
                }}
 | 
					                }}
 | 
				
			||||||
            >
 | 
					            >
 | 
				
			||||||
                Ask questions
 | 
					                Ask questions
 | 
				
			||||||
 | 
				
			|||||||
@ -79,9 +79,8 @@ export const DemoDialogPlans = ({ open, onClose }: IDemoDialogPlansProps) => {
 | 
				
			|||||||
                        target="_blank"
 | 
					                        target="_blank"
 | 
				
			||||||
                        rel="noreferrer"
 | 
					                        rel="noreferrer"
 | 
				
			||||||
                        onClick={() => {
 | 
					                        onClick={() => {
 | 
				
			||||||
                            trackEvent('demo', {
 | 
					                            trackEvent('demo-see-plan', {
 | 
				
			||||||
                                props: {
 | 
					                                props: {
 | 
				
			||||||
                                    eventType: 'see_plan',
 | 
					 | 
				
			||||||
                                    plan: 'open_source',
 | 
					                                    plan: 'open_source',
 | 
				
			||||||
                                },
 | 
					                                },
 | 
				
			||||||
                            });
 | 
					                            });
 | 
				
			||||||
@ -113,9 +112,8 @@ export const DemoDialogPlans = ({ open, onClose }: IDemoDialogPlansProps) => {
 | 
				
			|||||||
                        target="_blank"
 | 
					                        target="_blank"
 | 
				
			||||||
                        rel="noreferrer"
 | 
					                        rel="noreferrer"
 | 
				
			||||||
                        onClick={() => {
 | 
					                        onClick={() => {
 | 
				
			||||||
                            trackEvent('demo', {
 | 
					                            trackEvent('demo-see-plan', {
 | 
				
			||||||
                                props: {
 | 
					                                props: {
 | 
				
			||||||
                                    eventType: 'see_plan',
 | 
					 | 
				
			||||||
                                    plan: 'pro',
 | 
					                                    plan: 'pro',
 | 
				
			||||||
                                },
 | 
					                                },
 | 
				
			||||||
                            });
 | 
					                            });
 | 
				
			||||||
@ -145,9 +143,8 @@ export const DemoDialogPlans = ({ open, onClose }: IDemoDialogPlansProps) => {
 | 
				
			|||||||
                        target="_blank"
 | 
					                        target="_blank"
 | 
				
			||||||
                        rel="noreferrer"
 | 
					                        rel="noreferrer"
 | 
				
			||||||
                        onClick={() => {
 | 
					                        onClick={() => {
 | 
				
			||||||
                            trackEvent('demo', {
 | 
					                            trackEvent('demo-see-plan', {
 | 
				
			||||||
                                props: {
 | 
					                                props: {
 | 
				
			||||||
                                    eventType: 'see_plan',
 | 
					 | 
				
			||||||
                                    plan: 'enterprise',
 | 
					                                    plan: 'enterprise',
 | 
				
			||||||
                                },
 | 
					                                },
 | 
				
			||||||
                            });
 | 
					                            });
 | 
				
			||||||
@ -162,9 +159,8 @@ export const DemoDialogPlans = ({ open, onClose }: IDemoDialogPlansProps) => {
 | 
				
			|||||||
                target="_blank"
 | 
					                target="_blank"
 | 
				
			||||||
                rel="noreferrer"
 | 
					                rel="noreferrer"
 | 
				
			||||||
                onClick={() => {
 | 
					                onClick={() => {
 | 
				
			||||||
                    trackEvent('demo', {
 | 
					                    trackEvent('demo-see-plan', {
 | 
				
			||||||
                        props: {
 | 
					                        props: {
 | 
				
			||||||
                            eventType: 'see_plan',
 | 
					 | 
				
			||||||
                            plan: 'compare_plans',
 | 
					                            plan: 'compare_plans',
 | 
				
			||||||
                        },
 | 
					                        },
 | 
				
			||||||
                    });
 | 
					                    });
 | 
				
			||||||
 | 
				
			|||||||
@ -83,11 +83,7 @@ export const DemoDialogWelcome = ({
 | 
				
			|||||||
                        target="_blank"
 | 
					                        target="_blank"
 | 
				
			||||||
                        rel="noreferrer"
 | 
					                        rel="noreferrer"
 | 
				
			||||||
                        onClick={() => {
 | 
					                        onClick={() => {
 | 
				
			||||||
                            trackEvent('demo', {
 | 
					                            trackEvent('demo-open-demo-web');
 | 
				
			||||||
                                props: {
 | 
					 | 
				
			||||||
                                    eventType: 'open_demo_web',
 | 
					 | 
				
			||||||
                                },
 | 
					 | 
				
			||||||
                            });
 | 
					 | 
				
			||||||
                        }}
 | 
					                        }}
 | 
				
			||||||
                    >
 | 
					                    >
 | 
				
			||||||
                        hello.unleash.run <Launch />
 | 
					                        hello.unleash.run <Launch />
 | 
				
			||||||
 | 
				
			|||||||
@ -61,9 +61,8 @@ export const DemoSteps = ({
 | 
				
			|||||||
        abortController.abort();
 | 
					        abortController.abort();
 | 
				
			||||||
        setTopicStep(-1);
 | 
					        setTopicStep(-1);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
        trackEvent('demo', {
 | 
					        trackEvent('demo-close', {
 | 
				
			||||||
            props: {
 | 
					            props: {
 | 
				
			||||||
                eventType: 'close',
 | 
					 | 
				
			||||||
                topic: topics[topic].title,
 | 
					                topic: topics[topic].title,
 | 
				
			||||||
                step: step + 1,
 | 
					                step: step + 1,
 | 
				
			||||||
            },
 | 
					            },
 | 
				
			||||||
 | 
				
			|||||||
@ -25,8 +25,18 @@ export type CustomEvents =
 | 
				
			|||||||
    | 'notifications'
 | 
					    | 'notifications'
 | 
				
			||||||
    | 'batch_operations'
 | 
					    | 'batch_operations'
 | 
				
			||||||
    | 'strategyTitle'
 | 
					    | 'strategyTitle'
 | 
				
			||||||
 | 
					    | 'default_strategy'
 | 
				
			||||||
    | 'demo'
 | 
					    | 'demo'
 | 
				
			||||||
    | 'default_strategy';
 | 
					    | 'demo-start'
 | 
				
			||||||
 | 
					    | 'demo-close'
 | 
				
			||||||
 | 
					    | 'demo-finish'
 | 
				
			||||||
 | 
					    | 'demo-see-plans'
 | 
				
			||||||
 | 
					    | 'demo-see-plan'
 | 
				
			||||||
 | 
					    | 'demo-restart'
 | 
				
			||||||
 | 
					    | 'demo-view-demo-link'
 | 
				
			||||||
 | 
					    | 'demo-start-topic'
 | 
				
			||||||
 | 
					    | 'demo-ask-questions'
 | 
				
			||||||
 | 
					    | 'demo-open-demo-web';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
export const usePlausibleTracker = () => {
 | 
					export const usePlausibleTracker = () => {
 | 
				
			||||||
    const plausible = useContext(PlausibleContext);
 | 
					    const plausible = useContext(PlausibleContext);
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
		Reference in New Issue
	
	Block a user