@dotcms/analytics 0.0.1-alpha.58 → 0.0.1-alpha.60
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 +159 -0
- package/{index.mjs → index.js} +2 -2
- package/lib/dotAnalytics/{dot-content-analytics.mjs → dot-content-analytics.js} +1 -1
- package/lib/dotAnalytics/plugin/{dot-analytics.enricher.plugin.mjs → dot-analytics.enricher.plugin.js} +2 -2
- package/lib/dotAnalytics/plugin/{dot-analytics.plugin.mjs → dot-analytics.plugin.js} +1 -1
- package/lib/dotAnalytics/shared/{dot-content-analytics.http.mjs → dot-content-analytics.http.js} +1 -1
- package/lib/dotAnalytics/shared/{dot-content-analytics.utils.mjs → dot-content-analytics.utils.js} +4 -4
- package/lib/react/components/{DotContentAnalyticsProvider.mjs → DotContentAnalyticsProvider.js} +3 -3
- package/lib/react/hook/{useContentAnalytics.mjs → useContentAnalytics.js} +2 -2
- package/lib/react/hook/{useRouterTracker.mjs → useRouterTracker.js} +1 -1
- package/package.json +3 -3
- package/react/{index.mjs → index.js} +2 -2
- /package/lib/dotAnalytics/shared/{dot-content-analytics.constants.mjs → dot-content-analytics.constants.js} +0 -0
- /package/lib/react/contexts/{DotContentAnalyticsContext.mjs → DotContentAnalyticsContext.js} +0 -0
package/README.md
ADDED
|
@@ -0,0 +1,159 @@
|
|
|
1
|
+
# @dotcms/analytics
|
|
2
|
+
|
|
3
|
+
`@dotcms/analytics` is the official dotCMS JavaScript library for Content Analytics that helps track events and analytics in your webapps. Available for both browser and React applications.
|
|
4
|
+
|
|
5
|
+
## Features
|
|
6
|
+
|
|
7
|
+
- **Simple Browser Integration**: Easy to implement via script tags using IIFE implementation
|
|
8
|
+
- **React Support**: Built-in React components and hooks for seamless integration
|
|
9
|
+
- **Event Tracking**: Simple API to track custom events with additional properties
|
|
10
|
+
- **Automatic PageView**: Option to automatically track page views
|
|
11
|
+
- **Debug Mode**: Optional debug logging for development
|
|
12
|
+
|
|
13
|
+
## Installation
|
|
14
|
+
|
|
15
|
+
```bash
|
|
16
|
+
npm install @dotcms/analytics
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
Or include the script in your HTML page:
|
|
20
|
+
|
|
21
|
+
```html
|
|
22
|
+
<script src="ca.min.js"></script>
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
## React Integration
|
|
26
|
+
|
|
27
|
+
### Provider Setup
|
|
28
|
+
|
|
29
|
+
First, import the provider:
|
|
30
|
+
|
|
31
|
+
```tsx
|
|
32
|
+
import { DotContentAnalyticsProvider } from '@dotcms/analytics/react';
|
|
33
|
+
```
|
|
34
|
+
|
|
35
|
+
Wrap your application with the `DotContentAnalyticsProvider`:
|
|
36
|
+
|
|
37
|
+
```tsx
|
|
38
|
+
// Example configuration
|
|
39
|
+
const analyticsConfig = {
|
|
40
|
+
apiKey: 'your-api-key-from-dotcms-analytics-app',
|
|
41
|
+
server: 'https://your-dotcms-instance.com'
|
|
42
|
+
};
|
|
43
|
+
|
|
44
|
+
function App() {
|
|
45
|
+
return (
|
|
46
|
+
<DotContentAnalyticsProvider config={analyticsConfig}>
|
|
47
|
+
<YourApp />
|
|
48
|
+
</DotContentAnalyticsProvider>
|
|
49
|
+
);
|
|
50
|
+
}
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
### Tracking Custom Events
|
|
54
|
+
|
|
55
|
+
Use the `useContentAnalytics` hook to track custom events:
|
|
56
|
+
|
|
57
|
+
```tsx
|
|
58
|
+
import { useContentAnalytics } from '@dotcms/analytics/react';
|
|
59
|
+
|
|
60
|
+
function Activity({ title, urlTitle }) {
|
|
61
|
+
const { track } = useContentAnalytics();
|
|
62
|
+
|
|
63
|
+
// First parameter: custom event name to identify the action
|
|
64
|
+
// Second parameter: object with properties you want to track
|
|
65
|
+
|
|
66
|
+
return <button onClick={() => track('btn-click', { title, urlTitle })}>See Details →</button>;
|
|
67
|
+
}
|
|
68
|
+
```
|
|
69
|
+
|
|
70
|
+
### Manual Page View Tracking
|
|
71
|
+
|
|
72
|
+
To manually track page views, first disable automatic tracking in your config:
|
|
73
|
+
|
|
74
|
+
```tsx
|
|
75
|
+
const analyticsConfig = {
|
|
76
|
+
apiKey: 'your-api-key-from-dotcms-analytics-app',
|
|
77
|
+
server: 'https://your-dotcms-instance.com',
|
|
78
|
+
autoPageView: false // Disable automatic tracking
|
|
79
|
+
};
|
|
80
|
+
```
|
|
81
|
+
|
|
82
|
+
Then use the `useContentAnalytics` hook in your layout component:
|
|
83
|
+
|
|
84
|
+
```tsx
|
|
85
|
+
import { useContentAnalytics } from '@dotcms/analytics/react';
|
|
86
|
+
|
|
87
|
+
function Layout({ children }) {
|
|
88
|
+
const { pageView } = useContentAnalytics();
|
|
89
|
+
|
|
90
|
+
useEffect(() => {
|
|
91
|
+
pageView({
|
|
92
|
+
// Add any custom properties you want to track
|
|
93
|
+
myCustomValue: '2'
|
|
94
|
+
});
|
|
95
|
+
}, []);
|
|
96
|
+
|
|
97
|
+
return <div>{children}</div>;
|
|
98
|
+
}
|
|
99
|
+
```
|
|
100
|
+
|
|
101
|
+
## Browser Configuration
|
|
102
|
+
|
|
103
|
+
The script can be configured using data attributes:
|
|
104
|
+
|
|
105
|
+
- **data-analytics-server**: URL of the server where events will be sent. If not provided, the current domain will be used
|
|
106
|
+
- **data-analytics-debug**: Enables debug logging
|
|
107
|
+
- **data-analytics-auto-page-view**: Recommended for IIFE implementation. Enables automatic page view tracking
|
|
108
|
+
- **data-analytics-key**: **(Required)** API key for authentication
|
|
109
|
+
|
|
110
|
+
```html
|
|
111
|
+
<!-- Example configuration -->
|
|
112
|
+
<script
|
|
113
|
+
src="ca.min.js"
|
|
114
|
+
data-analytics-server="http://localhost:8080"
|
|
115
|
+
data-analytics-key="dev-key-123"
|
|
116
|
+
data-analytics-auto-page-view
|
|
117
|
+
data-analytics-debug></script>
|
|
118
|
+
|
|
119
|
+
<!-- Without automatic tracking - events must be sent manually -->
|
|
120
|
+
<script
|
|
121
|
+
src="ca.min.js"
|
|
122
|
+
data-analytics-server="http://localhost:8080"
|
|
123
|
+
data-analytics-debug
|
|
124
|
+
data-analytics-key="dev-key-123"></script>
|
|
125
|
+
```
|
|
126
|
+
|
|
127
|
+
## Roadmap
|
|
128
|
+
|
|
129
|
+
The following features are planned for future releases:
|
|
130
|
+
|
|
131
|
+
2. **Headless Support**
|
|
132
|
+
- Angular integration for event tracking
|
|
133
|
+
|
|
134
|
+
## Contributing
|
|
135
|
+
|
|
136
|
+
GitHub pull requests are the preferred method to contribute code to dotCMS. Before any pull requests can be accepted, an automated tool will ask you to agree to the [dotCMS Contributor's Agreement](https://gist.github.com/wezell/85ef45298c48494b90d92755b583acb3).
|
|
137
|
+
|
|
138
|
+
## Licensing
|
|
139
|
+
|
|
140
|
+
dotCMS comes in multiple editions and as such is dual licensed. The dotCMS Community Edition is licensed under the GPL 3.0 and is freely available for download, customization and deployment for use within organizations of all stripes. dotCMS Enterprise Editions (EE) adds a number of enterprise features and is available via a supported, indemnified commercial license from dotCMS. For the differences between the editions, see [the feature page](http://dotcms.com/cms-platform/features).
|
|
141
|
+
|
|
142
|
+
## Support
|
|
143
|
+
|
|
144
|
+
If you need help or have any questions, please [open an issue](https://github.com/dotCMS/core/issues/new/choose) in the GitHub repository.
|
|
145
|
+
|
|
146
|
+
## Documentation
|
|
147
|
+
|
|
148
|
+
Always refer to the official [DotCMS documentation](https://www.dotcms.com/docs/latest/) for comprehensive guides and API references.
|
|
149
|
+
|
|
150
|
+
## Getting Help
|
|
151
|
+
|
|
152
|
+
| Source | Location |
|
|
153
|
+
| --------------- | ------------------------------------------------------------------- |
|
|
154
|
+
| Installation | [Installation](https://dotcms.com/docs/latest/installation) |
|
|
155
|
+
| Documentation | [Documentation](https://dotcms.com/docs/latest/table-of-contents) |
|
|
156
|
+
| Videos | [Helpful Videos](http://dotcms.com/videos/) |
|
|
157
|
+
| Forums/Listserv | [via Google Groups](https://groups.google.com/forum/#!forum/dotCMS) |
|
|
158
|
+
| Twitter | @dotCMS |
|
|
159
|
+
| Main Site | [dotCMS.com](https://dotcms.com/) |
|
package/{index.mjs → index.js}
RENAMED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { DotContentAnalyticsProvider as e } from "./lib/react/components/DotContentAnalyticsProvider.
|
|
2
|
-
import { useContentAnalytics as r } from "./lib/react/hook/useContentAnalytics.
|
|
1
|
+
import { DotContentAnalyticsProvider as e } from "./lib/react/components/DotContentAnalyticsProvider.js";
|
|
2
|
+
import { useContentAnalytics as r } from "./lib/react/hook/useContentAnalytics.js";
|
|
3
3
|
export {
|
|
4
4
|
e as DotContentAnalyticsProvider,
|
|
5
5
|
r as useContentAnalytics
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { ANALYTICS_PAGEVIEW_EVENT as n, ANALYTICS_SOURCE_TYPE as r, EventType as o } from "../shared/dot-content-analytics.constants.
|
|
2
|
-
import { getBrowserEventData as i } from "../shared/dot-content-analytics.utils.
|
|
1
|
+
import { ANALYTICS_PAGEVIEW_EVENT as n, ANALYTICS_SOURCE_TYPE as r, EventType as o } from "../shared/dot-content-analytics.constants.js";
|
|
2
|
+
import { getBrowserEventData as i } from "../shared/dot-content-analytics.utils.js";
|
|
3
3
|
const p = {
|
|
4
4
|
name: "enrich-dot-analytics",
|
|
5
5
|
"page:dot-analytics": ({ payload: e }) => {
|
package/lib/dotAnalytics/shared/{dot-content-analytics.utils.mjs → dot-content-analytics.utils.js}
RENAMED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { EXPECTED_UTM_KEYS as a } from "./dot-content-analytics.constants.
|
|
3
|
-
import { dotAnalyticsEnricherPlugin as s } from "../plugin/dot-analytics.enricher.plugin.
|
|
4
|
-
import { dotAnalytics as c } from "../plugin/dot-analytics.plugin.
|
|
1
|
+
import i from "analytics";
|
|
2
|
+
import { EXPECTED_UTM_KEYS as a } from "./dot-content-analytics.constants.js";
|
|
3
|
+
import { dotAnalyticsEnricherPlugin as s } from "../plugin/dot-analytics.enricher.plugin.js";
|
|
4
|
+
import { dotAnalytics as c } from "../plugin/dot-analytics.plugin.js";
|
|
5
5
|
const h = (e) => ({
|
|
6
6
|
utc_time: (/* @__PURE__ */ new Date()).toISOString(),
|
|
7
7
|
local_tz_offset: (/* @__PURE__ */ new Date()).getTimezoneOffset(),
|
package/lib/react/components/{DotContentAnalyticsProvider.mjs → DotContentAnalyticsProvider.js}
RENAMED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { jsx as e } from "react/jsx-runtime";
|
|
2
2
|
import { useMemo as i } from "react";
|
|
3
|
-
import { initializeContentAnalytics as n } from "../../dotAnalytics/dot-content-analytics.
|
|
4
|
-
import a from "../contexts/DotContentAnalyticsContext.
|
|
5
|
-
import { useRouterTracker as m } from "../hook/useRouterTracker.
|
|
3
|
+
import { initializeContentAnalytics as n } from "../../dotAnalytics/dot-content-analytics.js";
|
|
4
|
+
import a from "../contexts/DotContentAnalyticsContext.js";
|
|
5
|
+
import { useRouterTracker as m } from "../hook/useRouterTracker.js";
|
|
6
6
|
const f = ({
|
|
7
7
|
children: r,
|
|
8
8
|
config: t
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { useContext as i, useRef as s } from "react";
|
|
2
|
-
import { isInsideEditor as r } from "../../dotAnalytics/shared/dot-content-analytics.utils.
|
|
3
|
-
import a from "../contexts/DotContentAnalyticsContext.
|
|
2
|
+
import { isInsideEditor as r } from "../../dotAnalytics/shared/dot-content-analytics.utils.js";
|
|
3
|
+
import a from "../contexts/DotContentAnalyticsContext.js";
|
|
4
4
|
const f = () => {
|
|
5
5
|
const t = i(a), o = s(null);
|
|
6
6
|
if (!t)
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { useRef as r, useEffect as i } from "react";
|
|
2
|
-
import { isInsideEditor as u } from "../../dotAnalytics/shared/dot-content-analytics.utils.
|
|
2
|
+
import { isInsideEditor as u } from "../../dotAnalytics/shared/dot-content-analytics.utils.js";
|
|
3
3
|
function s(t) {
|
|
4
4
|
const n = r(null);
|
|
5
5
|
i(() => {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dotcms/analytics",
|
|
3
|
-
"version": "0.0.1-alpha.
|
|
3
|
+
"version": "0.0.1-alpha.60",
|
|
4
4
|
"description": "Official JavaScript library for Content Analytics with DotCMS.",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -20,13 +20,13 @@
|
|
|
20
20
|
},
|
|
21
21
|
"homepage": "https://github.com/dotCMS/core/tree/main/core-web/libs/sdk/analytics/README.md",
|
|
22
22
|
"dependencies": {
|
|
23
|
-
"analytics": "^0.8.14"
|
|
24
|
-
"vite": "~5.0.0"
|
|
23
|
+
"analytics": "^0.8.14"
|
|
25
24
|
},
|
|
26
25
|
"peerDependencies": {
|
|
27
26
|
"react": "^18.2.0"
|
|
28
27
|
},
|
|
29
28
|
"devDependencies": {
|
|
29
|
+
"vite": "~5.0.0",
|
|
30
30
|
"@testing-library/jest-dom": "^6.1.6",
|
|
31
31
|
"@testing-library/react": "^14.0.0"
|
|
32
32
|
},
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { DotContentAnalyticsProvider as e } from "../lib/react/components/DotContentAnalyticsProvider.
|
|
2
|
-
import { useContentAnalytics as r } from "../lib/react/hook/useContentAnalytics.
|
|
1
|
+
import { DotContentAnalyticsProvider as e } from "../lib/react/components/DotContentAnalyticsProvider.js";
|
|
2
|
+
import { useContentAnalytics as r } from "../lib/react/hook/useContentAnalytics.js";
|
|
3
3
|
export {
|
|
4
4
|
e as DotContentAnalyticsProvider,
|
|
5
5
|
r as useContentAnalytics
|
|
File without changes
|
/package/lib/react/contexts/{DotContentAnalyticsContext.mjs → DotContentAnalyticsContext.js}
RENAMED
|
File without changes
|