Skip to content

Commit dabd648

Browse files
authored
Merge pull request #114 from ynmstudio/feature/update-app-to-angular-17
fix: update useOutboundClickListener()
2 parents a9de4f1 + 5a743ec commit dabd648

File tree

1 file changed

+40
-42
lines changed

1 file changed

+40
-42
lines changed

landingpage/src/providers/matomo/utils/useOutboundClickListener.tsx

Lines changed: 40 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -2,48 +2,46 @@ import { useOnDocument, $, useContext } from "@builder.io/qwik";
22
import MatomoContext from "../MatomoContext";
33

44
function useOutboundClickListener() {
5-
const { instance } = useContext(MatomoContext);
6-
7-
const handleOutboundClick = $((event: Event) => {
8-
// The target is not guaranteed to be a link, it could be a child element.
9-
// Look up the element's parent until the anchor element is found.
10-
const findLinkElement = (
11-
el: EventTarget | null
12-
): HTMLElement | null => {
13-
if (el instanceof HTMLAnchorElement && el.href) {
14-
return el;
15-
}
16-
if (el instanceof HTMLElement && el.parentElement) {
17-
return findLinkElement(el.parentElement);
18-
}
19-
return null;
20-
};
21-
22-
const target = findLinkElement(event.target);
23-
24-
if (!(target instanceof HTMLAnchorElement)) {
25-
return;
26-
}
27-
28-
const { href } = target;
29-
30-
// Check if the click target differs from the current hostname, meaning it's external
31-
if (
32-
/* @ts-ignore */
33-
!href.match(
34-
new RegExp(
35-
`^(http://www.|https://www.|http://|https://)+(${window.location.hostname})`
36-
)
37-
)
38-
) {
39-
instance?.trackLink({ href });
40-
}
41-
});
42-
43-
useOnDocument(
44-
"click",
45-
$((event) => handleOutboundClick(event))
46-
);
5+
const { matomo } = useContext(MatomoContext);
6+
7+
const handleOutboundClick = $((event: Event) => {
8+
// The target is not guaranteed to be a link, it could be a child element.
9+
// Look up the element's parent until the anchor element is found.
10+
const findLinkElement = (el: EventTarget | null): HTMLElement | null => {
11+
if (el instanceof HTMLAnchorElement && el.href) {
12+
return el;
13+
}
14+
if (el instanceof HTMLElement && el.parentElement) {
15+
return findLinkElement(el.parentElement);
16+
}
17+
return null;
18+
};
19+
20+
const target = findLinkElement(event.target);
21+
22+
if (!(target instanceof HTMLAnchorElement)) {
23+
return;
24+
}
25+
26+
const { href } = target;
27+
28+
// Check if the click target differs from the current hostname, meaning it's external
29+
if (
30+
/* @ts-ignore */
31+
!href.match(
32+
new RegExp(
33+
`^(http://www.|https://www.|http://|https://)+(${window.location.hostname})`,
34+
),
35+
)
36+
) {
37+
matomo?.trackLink({ href });
38+
}
39+
});
40+
41+
useOnDocument(
42+
"click",
43+
$((event) => handleOutboundClick(event)),
44+
);
4745
}
4846

4947
export default useOutboundClickListener;

0 commit comments

Comments
 (0)