@builder.io/sdk-react-native 0.0.1-67 → 0.0.1-68
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/package.json +1 -1
- package/src/components/render-content/render-content.js +15 -6
- package/src/functions/track.js +71 -2
- package/src/helpers/cookie.js +60 -0
- package/src/helpers/localStorage.js +35 -0
- package/src/helpers/nullable.js +5 -0
- package/src/helpers/sessionId.js +27 -0
- package/src/helpers/time.js +6 -0
- package/src/helpers/url.js +11 -0
- package/src/helpers/url.test.js +16 -0
- package/src/helpers/uuid.js +14 -0
- package/src/helpers/visitorId.js +34 -0
- package/src/types/can-track.js +1 -0
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@builder.io/sdk-react-native",
|
|
3
3
|
"description": "Builder.io SDK for React Native",
|
|
4
|
-
"version": "0.0.1-
|
|
4
|
+
"version": "0.0.1-68",
|
|
5
5
|
"main": "src/index.js",
|
|
6
6
|
"scripts": {
|
|
7
7
|
"release:dev": "npm version prerelease --no-git-tag-version && npm publish --tag dev --access public"
|
|
@@ -67,6 +67,9 @@ function RenderContent(props) {
|
|
|
67
67
|
}
|
|
68
68
|
const [overrideContent, setOverrideContent] = useState(() => null);
|
|
69
69
|
const [update, setUpdate] = useState(() => 0);
|
|
70
|
+
function canTrackToUse() {
|
|
71
|
+
return props.canTrack || true;
|
|
72
|
+
}
|
|
70
73
|
const [overrideState, setOverrideState] = useState(() => ({}));
|
|
71
74
|
function contentState() {
|
|
72
75
|
var _a2, _b2;
|
|
@@ -118,9 +121,12 @@ function RenderContent(props) {
|
|
|
118
121
|
return {};
|
|
119
122
|
}
|
|
120
123
|
function onClick(_event) {
|
|
121
|
-
if (useContent()
|
|
122
|
-
track(
|
|
123
|
-
|
|
124
|
+
if (useContent()) {
|
|
125
|
+
track({
|
|
126
|
+
type: "click",
|
|
127
|
+
canTrack: canTrackToUse(),
|
|
128
|
+
contentId: useContent().id,
|
|
129
|
+
orgId: props.apiKey
|
|
124
130
|
});
|
|
125
131
|
}
|
|
126
132
|
}
|
|
@@ -181,9 +187,12 @@ function RenderContent(props) {
|
|
|
181
187
|
window.addEventListener("message", processMessage);
|
|
182
188
|
window.addEventListener("builder:component:stateChangeListenerActivated", emitStateUpdate);
|
|
183
189
|
}
|
|
184
|
-
if (useContent()
|
|
185
|
-
track(
|
|
186
|
-
|
|
190
|
+
if (useContent()) {
|
|
191
|
+
track({
|
|
192
|
+
type: "impression",
|
|
193
|
+
canTrack: canTrackToUse(),
|
|
194
|
+
contentId: useContent().id,
|
|
195
|
+
orgId: props.apiKey
|
|
187
196
|
});
|
|
188
197
|
}
|
|
189
198
|
if (isPreviewing()) {
|
package/src/functions/track.js
CHANGED
|
@@ -1,8 +1,75 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __defProps = Object.defineProperties;
|
|
4
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
5
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
8
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
9
|
+
var __spreadValues = (a, b) => {
|
|
10
|
+
for (var prop in b || (b = {}))
|
|
11
|
+
if (__hasOwnProp.call(b, prop))
|
|
12
|
+
__defNormalProp(a, prop, b[prop]);
|
|
13
|
+
if (__getOwnPropSymbols)
|
|
14
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
15
|
+
if (__propIsEnum.call(b, prop))
|
|
16
|
+
__defNormalProp(a, prop, b[prop]);
|
|
17
|
+
}
|
|
18
|
+
return a;
|
|
19
|
+
};
|
|
20
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
21
|
+
var __objRest = (source, exclude) => {
|
|
22
|
+
var target = {};
|
|
23
|
+
for (var prop in source)
|
|
24
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
25
|
+
target[prop] = source[prop];
|
|
26
|
+
if (source != null && __getOwnPropSymbols)
|
|
27
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
28
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
29
|
+
target[prop] = source[prop];
|
|
30
|
+
}
|
|
31
|
+
return target;
|
|
32
|
+
};
|
|
2
33
|
import { TARGET } from "../constants/target.js";
|
|
34
|
+
import { getSessionId } from "../helpers/sessionId.js";
|
|
35
|
+
import { getVisitorId } from "../helpers/visitorId.js";
|
|
3
36
|
import { isBrowser } from "./is-browser.js";
|
|
4
37
|
import { isEditing } from "./is-editing.js";
|
|
5
|
-
|
|
38
|
+
const getTrackingEventData = ({ canTrack }) => {
|
|
39
|
+
if (!canTrack) {
|
|
40
|
+
return { visitorId: void 0, sessionId: void 0 };
|
|
41
|
+
}
|
|
42
|
+
const sessionId = getSessionId({ canTrack });
|
|
43
|
+
const visitorId = getVisitorId({ canTrack });
|
|
44
|
+
return {
|
|
45
|
+
sessionId,
|
|
46
|
+
visitorId
|
|
47
|
+
};
|
|
48
|
+
};
|
|
49
|
+
const createEvent = (_a) => {
|
|
50
|
+
var _b = _a, {
|
|
51
|
+
type: eventType,
|
|
52
|
+
canTrack,
|
|
53
|
+
orgId,
|
|
54
|
+
contentId
|
|
55
|
+
} = _b, properties = __objRest(_b, [
|
|
56
|
+
"type",
|
|
57
|
+
"canTrack",
|
|
58
|
+
"orgId",
|
|
59
|
+
"contentId"
|
|
60
|
+
]);
|
|
61
|
+
return {
|
|
62
|
+
type: eventType,
|
|
63
|
+
data: __spreadProps(__spreadValues(__spreadValues({}, properties), getTrackingEventData({ canTrack })), {
|
|
64
|
+
ownerId: orgId,
|
|
65
|
+
contentId
|
|
66
|
+
})
|
|
67
|
+
};
|
|
68
|
+
};
|
|
69
|
+
function track(eventProps) {
|
|
70
|
+
if (!eventProps.canTrack) {
|
|
71
|
+
return;
|
|
72
|
+
}
|
|
6
73
|
if (isEditing()) {
|
|
7
74
|
return;
|
|
8
75
|
}
|
|
@@ -11,7 +78,9 @@ function track(event, properties) {
|
|
|
11
78
|
}
|
|
12
79
|
return fetch(`https://builder.io/api/v1/track`, {
|
|
13
80
|
method: "POST",
|
|
14
|
-
body: JSON.stringify({
|
|
81
|
+
body: JSON.stringify({
|
|
82
|
+
events: [createEvent(eventProps)]
|
|
83
|
+
}),
|
|
15
84
|
headers: {
|
|
16
85
|
"content-type": "application/json"
|
|
17
86
|
},
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { isBrowser } from "../functions/is-browser";
|
|
3
|
+
import { getTopLevelDomain } from "./url";
|
|
4
|
+
const getCookie = ({
|
|
5
|
+
name,
|
|
6
|
+
canTrack
|
|
7
|
+
}) => {
|
|
8
|
+
var _a;
|
|
9
|
+
try {
|
|
10
|
+
if (!canTrack) {
|
|
11
|
+
return void 0;
|
|
12
|
+
}
|
|
13
|
+
return (_a = document.cookie.split("; ").find((row) => row.startsWith(`${name}=`))) == null ? void 0 : _a.split("=")[1];
|
|
14
|
+
} catch (err) {
|
|
15
|
+
console.debug("[COOKIE] GET error: ", err);
|
|
16
|
+
}
|
|
17
|
+
};
|
|
18
|
+
const stringifyCookie = (cookie) => cookie.map(([key, value]) => value ? `${key}=${value}` : key).join("; ");
|
|
19
|
+
const SECURE_CONFIG = [
|
|
20
|
+
["secure", ""],
|
|
21
|
+
["SameSite", "None"]
|
|
22
|
+
];
|
|
23
|
+
const createCookieString = ({
|
|
24
|
+
name,
|
|
25
|
+
value,
|
|
26
|
+
expires
|
|
27
|
+
}) => {
|
|
28
|
+
const secure = isBrowser() ? location.protocol === "https:" : true;
|
|
29
|
+
const secureObj = secure ? SECURE_CONFIG : [[]];
|
|
30
|
+
const expiresObj = expires ? [["expires", expires.toUTCString()]] : [[]];
|
|
31
|
+
const cookieValue = [
|
|
32
|
+
[name, value],
|
|
33
|
+
...expiresObj,
|
|
34
|
+
["path", "/"],
|
|
35
|
+
["domain", getTopLevelDomain(window.location.hostname)],
|
|
36
|
+
...secureObj
|
|
37
|
+
];
|
|
38
|
+
const cookie = stringifyCookie(cookieValue);
|
|
39
|
+
return cookie;
|
|
40
|
+
};
|
|
41
|
+
const setCookie = ({
|
|
42
|
+
name,
|
|
43
|
+
value,
|
|
44
|
+
expires,
|
|
45
|
+
canTrack
|
|
46
|
+
}) => {
|
|
47
|
+
try {
|
|
48
|
+
if (!canTrack) {
|
|
49
|
+
return void 0;
|
|
50
|
+
}
|
|
51
|
+
const cookie = createCookieString({ name, value, expires });
|
|
52
|
+
document.cookie = cookie;
|
|
53
|
+
} catch (err) {
|
|
54
|
+
console.warn("[COOKIE] SET error: ", err);
|
|
55
|
+
}
|
|
56
|
+
};
|
|
57
|
+
export {
|
|
58
|
+
getCookie,
|
|
59
|
+
setCookie
|
|
60
|
+
};
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { isBrowser } from "../functions/is-browser";
|
|
3
|
+
const getLocalStorage = () => isBrowser() && typeof localStorage !== "undefined" ? localStorage : void 0;
|
|
4
|
+
const getLocalStorageItem = ({
|
|
5
|
+
key,
|
|
6
|
+
canTrack
|
|
7
|
+
}) => {
|
|
8
|
+
var _a;
|
|
9
|
+
try {
|
|
10
|
+
if (canTrack) {
|
|
11
|
+
return (_a = getLocalStorage()) == null ? void 0 : _a.getItem(key);
|
|
12
|
+
}
|
|
13
|
+
return void 0;
|
|
14
|
+
} catch (err) {
|
|
15
|
+
console.debug("[LocalStorage] GET error: ", err);
|
|
16
|
+
}
|
|
17
|
+
};
|
|
18
|
+
const setLocalStorageItem = ({
|
|
19
|
+
key,
|
|
20
|
+
canTrack,
|
|
21
|
+
value
|
|
22
|
+
}) => {
|
|
23
|
+
var _a;
|
|
24
|
+
try {
|
|
25
|
+
if (canTrack) {
|
|
26
|
+
(_a = getLocalStorage()) == null ? void 0 : _a.setItem(key, value);
|
|
27
|
+
}
|
|
28
|
+
} catch (err) {
|
|
29
|
+
console.debug("[LocalStorage] SET error: ", err);
|
|
30
|
+
}
|
|
31
|
+
};
|
|
32
|
+
export {
|
|
33
|
+
getLocalStorageItem,
|
|
34
|
+
setLocalStorageItem
|
|
35
|
+
};
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { getCookie, setCookie } from "./cookie";
|
|
3
|
+
import { checkIsDefined } from "./nullable";
|
|
4
|
+
import { uuid } from "./uuid";
|
|
5
|
+
const SESSION_LOCAL_STORAGE_KEY = "builderSessionId";
|
|
6
|
+
const getSessionId = ({ canTrack }) => {
|
|
7
|
+
if (!canTrack) {
|
|
8
|
+
return void 0;
|
|
9
|
+
}
|
|
10
|
+
const sessionId = getCookie({ name: SESSION_LOCAL_STORAGE_KEY, canTrack });
|
|
11
|
+
if (checkIsDefined(sessionId)) {
|
|
12
|
+
return sessionId;
|
|
13
|
+
} else {
|
|
14
|
+
const newSessionId = createSessionId();
|
|
15
|
+
setSessionId({ id: newSessionId, canTrack });
|
|
16
|
+
}
|
|
17
|
+
};
|
|
18
|
+
const createSessionId = () => uuid();
|
|
19
|
+
const setSessionId = ({
|
|
20
|
+
id,
|
|
21
|
+
canTrack
|
|
22
|
+
}) => setCookie({ name: SESSION_LOCAL_STORAGE_KEY, value: id, canTrack });
|
|
23
|
+
export {
|
|
24
|
+
createSessionId,
|
|
25
|
+
getSessionId,
|
|
26
|
+
setSessionId
|
|
27
|
+
};
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { getTopLevelDomain } from "./url.js";
|
|
3
|
+
describe("getTopLevelDomain", () => {
|
|
4
|
+
test("handles root domain", () => {
|
|
5
|
+
const output = getTopLevelDomain("example.com");
|
|
6
|
+
expect(output).toBe("example.com");
|
|
7
|
+
});
|
|
8
|
+
test("handles subdomain", () => {
|
|
9
|
+
const output = getTopLevelDomain("wwww.example.com");
|
|
10
|
+
expect(output).toBe("example.com");
|
|
11
|
+
});
|
|
12
|
+
test("handles subdomain with long suffix", () => {
|
|
13
|
+
const output = getTopLevelDomain("www.example.co.uk");
|
|
14
|
+
expect(output).toBe("example.co.uk");
|
|
15
|
+
});
|
|
16
|
+
});
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
function uuidv4() {
|
|
3
|
+
return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function(c) {
|
|
4
|
+
const r = Math.random() * 16 | 0, v = c == "x" ? r : r & 3 | 8;
|
|
5
|
+
return v.toString(16);
|
|
6
|
+
});
|
|
7
|
+
}
|
|
8
|
+
function uuid() {
|
|
9
|
+
return uuidv4().replace(/-/g, "");
|
|
10
|
+
}
|
|
11
|
+
export {
|
|
12
|
+
uuid,
|
|
13
|
+
uuidv4
|
|
14
|
+
};
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { getLocalStorageItem, setLocalStorageItem } from "./localStorage";
|
|
3
|
+
import { checkIsDefined } from "./nullable";
|
|
4
|
+
import { uuid } from "./uuid";
|
|
5
|
+
const VISITOR_LOCAL_STORAGE_KEY = "builderVisitorId";
|
|
6
|
+
const getVisitorId = ({ canTrack }) => {
|
|
7
|
+
if (!canTrack) {
|
|
8
|
+
return void 0;
|
|
9
|
+
}
|
|
10
|
+
const visitorId = getLocalStorageItem({
|
|
11
|
+
key: VISITOR_LOCAL_STORAGE_KEY,
|
|
12
|
+
canTrack
|
|
13
|
+
});
|
|
14
|
+
if (checkIsDefined(visitorId)) {
|
|
15
|
+
return visitorId;
|
|
16
|
+
} else {
|
|
17
|
+
const newVisitorId = createVisitorId();
|
|
18
|
+
setVisitorId({ id: newVisitorId, canTrack });
|
|
19
|
+
}
|
|
20
|
+
};
|
|
21
|
+
const createVisitorId = () => uuid();
|
|
22
|
+
const setVisitorId = ({
|
|
23
|
+
id,
|
|
24
|
+
canTrack
|
|
25
|
+
}) => setLocalStorageItem({
|
|
26
|
+
key: VISITOR_LOCAL_STORAGE_KEY,
|
|
27
|
+
value: id,
|
|
28
|
+
canTrack
|
|
29
|
+
});
|
|
30
|
+
export {
|
|
31
|
+
createVisitorId,
|
|
32
|
+
getVisitorId,
|
|
33
|
+
setVisitorId
|
|
34
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import * as React from 'react';
|