@sessionlens/sdk 0.2.0 → 0.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +194 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -45,6 +45,103 @@ sessionLens.sessionLensIdentify({
|
|
|
45
45
|
sessionLens.sessionLensReset();
|
|
46
46
|
```
|
|
47
47
|
|
|
48
|
+
### Advanced Usage with Custom Configuration
|
|
49
|
+
|
|
50
|
+
```javascript
|
|
51
|
+
import sessionLens from '@sessionlens/sdk';
|
|
52
|
+
|
|
53
|
+
// Initialize with custom API configuration
|
|
54
|
+
await sessionLens.sessionLensInit({
|
|
55
|
+
sdk_key: 'your-sdk-key-here',
|
|
56
|
+
user_id: 'user123',
|
|
57
|
+
org_id: 'org456',
|
|
58
|
+
api_base_url: 'https://dev-api.sessionlens.com/v1', // Custom API base URL
|
|
59
|
+
endpoints: {
|
|
60
|
+
events: '/custom/events/ingest', // Custom events endpoint
|
|
61
|
+
identify: '/custom/user/identify', // Custom identify endpoint
|
|
62
|
+
reset: '/custom/session/reset', // Custom reset endpoint
|
|
63
|
+
validate: '/custom/org/validate' // Custom validation endpoint
|
|
64
|
+
},
|
|
65
|
+
debug: true
|
|
66
|
+
});
|
|
67
|
+
|
|
68
|
+
// Track events with rich properties
|
|
69
|
+
sessionLens.sessionLensTrack({
|
|
70
|
+
event_name: 'user_action',
|
|
71
|
+
properties: {
|
|
72
|
+
action_type: 'form_submit',
|
|
73
|
+
form_name: 'contact_form',
|
|
74
|
+
fields_completed: 5,
|
|
75
|
+
time_spent: 120, // seconds
|
|
76
|
+
user_segment: 'premium',
|
|
77
|
+
referrer: document.referrer,
|
|
78
|
+
user_agent: navigator.userAgent
|
|
79
|
+
},
|
|
80
|
+
timestamp: Date.now() // Optional: auto-generated if not provided
|
|
81
|
+
});
|
|
82
|
+
|
|
83
|
+
// Identify user with comprehensive properties
|
|
84
|
+
sessionLens.sessionLensIdentify({
|
|
85
|
+
user_id: 'user123',
|
|
86
|
+
properties: {
|
|
87
|
+
email: 'user@example.com',
|
|
88
|
+
name: 'John Doe',
|
|
89
|
+
plan: 'premium',
|
|
90
|
+
company: 'Acme Corp',
|
|
91
|
+
signup_date: '2024-01-15',
|
|
92
|
+
last_login: new Date().toISOString(),
|
|
93
|
+
preferences: {
|
|
94
|
+
theme: 'dark',
|
|
95
|
+
language: 'en',
|
|
96
|
+
notifications: true
|
|
97
|
+
}
|
|
98
|
+
}
|
|
99
|
+
});
|
|
100
|
+
```
|
|
101
|
+
|
|
102
|
+
### Environment-Specific Configuration
|
|
103
|
+
|
|
104
|
+
```javascript
|
|
105
|
+
import sessionLens from '@sessionlens/sdk';
|
|
106
|
+
|
|
107
|
+
// Determine environment
|
|
108
|
+
const environment = process.env.NODE_ENV || 'development';
|
|
109
|
+
|
|
110
|
+
// Environment-specific configuration
|
|
111
|
+
const configs = {
|
|
112
|
+
development: {
|
|
113
|
+
api_base_url: 'https://dev-api.sessionlens.com/v1',
|
|
114
|
+
debug: true
|
|
115
|
+
},
|
|
116
|
+
staging: {
|
|
117
|
+
api_base_url: 'https://staging-api.sessionlens.com/v1',
|
|
118
|
+
debug: true
|
|
119
|
+
},
|
|
120
|
+
production: {
|
|
121
|
+
api_base_url: 'https://api.sessionlens.com/v1',
|
|
122
|
+
debug: false
|
|
123
|
+
}
|
|
124
|
+
};
|
|
125
|
+
|
|
126
|
+
// Initialize with environment-specific config
|
|
127
|
+
await sessionLens.sessionLensInit({
|
|
128
|
+
sdk_key: 'your-sdk-key-here',
|
|
129
|
+
user_id: 'user123',
|
|
130
|
+
org_id: 'org456',
|
|
131
|
+
...configs[environment]
|
|
132
|
+
});
|
|
133
|
+
|
|
134
|
+
// Track environment info
|
|
135
|
+
sessionLens.sessionLensTrack({
|
|
136
|
+
event_name: 'app_initialized',
|
|
137
|
+
properties: {
|
|
138
|
+
environment: environment,
|
|
139
|
+
version: '1.0.0',
|
|
140
|
+
timestamp: Date.now()
|
|
141
|
+
}
|
|
142
|
+
});
|
|
143
|
+
```
|
|
144
|
+
|
|
48
145
|
### React Integration
|
|
49
146
|
|
|
50
147
|
```jsx
|
|
@@ -86,6 +183,103 @@ function App() {
|
|
|
86
183
|
}
|
|
87
184
|
```
|
|
88
185
|
|
|
186
|
+
### React Integration with Custom Configuration
|
|
187
|
+
|
|
188
|
+
```jsx
|
|
189
|
+
import React from 'react';
|
|
190
|
+
import { useSessionLens, useSessionLensTrack, useSessionLensIdentify } from '@sessionlens/sdk';
|
|
191
|
+
|
|
192
|
+
function App() {
|
|
193
|
+
// Environment-specific configuration
|
|
194
|
+
const environment = process.env.NODE_ENV || 'development';
|
|
195
|
+
|
|
196
|
+
const configs = {
|
|
197
|
+
development: {
|
|
198
|
+
api_base_url: 'https://dev-api.sessionlens.com/v1',
|
|
199
|
+
debug: true
|
|
200
|
+
},
|
|
201
|
+
staging: {
|
|
202
|
+
api_base_url: 'https://staging-api.sessionlens.com/v1',
|
|
203
|
+
debug: true
|
|
204
|
+
},
|
|
205
|
+
production: {
|
|
206
|
+
api_base_url: 'https://api.sessionlens.com/v1',
|
|
207
|
+
debug: false
|
|
208
|
+
}
|
|
209
|
+
};
|
|
210
|
+
|
|
211
|
+
// Initialize SDK with environment-specific config
|
|
212
|
+
useSessionLens({
|
|
213
|
+
sdk_key: 'your-sdk-key-here',
|
|
214
|
+
user_id: 'user123',
|
|
215
|
+
org_id: 'org456',
|
|
216
|
+
...configs[environment]
|
|
217
|
+
});
|
|
218
|
+
|
|
219
|
+
const track = useSessionLensTrack();
|
|
220
|
+
const identify = useSessionLensIdentify();
|
|
221
|
+
|
|
222
|
+
const handlePageView = () => {
|
|
223
|
+
track({
|
|
224
|
+
event_name: 'page_view',
|
|
225
|
+
properties: {
|
|
226
|
+
page: window.location.pathname,
|
|
227
|
+
referrer: document.referrer,
|
|
228
|
+
environment: environment,
|
|
229
|
+
timestamp: Date.now()
|
|
230
|
+
}
|
|
231
|
+
});
|
|
232
|
+
};
|
|
233
|
+
|
|
234
|
+
const handleUserAction = (action, details) => {
|
|
235
|
+
track({
|
|
236
|
+
event_name: 'user_action',
|
|
237
|
+
properties: {
|
|
238
|
+
action_type: action,
|
|
239
|
+
...details,
|
|
240
|
+
user_agent: navigator.userAgent,
|
|
241
|
+
screen_resolution: `${screen.width}x${screen.height}`
|
|
242
|
+
}
|
|
243
|
+
});
|
|
244
|
+
};
|
|
245
|
+
|
|
246
|
+
const handleUserLogin = (userData) => {
|
|
247
|
+
identify({
|
|
248
|
+
user_id: userData.id,
|
|
249
|
+
properties: {
|
|
250
|
+
email: userData.email,
|
|
251
|
+
name: userData.name,
|
|
252
|
+
login_method: userData.loginMethod,
|
|
253
|
+
last_login: new Date().toISOString(),
|
|
254
|
+
preferences: userData.preferences
|
|
255
|
+
}
|
|
256
|
+
});
|
|
257
|
+
};
|
|
258
|
+
|
|
259
|
+
// Track page view on component mount
|
|
260
|
+
React.useEffect(() => {
|
|
261
|
+
handlePageView();
|
|
262
|
+
}, []);
|
|
263
|
+
|
|
264
|
+
return (
|
|
265
|
+
<div>
|
|
266
|
+
<button onClick={() => handleUserAction('button_click', { button: 'header_cta' })}>
|
|
267
|
+
Track Event
|
|
268
|
+
</button>
|
|
269
|
+
<button onClick={() => handleUserLogin({
|
|
270
|
+
id: 'user123',
|
|
271
|
+
email: 'user@example.com',
|
|
272
|
+
name: 'John Doe',
|
|
273
|
+
loginMethod: 'email',
|
|
274
|
+
preferences: { theme: 'dark' }
|
|
275
|
+
})}>
|
|
276
|
+
Identify User
|
|
277
|
+
</button>
|
|
278
|
+
</div>
|
|
279
|
+
);
|
|
280
|
+
}
|
|
281
|
+
```
|
|
282
|
+
|
|
89
283
|
## Configuration
|
|
90
284
|
|
|
91
285
|
### Runtime Configuration
|