aboutsummaryrefslogtreecommitdiffstats
path: root/src/utils/providers/ackee-provider
diff options
context:
space:
mode:
Diffstat (limited to 'src/utils/providers/ackee-provider')
-rw-r--r--src/utils/providers/ackee-provider/ackee-provider.test.tsx46
-rw-r--r--src/utils/providers/ackee-provider/ackee-provider.tsx95
-rw-r--r--src/utils/providers/ackee-provider/index.ts1
3 files changed, 142 insertions, 0 deletions
diff --git a/src/utils/providers/ackee-provider/ackee-provider.test.tsx b/src/utils/providers/ackee-provider/ackee-provider.test.tsx
new file mode 100644
index 0000000..7ba11dc
--- /dev/null
+++ b/src/utils/providers/ackee-provider/ackee-provider.test.tsx
@@ -0,0 +1,46 @@
+import { describe, expect, it } from '@jest/globals';
+import { render, screen as rtlScreen } from '@testing-library/react';
+import { type FC, useContext } from 'react';
+import type { AckeeTrackerValue } from '../../../types';
+import { AckeeContext, AckeeProvider } from './ackee-provider';
+
+const bodyPrefix = 'Tracking is set to:';
+
+const ComponentTest: FC = () => {
+ const { tracking } = useContext(AckeeContext);
+
+ return (
+ <div>
+ {bodyPrefix} {tracking}
+ </div>
+ );
+};
+
+describe('AckeeProvider', () => {
+ it('uses the default value when the provider is not used', () => {
+ render(<ComponentTest />);
+
+ expect(rtlScreen.getByText(new RegExp(bodyPrefix))).toHaveTextContent(
+ `${bodyPrefix} full`
+ );
+ });
+
+ it('provides the given tracking value to its children', () => {
+ const tracking: AckeeTrackerValue = 'partial';
+
+ render(
+ <AckeeProvider
+ domainId="some-id"
+ server="https://example.com"
+ storageKey="facilis"
+ tracking={tracking}
+ >
+ <ComponentTest />
+ </AckeeProvider>
+ );
+
+ expect(rtlScreen.getByText(new RegExp(bodyPrefix))).toHaveTextContent(
+ `${bodyPrefix} ${tracking}`
+ );
+ });
+});
diff --git a/src/utils/providers/ackee-provider/ackee-provider.tsx b/src/utils/providers/ackee-provider/ackee-provider.tsx
new file mode 100644
index 0000000..8cd29cd
--- /dev/null
+++ b/src/utils/providers/ackee-provider/ackee-provider.tsx
@@ -0,0 +1,95 @@
+import { useRouter } from 'next/router';
+import {
+ type FC,
+ type ReactNode,
+ createContext,
+ type Dispatch,
+ type SetStateAction,
+ useMemo,
+} from 'react';
+import { useAckee } from 'use-ackee';
+import type { AckeeTrackerValue } from '../../../types';
+import { useLocalStorage } from '../../hooks';
+
+type AckeeContextProps = {
+ tracking: AckeeTrackerValue;
+ setTracking: Dispatch<SetStateAction<AckeeTrackerValue>>;
+};
+
+export const AckeeContext = createContext<AckeeContextProps>({
+ setTracking: (value) => value,
+ tracking: 'full',
+});
+
+const validator = (value: unknown): value is AckeeTrackerValue =>
+ value === 'full' || value === 'partial';
+
+export type AckeeProviderProps = {
+ /**
+ * The provider children.
+ */
+ children?: ReactNode;
+ /**
+ * The id given by Ackee for this domain.
+ */
+ domainId: string;
+ /**
+ * Should we track visits from localhost?
+ *
+ * @default false
+ */
+ isLocalhostTracked?: boolean;
+ /**
+ * Should we track our own visits?
+ *
+ * @default false
+ */
+ isOwnVisitsTracked?: boolean;
+ /**
+ * An URL that points to your Ackee installation (without trailing slash).
+ */
+ server: string;
+ /**
+ * The key to use in local storage.
+ */
+ storageKey: string;
+ /**
+ * Should the tracking be detailed (full) or not (partial)?
+ */
+ tracking: AckeeTrackerValue;
+};
+
+export const AckeeProvider: FC<AckeeProviderProps> = ({
+ children,
+ domainId,
+ isLocalhostTracked = false,
+ isOwnVisitsTracked = false,
+ server,
+ storageKey,
+ tracking: tracker,
+}) => {
+ const [tracking, setTracking] = useLocalStorage<AckeeTrackerValue>(
+ storageKey,
+ tracker,
+ validator
+ );
+ const { asPath } = useRouter();
+
+ useAckee(
+ asPath,
+ { domainId, server },
+ {
+ detailed: tracking === 'full',
+ ignoreLocalhost: !isLocalhostTracked,
+ ignoreOwnVisits: !isOwnVisitsTracked,
+ }
+ );
+
+ const value = useMemo(() => {
+ return { setTracking, tracking };
+ }, [setTracking, tracking]);
+
+ return (
+ <AckeeContext.Provider value={value}>{children}</AckeeContext.Provider>
+ );
+};
diff --git a/src/utils/providers/ackee-provider/index.ts b/src/utils/providers/ackee-provider/index.ts
new file mode 100644
index 0000000..10f7a26
--- /dev/null
+++ b/src/utils/providers/ackee-provider/index.ts
@@ -0,0 +1 @@
+export * from './ackee-provider';