@dcl/hooks 0.2.2 → 0.2.3-20251202134711.commit-88fc4d5

package/README.md

@@ -179,14 +179,17 @@ function MyComponent() {
 
 #### Using the usePageTracking Hook
 
-The `usePageTracking` hook automatically tracks page views based on route changes:
+The `usePageTracking` hook tracks page views when the pathname changes. You need to pass the current pathname as a parameter:
 
 ```typescript
 import { usePageTracking } from '@dcl/hooks'
 
 function MyPage() {
-  // Automatically tracks page view when route changes
-  usePageTracking()
+  // Get pathname from your router or window.location
+  const pathname = typeof window !== 'undefined' ? window.location.pathname : '/'
+  
+  // Tracks page view when pathname changes
+  usePageTracking(pathname)
 
   return (
     <div>
@@ -197,6 +200,20 @@ function MyPage() {
 }
 ```
 
+If you're using a router library, you can get the pathname from it:
+
+```typescript
+import { usePageTracking } from '@dcl/hooks'
+import { useLocation } from 'react-router-dom' // React Router example
+
+function MyPage() {
+  const location = useLocation()
+  usePageTracking(location.pathname)
+  
+  return <div>My Page</div>
+}
+```
+
 If you need to track additional page properties, you can use the `useAnalytics` hook directly:
 
 ```typescript
@@ -232,8 +249,11 @@ Here's a complete example showing how to use all analytics features together:
 import { AnalyticsProvider, useAnalytics, usePageTracking } from '@dcl/hooks'
 
 function MyPage() {
+  // Get pathname from your router or window.location
+  const pathname = typeof window !== 'undefined' ? window.location.pathname : '/'
+  
   // Track page views
-  usePageTracking()
+  usePageTracking(pathname)
 
   return (
     <div>
@@ -347,14 +367,17 @@ function MyComponent() {
 
 #### Using the usePageTracking Hook
 
-The `usePageTracking` hook automatically tracks page views based on route changes:
+The `usePageTracking` hook tracks page views when the pathname changes. You need to pass the current pathname as a parameter:
 
 ```typescript
 import { usePageTracking } from '@dcl/hooks'
 
 function MyPage() {
-  // Automatically tracks page view when route changes
-  usePageTracking()
+  // Get pathname from your router or window.location
+  const pathname = typeof window !== 'undefined' ? window.location.pathname : '/'
+  
+  // Tracks page view when pathname changes
+  usePageTracking(pathname)
 
   return (
     <div>
@@ -365,6 +388,20 @@ function MyPage() {
 }
 ```
 
+If you're using a router library, you can get the pathname from it:
+
+```typescript
+import { usePageTracking } from '@dcl/hooks'
+import { useLocation } from 'react-router-dom' // React Router example
+
+function MyPage() {
+  const location = useLocation()
+  usePageTracking(location.pathname)
+  
+  return <div>My Page</div>
+}
+```
+
 If you need to track additional page properties, you can use the `useAnalytics` hook directly:
 
 ```typescript
@@ -400,8 +437,11 @@ Here's a complete example showing how to use all analytics features together:
 import { AnalyticsProvider, useAnalytics, usePageTracking } from '@dcl/hooks'
 
 function MyPage() {
+  // Get pathname from your router or window.location
+  const pathname = typeof window !== 'undefined' ? window.location.pathname : '/'
+  
   // Track page views
-  usePageTracking()
+  usePageTracking(pathname)
 
   return (
     <div>

package/cjs/hooks/usePageTracking.d.ts

@@ -1,2 +1,2 @@
-declare const usePageTracking: () => void;
+declare const usePageTracking: (path: string) => void;
 export { usePageTracking };

package/cjs/hooks/usePageTracking.js

@@ -2,14 +2,12 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.usePageTracking = void 0;
 const react_1 = require("react");
-const react_router_1 = require("react-router");
 const useAnalytics_1 = require("./useAnalytics");
-const usePageTracking = () => {
-    const location = (0, react_router_1.useLocation)();
+const usePageTracking = (path) => {
     const { page } = (0, useAnalytics_1.useAnalytics)();
     (0, react_1.useEffect)(() => {
-        page(location.pathname);
-    }, [location, page]);
+        page(path);
+    }, [page]);
 };
 exports.usePageTracking = usePageTracking;
 //# sourceMappingURL=usePageTracking.js.map

package/cjs/hooks/usePageTracking.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePageTracking.js","sourceRoot":"","sources":["../../src/hooks/usePageTracking.ts"],"names":[],"mappings":";;;AAAA,iCAAiC;AACjC,+CAA0C;AAC1C,iDAA6C;AAE7C,MAAM,eAAe,GAAG,GAAG,EAAE;IAC3B,MAAM,QAAQ,GAAG,IAAA,0BAAW,GAAE,CAAA;IAC9B,MAAM,EAAE,IAAI,EAAE,GAAG,IAAA,2BAAY,GAAE,CAAA;IAE/B,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAA;IACzB,CAAC,EAAE,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC,CAAA;AACtB,CAAC,CAAA;AAEQ,0CAAe"}
+{"version":3,"file":"usePageTracking.js","sourceRoot":"","sources":["../../src/hooks/usePageTracking.ts"],"names":[],"mappings":";;;AAAA,iCAAiC;AACjC,iDAA6C;AAE7C,MAAM,eAAe,GAAG,CAAC,IAAY,EAAE,EAAE;IACvC,MAAM,EAAE,IAAI,EAAE,GAAG,IAAA,2BAAY,GAAE,CAAA;IAE/B,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,CAAC,IAAI,CAAC,CAAA;IACZ,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAA;AACZ,CAAC,CAAA;AAEQ,0CAAe"}

package/esm/hooks/usePageTracking.d.ts

@@ -1,2 +1,2 @@
-declare const usePageTracking: () => void;
+declare const usePageTracking: (path: string) => void;
 export { usePageTracking };

package/esm/hooks/usePageTracking.js

@@ -1,12 +1,10 @@
 import { useEffect } from "react";
-import { useLocation } from "react-router";
 import { useAnalytics } from "./useAnalytics";
-const usePageTracking = () => {
-    const location = useLocation();
+const usePageTracking = (path) => {
     const { page } = useAnalytics();
     useEffect(() => {
-        page(location.pathname);
-    }, [location, page]);
+        page(path);
+    }, [page]);
 };
 export { usePageTracking };
 //# sourceMappingURL=usePageTracking.js.map

package/esm/hooks/usePageTracking.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePageTracking.js","sourceRoot":"","sources":["../../src/hooks/usePageTracking.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACjC,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAC1C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAE7C,MAAM,eAAe,GAAG,GAAG,EAAE;IAC3B,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAA;IAC9B,MAAM,EAAE,IAAI,EAAE,GAAG,YAAY,EAAE,CAAA;IAE/B,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAA;IACzB,CAAC,EAAE,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC,CAAA;AACtB,CAAC,CAAA;AAED,OAAO,EAAE,eAAe,EAAE,CAAA"}
+{"version":3,"file":"usePageTracking.js","sourceRoot":"","sources":["../../src/hooks/usePageTracking.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACjC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAE7C,MAAM,eAAe,GAAG,CAAC,IAAY,EAAE,EAAE;IACvC,MAAM,EAAE,IAAI,EAAE,GAAG,YAAY,EAAE,CAAA;IAE/B,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,IAAI,CAAC,CAAA;IACZ,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAA;AACZ,CAAC,CAAA;AAED,OAAO,EAAE,eAAe,EAAE,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dcl/hooks",
-  "version": "0.2.2",
+  "version": "0.2.3-20251202134711.commit-88fc4d5",
   "main": "cjs/index.js",
   "module": "esm/index.js",
   "exports": {
@@ -57,7 +57,6 @@
     "@segment/analytics-next": "^1.79.0",
     "@sentry/browser": "^9.0.0",
     "isbot": "^5.1.25",
-    "react-router": "^7.4.0",
     "ua-parser-js": "^2.0.2"
   },
   "keywords": [
@@ -84,5 +83,5 @@
       "<rootDir>/test/setup.ts"
     ]
   },
-  "commit": "7882ecd8723c2aea5f7a684cdb3884f932ad67c9"
+  "commit": "88fc4d5bf161aa72f229fda449eb6eeb79c704b3"
 }