chore: replace monsido with siteimprove

src/components/analytics-siteimprove/index.tsx

@@ -0,0 +1,18 @@
+import { FC, useEffect } from 'react';
+
+const AnalyticsSiteImprove: FC = () => {
+  useEffect(() => {
+    const script = document.createElement('script');
+    script.src = 'https://siteimproveanalytics.com/js/siteanalyze_6255470.js';
+    script.async = true;
+
+    document.body.appendChild(script);
+    return () => {
+      document.body.removeChild(script);
+    };
+  }, []);
+
+  return null;
+};
+
+export default AnalyticsSiteImprove;

src/components/analytics-siteimprove/utils.ts

@@ -0,0 +1,28 @@
+export enum EventCategory {
+  DETAILS_PAGE = 'Details page'
+}
+
+export enum EventAction {
+  REQUEST_ACCESS = 'Request access'
+}
+
+type SiteImproveEventProps = {
+  category: EventCategory;
+  action: EventAction;
+  label?: string | undefined;
+};
+
+export const trackSiteImproveEvent =
+  ({ category, action, label }: SiteImproveEventProps) =>
+  () => {
+    if (window._sz === undefined) {
+      // eslint-disable-next-line no-console
+      console.error('Unable to find Site Improve event library.');
+    }
+
+    if (label) {
+      window._sz.push(['event', category, action, label]);
+    } else {
+      window._sz.push(['event', category, action]);
+    }
+  };

src/components/details-page/components/details-page/index.tsx

@@ -52,9 +52,10 @@ import withCommunity, {
 import Aside from '../aside';
 import { accessRequestWhiteList } from '../../../../white-list';
 import {
-  MonsidoTrackEventParams,
-  monsidoTrackButtonClickEvent
-} from '../../../analytics-monsido/utils/events';
+  EventAction,
+  EventCategory,
+  trackSiteImproveEvent
+} from '../../../analytics-siteimprove/utils';
 
 interface ExternalProps {
   entity: Entity;
@@ -328,9 +329,11 @@ const DetailsPage: FC<PropsWithChildren<Props>> = ({
               >
                 <Button
                   onClick={() =>
-                    monsidoTrackButtonClickEvent(
-                      MonsidoTrackEventParams.Action.Click.Button.AccessRequest
-                    )
+                    trackSiteImproveEvent({
+                      category: EventCategory.DETAILS_PAGE,
+                      action: EventAction.REQUEST_ACCESS,
+                      label: entityId
+                    })
                   }
                 >
                   {translations.detailsPage.requestDataButton}

src/entrypoints/main/bootstrap.tsx

@@ -16,7 +16,7 @@ import { getConfig } from '../../config';
 import { themeFDK, themeNAP } from '../../app/theme';
 import GlobalStyles from '../../app/styles';
 
-import AnalyticsMonsido from '../../components/analytics-monsido';
+import AnalyticsSiteImprove from '../../components/analytics-siteimprove';
 import { store } from '../../redux/store';
 
 const client = new ApolloClient({
@@ -31,7 +31,7 @@ render(
     <GlobalStyles />
     <AuthProvider>
       <LoggingProvider>
-        <AnalyticsMonsido />
+        <AnalyticsSiteImprove />
         <ApolloProvider client={client}>
           <Provider store={store}>
             <BrowserRouter>

src/entrypoints/publishing/app/index.tsx

@@ -10,12 +10,12 @@ import store from '../redux/store';
 import GlobalStyles from '../styles';
 import Router from '../router';
 
-import AnalyticsMonsido from '../../../components/analytics-monsido';
+import AnalyticsSiteImprove from '../../../components/analytics-siteimprove';
 
 const App: FC = () => (
   <ThemeProvider>
     <GlobalStyles />
-    <AnalyticsMonsido />
+    <AnalyticsSiteImprove />
     <TranslationsProvider>
       <ReduxProvider store={store}>
         <Router />

src/types/global.d.ts

@@ -1,12 +1,9 @@
-export declare global {
+export {};
+
+declare global {
   interface Window {
-    monsido_functions: {
-      trackEvent: (
-        category: string,
-        action: string,
-        event: string,
-        increaseBy: number
-      ) => string;
+    _sz: {
+      push: (event: [string, string, string, string?]) => void;
     };
   }
 }