diff --git a/.changeset/strong-olives-collect.md b/.changeset/strong-olives-collect.md new file mode 100644 index 0000000000..b8ce8f2e8c --- /dev/null +++ b/.changeset/strong-olives-collect.md @@ -0,0 +1,5 @@ +--- +"saleor-dashboard": patch +--- + +Users are now properly anonymously identified diff --git a/src/auth/hooks/useAuthProvider.ts b/src/auth/hooks/useAuthProvider.ts index 93755c1446..ed11501672 100644 --- a/src/auth/hooks/useAuthProvider.ts +++ b/src/auth/hooks/useAuthProvider.ts @@ -1,6 +1,5 @@ import { ApolloClient, ApolloError } from "@apollo/client"; import { IMessageContext } from "@dashboard/components/messages"; -import { useAnalytics } from "@dashboard/components/ProductAnalytics/useAnalytics"; import { DEMO_MODE } from "@dashboard/config"; import { AccountErrorCode, useUserDetailsQuery } from "@dashboard/graphql"; import useLocalStorage from "@dashboard/hooks/useLocalStorage"; @@ -38,7 +37,6 @@ type AuthErrorCodes = `${AccountErrorCode}`; export function useAuthProvider({ intl, notify, apolloClient }: UseAuthProviderOpts): UserContext { const { login, getExternalAuthUrl, getExternalAccessToken, logout } = useAuth(); - const analytics = useAnalytics(); const navigate = useNavigator(); const { authenticated, authenticating, user } = useAuthState(); const [requestedExternalPluginId] = useLocalStorage("requestedExternalPluginId", null); @@ -85,8 +83,6 @@ export function useAuthProvider({ intl, notify, apolloClient }: UseAuthProviderO } }; const handleLogout = async () => { - analytics.reset(); - const returnTo = urlJoin(window.location.origin, getAppMountUriForRedirect()); const result = await logout({ input: JSON.stringify({ diff --git a/src/components/ProductAnalytics/useAnalytics.ts b/src/components/ProductAnalytics/useAnalytics.ts index 473aa1f37d..547d906377 100644 --- a/src/components/ProductAnalytics/useAnalytics.ts +++ b/src/components/ProductAnalytics/useAnalytics.ts @@ -1,27 +1,36 @@ +import useLocalStorage from "@dashboard/hooks/useLocalStorage"; import { usePostHog } from "posthog-js/react"; +interface UserProperties { + domain: string; + email_domain: string; +} + interface Analytics { - initialize: (details: Record) => void; - reset: () => void; + initialize: (userProperties: UserProperties) => void; trackEvent: (event: string, properties?: Record) => void; } export function useAnalytics(): Analytics { const posthog = usePostHog(); - - function initialize(details: Record) { - // According to docs, posthog can be briefly undefined + const [lastUserProperties, setLastUserProperties] = useLocalStorage( + "analyticsUserProperties", + { + domain: "", + email_domain: "", + }, + ); + + function initialize(userProperties: UserProperties) { if (!posthog) return; - const id = posthog.get_distinct_id(); + if (!hasUserPropertiesChanged(userProperties, lastUserProperties)) return; - posthog.identify(id, details); - } + const id = posthog.get_distinct_id(); - function reset() { - if (!posthog) return; + posthog.identify(id, userProperties); - posthog.reset(); + setLastUserProperties(userProperties); } function trackEvent(event: string, properties?: Record) { @@ -30,5 +39,15 @@ export function useAnalytics(): Analytics { posthog.capture(event, properties); } - return { initialize, reset, trackEvent }; + return { trackEvent, initialize }; +} + +function hasUserPropertiesChanged( + userProperties: UserProperties, + lastInitializedUserProperties: UserProperties, +) { + return ( + userProperties.domain !== lastInitializedUserProperties.domain || + userProperties.email_domain !== lastInitializedUserProperties.email_domain + ); }