-
-
Notifications
You must be signed in to change notification settings - Fork 656
/
usePlausibleTracker.ts
85 lines (81 loc) · 2.26 KB
/
usePlausibleTracker.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
import { useCallback, useContext } from 'react';
import { PlausibleContext } from 'contexts/PlausibleContext';
import type { EventOptions, PlausibleOptions } from 'plausible-tracker';
/**
* Allowed event names. Makes it easy to remove, since TS will complain.
* Add those to Plausible as Custom event goals.
* @see https://plausible.io/docs/custom-event-goals#2-create-a-custom-event-goal-in-your-plausible-analytics-account
* @example `'download | 'invite' | 'signup'`
**/
export type CustomEvents =
| 'invite'
| 'upgrade_plan_clicked'
| 'read_about'
| 'change_request'
| 'favorite'
| 'maintenance'
| 'banner'
| 'hidden_environment'
| 'project_overview'
| 'suggest_tags'
| 'unknown_ui_error'
| 'export_import'
| 'project_api_tokens'
| 'project_stickiness_set'
| 'notifications'
| 'batch_operations'
| 'strategyTitle'
| 'default_strategy'
| 'demo'
| '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'
| 'context-usage'
| 'segment-usage'
| 'strategy-add'
| 'playground'
| 'feature-type-edit'
| 'strategy-variants'
| 'search-filter-suggestions'
| 'project-metrics'
| 'open-integration'
| 'feature-naming-pattern'
| 'project-mode'
| 'dependent_features'
| 'playground_token_input_used'
| 'search-filter'
| 'search-feature-buttons'
| 'new-strategy-form'
| 'feedback'
| 'feature-metrics'
| 'search-bar'
| 'sdk-reporting'
| 'insights-share'
| 'sdk-banner';
export const usePlausibleTracker = () => {
const plausible = useContext(PlausibleContext);
const trackEvent = useCallback(
(
eventName: CustomEvents,
options?: EventOptions | undefined,
eventData?: PlausibleOptions | undefined,
) => {
if (plausible?.trackEvent) {
plausible.trackEvent(eventName, options, eventData);
} else {
if (options?.callback) {
options.callback();
}
}
},
[plausible],
);
return { trackEvent };
};