diff --git a/src/components/App.vue b/src/components/App.vue index 50a53a08..71a646be 100644 --- a/src/components/App.vue +++ b/src/components/App.vue @@ -187,5 +187,8 @@ onMounted(async () => { } else { isProjectFileLoaded.value = false; } + + // Google アナリティクスに page_view イベントを送信する + analytics.trackEvent("page_view"); }); diff --git a/src/composables/useAnalytics.ts b/src/composables/useAnalytics.ts index 057d2fbc..8b77069b 100644 --- a/src/composables/useAnalytics.ts +++ b/src/composables/useAnalytics.ts @@ -3,10 +3,7 @@ import ga4mp, { GA4Instance } from "@analytics-debugger/ga4mp"; const GA4_MEASUREMENT_ID = "G-TEMWCS6D7B"; const enabled = ref(false); -const ga4track: GA4Instance = ga4mp([GA4_MEASUREMENT_ID], { - debug: import.meta.env.DEV, - non_personalized_ads: true, -}); +let ga4instance: GA4Instance | null = null; /** * Google Analytics 4 を Electron で使うための composable @@ -27,7 +24,13 @@ export function useAnalytics() { eventParameters?: Record, ) => { if (!enabled.value) return; - ga4track.trackEvent(eventName, eventParameters); + if (ga4instance == null) { + ga4instance = ga4mp([GA4_MEASUREMENT_ID], { + debug: true, + non_personalized_ads: true, + }); + } + ga4instance.trackEvent(eventName, eventParameters); }; return { diff --git a/src/plugins/ipcMessageReceiverPlugin.ts b/src/plugins/ipcMessageReceiverPlugin.ts index 10408997..4cf3a256 100644 --- a/src/plugins/ipcMessageReceiverPlugin.ts +++ b/src/plugins/ipcMessageReceiverPlugin.ts @@ -41,8 +41,7 @@ export const ipcMessageReceiver: Plugin = { DETECT_RESIZED: debounce( (_, { width, height }: { width: number; height: number }) => { // window.dataLayer?.push({ event: "windowResize", width, height }); - const analytics = useAnalytics(); - analytics.trackEvent("windowResize", { width, height }); + useAnalytics().trackEvent("electron_window_resize", { width, height }); }, 300, ), diff --git a/src/store/setting.ts b/src/store/setting.ts index e89ad739..2e8378bd 100644 --- a/src/store/setting.ts +++ b/src/store/setting.ts @@ -257,17 +257,18 @@ export const settingStore = createPartialStore({ mutation(state, { acceptRetrieveTelemetry }) { state.acceptRetrieveTelemetry = acceptRetrieveTelemetry; }, - action({ mutations }, { acceptRetrieveTelemetry }) { + action({ state, mutations }, { acceptRetrieveTelemetry }) { /* window.dataLayer?.push({ event: "updateAcceptRetrieveTelemetry", acceptRetrieveTelemetry: acceptRetrieveTelemetry == "Accepted", }); */ - const analytics = useAnalytics(); - analytics.trackEvent("updateAcceptRetrieveTelemetry", { - acceptRetrieveTelemetry: acceptRetrieveTelemetry == "Accepted", - }); + if (acceptRetrieveTelemetry !== state.acceptRetrieveTelemetry) { + useAnalytics().trackEvent("update_accept_retrieve_telemetry", { + acceptRetrieveTelemetry: acceptRetrieveTelemetry == "Accepted", + }); + } void window.backend.setSetting( "acceptRetrieveTelemetry", acceptRetrieveTelemetry, @@ -280,17 +281,18 @@ export const settingStore = createPartialStore({ mutation(state, { acceptTerms }) { state.acceptTerms = acceptTerms; }, - action({ mutations }, { acceptTerms }) { + action({ state, mutations }, { acceptTerms }) { /* window.dataLayer?.push({ event: "updateAcceptTerms", acceptTerms: acceptTerms == "Accepted", }); */ - const analytics = useAnalytics(); - analytics.trackEvent("updateAcceptTerms", { - acceptTerms: acceptTerms == "Accepted", - }); + if (acceptTerms !== state.acceptTerms) { + useAnalytics().trackEvent("update_accept_terms", { + acceptTerms: acceptTerms == "Accepted", + }); + } void window.backend.setSetting("acceptTerms", acceptTerms); mutations.SET_ACCEPT_TERMS({ acceptTerms }); },