app/hooks/useWorker.ts

"use client";

import { useState } from "react";

export interface MessageEventHandler {
    (event: MessageEvent): void;
}

export function useWorker(messageEventHandler: MessageEventHandler): Worker | any {
    // Create new worker once and never again
    const [worker] = useState(() => createWorker(messageEventHandler));

    return worker;
}


function createWorker(messageEventHandler: MessageEventHandler): Worker | null {
    if (typeof window === 'undefined') {
        // We're running in a non-browser environment (like the server side of Next.js)
        return null;
    }

    const worker = new Worker(new URL("../worker.js", import.meta.url), {
        type: "module",
    });

    worker.addEventListener("message", messageEventHandler);
    return worker;
}