Skip to content

Commit 27ca9e8

Browse files
Merge pull request #2989 from pilhuhn/RHOAIENG-9230
RHOAIENG-9230 Restructure InitSegment
2 parents cb6e509 + c0e643c commit 27ca9e8

File tree

3 files changed

+90
-86
lines changed

3 files changed

+90
-86
lines changed
Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
export const initSegment = async (props: {
2+
segmentKey: string;
3+
enabled: boolean;
4+
}): Promise<void> => {
5+
const { segmentKey, enabled } = props;
6+
const analytics = (window.analytics = window.analytics || []);
7+
if (analytics.initialize) {
8+
return;
9+
}
10+
if (analytics.invoked) {
11+
/* eslint-disable-next-line no-console */
12+
console.error('Segment snippet included twice.');
13+
} else {
14+
analytics.invoked = true;
15+
analytics.methods = [
16+
'trackSubmit',
17+
'trackClick',
18+
'trackLink',
19+
'trackForm',
20+
'pageview',
21+
'identify',
22+
'reset',
23+
'group',
24+
'track',
25+
'ready',
26+
'alias',
27+
'debug',
28+
'page',
29+
'once',
30+
'off',
31+
'on',
32+
'addSourceMiddleware',
33+
'addIntegrationMiddleware',
34+
'setAnonymousId',
35+
'addDestinationMiddleware',
36+
];
37+
analytics.factory =
38+
(e: string) =>
39+
(...t: unknown[]) => {
40+
t.unshift(e);
41+
analytics.push(t);
42+
return analytics;
43+
};
44+
for (let e = 0; e < analytics.methods.length; e++) {
45+
const key = analytics.methods[e];
46+
analytics[key] = analytics.factory(key);
47+
}
48+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
49+
analytics.load = (key: string, options: any) => {
50+
const t = document.createElement('script');
51+
t.type = 'text/javascript';
52+
t.async = true;
53+
t.src = `https://console.redhat.com/connections/cdn/analytics.js/v1/${encodeURIComponent(
54+
key,
55+
)}/analytics.min.js`;
56+
const n = document.getElementsByTagName('script')[0];
57+
if (n.parentNode) {
58+
n.parentNode.insertBefore(t, n);
59+
}
60+
analytics._loadOptions = options;
61+
};
62+
analytics.SNIPPET_VERSION = '4.13.1';
63+
if (segmentKey && enabled) {
64+
analytics.load(segmentKey, {
65+
integrations: {
66+
'Segment.io': {
67+
apiHost: 'console.redhat.com/connections/api/v1',
68+
protocol: 'https',
69+
},
70+
},
71+
});
72+
}
73+
}
74+
};

frontend/src/concepts/analyticsTracking/segmentIOUtils.tsx

Lines changed: 0 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -70,87 +70,3 @@ export const fireTrackingEvent = (
7070
}
7171
}
7272
};
73-
74-
export const initSegment = async (props: {
75-
segmentKey: string;
76-
username: string;
77-
enabled: boolean;
78-
}): Promise<void> => {
79-
const { segmentKey, username, enabled } = props;
80-
const analytics = (window.analytics = window.analytics || []);
81-
if (analytics.initialize) {
82-
return;
83-
}
84-
if (analytics.invoked) {
85-
/* eslint-disable-next-line no-console */
86-
console.error('Segment snippet included twice.');
87-
} else {
88-
analytics.invoked = true;
89-
analytics.methods = [
90-
'trackSubmit',
91-
'trackClick',
92-
'trackLink',
93-
'trackForm',
94-
'pageview',
95-
'identify',
96-
'reset',
97-
'group',
98-
'track',
99-
'ready',
100-
'alias',
101-
'debug',
102-
'page',
103-
'once',
104-
'off',
105-
'on',
106-
'addSourceMiddleware',
107-
'addIntegrationMiddleware',
108-
'setAnonymousId',
109-
'addDestinationMiddleware',
110-
];
111-
analytics.factory =
112-
(e: string) =>
113-
(...t: unknown[]) => {
114-
t.unshift(e);
115-
analytics.push(t);
116-
return analytics;
117-
};
118-
for (let e = 0; e < analytics.methods.length; e++) {
119-
const key = analytics.methods[e];
120-
analytics[key] = analytics.factory(key);
121-
}
122-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
123-
analytics.load = (key: string, options: any) => {
124-
const t = document.createElement('script');
125-
t.type = 'text/javascript';
126-
t.async = true;
127-
t.src = `https://console.redhat.com/connections/cdn/analytics.js/v1/${encodeURIComponent(
128-
key,
129-
)}/analytics.min.js`;
130-
const n = document.getElementsByTagName('script')[0];
131-
if (n.parentNode) {
132-
n.parentNode.insertBefore(t, n);
133-
}
134-
analytics._loadOptions = options;
135-
};
136-
analytics.SNIPPET_VERSION = '4.13.1';
137-
if (segmentKey && enabled) {
138-
analytics.load(segmentKey, {
139-
integrations: {
140-
'Segment.io': {
141-
apiHost: 'console.redhat.com/connections/api/v1',
142-
protocol: 'https',
143-
},
144-
},
145-
});
146-
}
147-
const anonymousIDBuffer = await crypto.subtle.digest(
148-
'SHA-1',
149-
new TextEncoder().encode(username),
150-
);
151-
const anonymousIDArray = Array.from(new Uint8Array(anonymousIDBuffer));
152-
const anonymousID = anonymousIDArray.map((b) => b.toString(16).padStart(2, '0')).join('');
153-
fireTrackingEvent('identify', { anonymousID });
154-
fireTrackingEvent('page');
155-
}
156-
};

frontend/src/concepts/analyticsTracking/useSegmentTracking.ts

Lines changed: 16 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
11
import React from 'react';
22
import { useAppContext } from '~/app/AppContext';
33
import { useAppSelector } from '~/redux/hooks';
4-
import { initSegment } from './segmentIOUtils';
4+
import { fireTrackingEvent } from './segmentIOUtils';
55
import { useWatchSegmentKey } from './useWatchSegmentKey';
6+
import { initSegment } from './initSegment';
67

78
export const useSegmentTracking = (): void => {
89
const { segmentKey, loaded, loadError } = useWatchSegmentKey();
@@ -12,11 +13,24 @@ export const useSegmentTracking = (): void => {
1213

1314
React.useEffect(() => {
1415
if (segmentKey && loaded && !loadError && username && clusterID) {
16+
const computeUserId = async () => {
17+
const anonymousIDBuffer = await crypto.subtle.digest(
18+
'SHA-1',
19+
new TextEncoder().encode(username),
20+
);
21+
const anonymousIDArray = Array.from(new Uint8Array(anonymousIDBuffer));
22+
return anonymousIDArray.map((b) => b.toString(16).padStart(2, '0')).join('');
23+
};
24+
1525
window.clusterID = clusterID;
1626
initSegment({
1727
segmentKey,
18-
username,
1928
enabled: !dashboardConfig.spec.dashboardConfig.disableTracking,
29+
}).then(() => {
30+
computeUserId().then((userId) => {
31+
fireTrackingEvent('identify', { anonymousID: userId });
32+
fireTrackingEvent('page');
33+
});
2034
});
2135
}
2236
}, [clusterID, loadError, loaded, segmentKey, username, dashboardConfig]);

0 commit comments

Comments
 (0)