Skip to content

Commit 0fd327e

Browse files
committed
cleanup props
1 parent 9f99c96 commit 0fd327e

File tree

8 files changed

+99
-141
lines changed

8 files changed

+99
-141
lines changed

apps/docs/content/docs/Integrations/gtm.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -421,7 +421,7 @@ Map GA4 events to Databuddy equivalents:
421421

422422
| GA4 Event | Databuddy Event | Notes |
423423
| ----------- | --------------- | ------------------------------- |
424-
| page_view | screen_view | Automatic with trackScreenViews |
424+
| page_view | screen_view | Automatic |
425425
| purchase | purchase | Enhanced with privacy features |
426426
| add_to_cart | add_to_cart | Same structure |
427427
| scroll | scroll_depth | Custom implementation |

apps/docs/content/docs/Integrations/nextjs.mdx

Lines changed: 11 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -37,9 +37,8 @@ export default function RootLayout({
3737
<body>
3838
<Databuddy
3939
clientId={process.env.NEXT_PUBLIC_DATABUDDY_CLIENT_ID!}
40-
trackScreenViews={true}
41-
trackHashChanges={true}
42-
trackAttributes={true}
40+
trackHashChanges
41+
trackAttributes
4342
/>
4443
{children}
4544
</body>
@@ -94,7 +93,6 @@ export default function RootLayout({
9493
<body>
9594
<Databuddy
9695
clientId={process.env.NEXT_PUBLIC_DATABUDDY_CLIENT_ID!}
97-
trackScreenViews={true}
9896
/>
9997
{children}
10098
<Analytics />
@@ -137,8 +135,7 @@ function MyApp({ Component, pageProps }: AppProps) {
137135
<>
138136
<Databuddy
139137
clientId={process.env.NEXT_PUBLIC_DATABUDDY_CLIENT_ID!}
140-
trackScreenViews={true}
141-
trackAttributes={true}
138+
trackAttributes
142139
/>
143140
<Component {...pageProps} />
144141
</>
@@ -163,7 +160,6 @@ export default function Document() {
163160
<script
164161
src="https://cdn.databuddy.cc/databuddy.js"
165162
data-client-id={process.env.NEXT_PUBLIC_DATABUDDY_CLIENT_ID}
166-
data-track-screen-views="true"
167163
async
168164
/>
169165
</Head>
@@ -292,21 +288,19 @@ export default function RootLayout({
292288
<Databuddy
293289
clientId={process.env.NEXT_PUBLIC_DATABUDDY_CLIENT_ID!}
294290
// Core tracking
295-
trackScreenViews={true}
296-
trackHashChanges={true}
297-
trackSessions={true}
291+
trackHashChanges
298292

299293
// Interaction tracking
300-
trackAttributes={true}
301-
trackOutgoingLinks={true}
302-
trackInteractions={true}
294+
trackAttributes
295+
trackOutgoingLinks
296+
trackInteractions
303297

304298
// Performance tracking
305-
trackPerformance={true}
306-
trackWebVitals={true}
299+
trackPerformance
300+
trackWebVitals
307301

308302
// Optimization
309-
enableBatching={true}
303+
enableBatching
310304
batchSize={10}
311305
batchTimeout={2000}
312306

@@ -339,8 +333,7 @@ export default function RootLayout({
339333
{process.env.NODE_ENV === 'production' && (
340334
<Databuddy
341335
clientId={process.env.NEXT_PUBLIC_DATABUDDY_CLIENT_ID!}
342-
trackScreenViews={true}
343-
trackAttributes={true}
336+
trackAttributes
344337
/>
345338
)}
346339
{children}

apps/docs/content/docs/Integrations/react.mdx

Lines changed: 63 additions & 82 deletions
Original file line numberDiff line numberDiff line change
@@ -33,9 +33,8 @@ function App() {
3333
return (
3434
<>
3535
<Databuddy
36-
clientId="YOUR_SITE_ID"
37-
trackScreenViews={true}
38-
trackAttributes={true}
36+
clientId="YOUR_CLIENT_ID"
37+
trackAttributes
3938
/>
4039
<YourAppContent />
4140
</>
@@ -167,30 +166,28 @@ function ProductCard({ product }) {
167166

168167
## Configuration Options
169168

170-
### Advanced Provider Setup
169+
### Advanced Configuration
171170

172171
```tsx
173-
import { DatabuddyProvider } from '@databuddy/react';
172+
import { Databuddy } from '@databuddy/sdk/react';
174173

175174
function App() {
176175
return (
177-
<DatabuddyProvider
178-
siteId="YOUR_SITE_ID"
179-
config={{
180-
trackScreenViews: true,
181-
trackHashChanges: true,
182-
trackAttributes: true,
183-
trackOutgoingLinks: true,
184-
trackPerformance: true,
185-
trackWebVitals: true,
186-
enableBatching: true,
187-
batchSize: 10,
188-
batchTimeout: 2000
189-
}}
190-
debug={process.env.NODE_ENV === 'development'}
191-
>
176+
<>
177+
<Databuddy
178+
clientId={process.env.REACT_APP_DATABUDDY_CLIENT_ID!}
179+
trackHashChanges
180+
trackAttributes
181+
trackOutgoingLinks
182+
trackPerformance
183+
trackWebVitals
184+
enableBatching
185+
batchSize={10}
186+
batchTimeout={2000}
187+
debug={process.env.NODE_ENV === 'development'}
188+
/>
192189
<YourAppContent />
193-
</DatabuddyProvider>
190+
</>
194191
);
195192
}
196193
```
@@ -221,12 +218,10 @@ function CallToAction() {
221218
Track form interactions and submissions:
222219

223220
```tsx
224-
import { useDatabuddy } from '@databuddy/react';
221+
import { track } from '@databuddy/sdk';
225222

226223
function ContactForm() {
227-
const { track } = useDatabuddy();
228-
229-
const handleSubmit = (e) => {
224+
const handleSubmit = (e: React.FormEvent) => {
230225
e.preventDefault();
231226
track('form_submit', {
232227
form_name: 'contact',
@@ -259,11 +254,10 @@ function ContactForm() {
259254
### Purchase Events
260255

261256
```tsx
262-
import { useDatabuddy } from '@databuddy/react';
257+
import { useEffect } from 'react';
258+
import { track } from '@databuddy/sdk';
263259

264260
function CheckoutSuccess({ order }) {
265-
const { track } = useDatabuddy();
266-
267261
useEffect(() => {
268262
track('purchase', {
269263
transaction_id: order.id,
@@ -277,7 +271,7 @@ function CheckoutSuccess({ order }) {
277271
price: item.price
278272
}))
279273
});
280-
}, [order, track]);
274+
}, [order]);
281275

282276
return <div>Thank you for your purchase!</div>;
283277
}
@@ -286,9 +280,9 @@ function CheckoutSuccess({ order }) {
286280
### Cart Events
287281

288282
```tsx
289-
function AddToCartButton({ product }) {
290-
const { track } = useDatabuddy();
283+
import { track } from '@databuddy/sdk';
291284

285+
function AddToCartButton({ product }) {
292286
const handleAddToCart = () => {
293287
track('add_to_cart', {
294288
currency: 'USD',
@@ -316,16 +310,14 @@ function AddToCartButton({ product }) {
316310
### Error Boundaries
317311

318312
```tsx
319-
import { useDatabuddy } from '@databuddy/react';
313+
import { track } from '@databuddy/sdk';
320314

321315
function ErrorBoundary({ children }) {
322-
const { track } = useDatabuddy();
323-
324316
const handleError = (error: Error, errorInfo: any) => {
325-
track('exception', {
326-
description: error.message,
327-
fatal: false,
328-
error_stack: error.stack,
317+
track('error', {
318+
message: error.message,
319+
error_type: 'react_error_boundary',
320+
stack: error.stack,
329321
component_stack: errorInfo.componentStack
330322
});
331323
};
@@ -346,11 +338,10 @@ function ErrorBoundary({ children }) {
346338
### Custom Performance Metrics
347339

348340
```tsx
349-
import { useDatabuddy } from '@databuddy/react';
341+
import { useEffect } from 'react';
342+
import { track } from '@databuddy/sdk';
350343

351344
function DataDashboard() {
352-
const { track } = useDatabuddy();
353-
354345
useEffect(() => {
355346
const startTime = performance.now();
356347

@@ -363,7 +354,7 @@ function DataDashboard() {
363354
data_size: 'large'
364355
});
365356
});
366-
}, [track]);
357+
}, []);
367358

368359
return <div>Dashboard content</div>;
369360
}
@@ -374,22 +365,9 @@ function DataDashboard() {
374365
### Type-Safe Event Tracking
375366

376367
```tsx
377-
import { useDatabuddy } from '@databuddy/react';
378-
379-
interface CustomEvents {
380-
button_click: {
381-
button_text: string;
382-
location: string;
383-
};
384-
form_submit: {
385-
form_name: string;
386-
form_location: string;
387-
};
388-
}
368+
import { track } from '@databuddy/sdk';
389369

390370
function TypedComponent() {
391-
const { track } = useDatabuddy<CustomEvents>();
392-
393371
const handleClick = () => {
394372
// TypeScript will ensure correct event properties
395373
track('button_click', {
@@ -407,49 +385,52 @@ function TypedComponent() {
407385
### 1. Environment-Based Configuration
408386

409387
```tsx
410-
const config = {
411-
siteId: process.env.REACT_APP_DATABUDDY_SITE_ID,
412-
debug: process.env.NODE_ENV === 'development',
413-
disabled: process.env.NODE_ENV === 'test'
414-
};
388+
<Databuddy
389+
clientId={process.env.REACT_APP_DATABUDDY_CLIENT_ID!}
390+
debug={process.env.NODE_ENV === 'development'}
391+
disabled={process.env.NODE_ENV === 'test'}
392+
/>
415393
```
416394

417-
### 2. Lazy Loading
395+
### 2. Conditional Loading
418396

419397
```tsx
420-
import { lazy, Suspense } from 'react';
421-
422-
const DatabuddyProvider = lazy(() => import('@databuddy/react'));
398+
import { Databuddy } from '@databuddy/sdk/react';
423399

424400
function App() {
401+
const shouldTrack = process.env.NODE_ENV === 'production';
402+
425403
return (
426-
<Suspense fallback={<div>Loading...</div>}>
427-
<DatabuddyProvider siteId="YOUR_SITE_ID">
428-
<YourAppContent />
429-
</DatabuddyProvider>
430-
</Suspense>
404+
<>
405+
{shouldTrack && (
406+
<Databuddy clientId={process.env.REACT_APP_DATABUDDY_CLIENT_ID!} />
407+
)}
408+
<YourAppContent />
409+
</>
431410
);
432411
}
433412
```
434413

435414
### 3. Custom Hook for Analytics
436415

437416
```tsx
438-
import { useDatabuddy } from '@databuddy/react';
417+
import { useCallback } from 'react';
418+
import { track } from '@databuddy/sdk';
439419

440420
export function useAnalytics() {
441-
const { track } = useDatabuddy();
421+
const trackButtonClick = useCallback((buttonText: string, location: string) => {
422+
track('button_click', { button_text: buttonText, location });
423+
}, []);
424+
425+
const trackPageView = useCallback((pageName: string, category?: string) => {
426+
track('screen_view', { screen_name: pageName, screen_class: category });
427+
}, []);
428+
429+
const trackError = useCallback((error: Error, context?: string) => {
430+
track('error', { message: error.message, error_type: 'custom', context });
431+
}, []);
442432

443-
return {
444-
trackButtonClick: (buttonText: string, location: string) =>
445-
track('button_click', { button_text: buttonText, location }),
446-
447-
trackPageView: (pageName: string, category?: string) =>
448-
track('screen_view', { screen_name: pageName, screen_class: category }),
449-
450-
trackError: (error: Error, context?: string) =>
451-
track('exception', { description: error.message, context })
452-
};
433+
return { trackButtonClick, trackPageView, trackError };
453434
}
454435
```
455436

0 commit comments

Comments
 (0)