PROVIDER · Wix App · wix/skills · Skills Docs

PROVIDER · Wix App · wix/skills · Skills Docs

import React, { createContext, useContext, useEffect } from 'react';

// No API is exposed — the context value is always `undefined`.
const PageOnLoadUtmCaptureContext = createContext<undefined>(undefined);
PageOnLoadUtmCaptureContext.displayName = 'PageOnLoadUtmCaptureContext';

// A hook is exported because the manifest's contextSpecifier.hook is required.
// It is intentionally not meant to be consumed by other components.
export function usePageOnLoadUtmCapture(): undefined {
  return useContext(PageOnLoadUtmCaptureContext);
}

export interface PageOnLoadUtmCaptureProps {
  children?: React.ReactNode;
}

export function PageOnLoadUtmCapture({
  children,
}: PageOnLoadUtmCaptureProps): React.ReactNode {
  useEffect(() => {
    // The requested side effect goes here. For async work, define and call an
    // inner async function — do not make the effect callback itself async.
    const run = async (): Promise<void> => {
      // e.g. send a BI / analytics event, read UTM params from the URL...
    };
    void run();
  }, []); // empty deps → runs once, on page render

  return (
    <PageOnLoadUtmCaptureContext.Provider value={undefined}>
      {children}
    </PageOnLoadUtmCaptureContext.Provider>
  );
}

PageOnLoadUtmCapture.displayName = 'PageOnLoadUtmCapture';
export default PageOnLoadUtmCapture;

// No exposed items and no inputs: both fields stay, empty (they are required).
context: { items: {} },
data: {},
resources: {
  client: {
    url: './extensions/site/contexts/page-on-load-utm-capture/page-on-load-utm-capture.tsx',
  },
  contextSpecifier: {
    // Required by the manifest even though nothing consumes it.
    hook: 'usePageOnLoadUtmCapture',
    moduleSpecifier: '<moduleSpecifierPrefix>page-on-load-utm-capture',
  },
},