Add events handling and enhance analytics tracking (#47)

* Add events handling and enhance analytics tracking

Added a new events system to track user actions throughout the application. Specific significant events such as user signup, sign-in, and checkout have dedicated handlers. Updated the analytics system to handle these event triggers and improved analytics reporting. An analytics provider has been implemented to manage event subscriptions and analytics event mappings.

* Remove unused dependencies from package.json files

Unused packages "@tanstack/react-table" and "next" have been removed from the packages/shared and tooling directories respectively. These changes help ensure that only needed packages are included in the project, reducing potential security risks and unnecessary processing overhead.

* Update dependencies

Multiple package versions were updated including "@tanstack/react-query" and "lucide-react"
This commit is contained in:
Giancarlo Buomprisco
2024-07-22 14:03:03 +08:00
committed by GitHub
parent 868f907c81
commit 5eefa7ff16
26 changed files with 477 additions and 168 deletions

View File

@@ -29,7 +29,7 @@
"@supabase/gotrue-js": "2.64.4",
"@supabase/ssr": "^0.4.0",
"@supabase/supabase-js": "^2.44.4",
"@tanstack/react-query": "5.51.9",
"@tanstack/react-query": "5.51.11",
"@types/react": "^18.3.3",
"next": "14.2.5",
"react": "18.3.1",

View File

@@ -4,6 +4,8 @@ import { useEffect } from 'react';
import { usePathname } from 'next/navigation';
import type { AuthChangeEvent, Session } from '@supabase/supabase-js';
import { useSupabase } from './use-supabase';
/**
@@ -14,15 +16,18 @@ const PRIVATE_PATH_PREFIXES = ['/home', '/admin', '/join', '/update-password'];
/**
* @name useAuthChangeListener
* @param privatePathPrefixes
* @param appHomePath
* @param privatePathPrefixes - A list of private path prefixes
* @param appHomePath - The path to redirect to when the user is signed out
* @param onEvent - Callback function to be called when an auth event occurs
*/
export function useAuthChangeListener({
privatePathPrefixes = PRIVATE_PATH_PREFIXES,
appHomePath,
onEvent,
}: {
appHomePath: string;
privatePathPrefixes?: string[];
onEvent?: (event: AuthChangeEvent, user: Session | null) => void;
}) {
const client = useSupabase();
const pathName = usePathname();
@@ -30,6 +35,10 @@ export function useAuthChangeListener({
useEffect(() => {
// keep this running for the whole session unless the component was unmounted
const listener = client.auth.onAuthStateChange((event, user) => {
if (onEvent) {
onEvent(event, user);
}
// log user out if user is falsy
// and if the current path is a private route
const shouldRedirectUser =
@@ -50,7 +59,7 @@ export function useAuthChangeListener({
// destroy listener on un-mounts
return () => listener.data.subscription.unsubscribe();
}, [client.auth, pathName, appHomePath, privatePathPrefixes]);
}, [client.auth, pathName, appHomePath, privatePathPrefixes, onEvent]);
}
/**