Having issue cleaning listener with EventsOn's abortsignal function in useeffect

[ManabBala]

Description

Having issue cleaning listener.

  // Setup the event listener
  useEffect(() => {
    console.log("Mounting GaEventsListener");
    // Set up the event listener with EventsOn
    const cancelGaEventListener = EventsOn(
      "GaEventsListen",
      handleGaEventsListen,
    );

    // Cleanup function to remove the event listener on unmount
    return () => {
      console.log("Unmounting GaEventsListener");
      if (typeof cancelGaEventListener === "function") {
        cancelGaEventListener(); // Cancel the listener using the function returned by EventsOn
      }
    };
  }, []); // No dependencies to avoid infinite loop

normally works fine. but if I navigate back(either with context menu or useNavigate hook) error occur. which i believe wails internal "event.js" error as it fails to kill the event listener.

react-dom.development.js:22878 
Uncaught TypeError: Cannot read properties of undefined (reading 'filter')
  at listenerOff (events.js:209:49)
  at events.js:62:1
  at Playground.jsx:143:9
  at safelyCallDestroy (react-dom.development.js:22971:5)
  at commitHookEffectListUnmount (react-dom.development.js:23139:11)
  at commitPassiveUnmountInsideDeletedTreeOnFiber (react-dom.development.js:25137:11)
  at commitPassiveUnmountEffectsInsideOfDeletedTree_begin (react-dom.development.js:25087:5)
  at commitPassiveUnmountEffects_begin (react-dom.development.js:24995:11)
  at commitPassiveUnmountEffects (react-dom.development.js:24980:3)
  at flushPassiveEffectsImpl (react-dom.development.js:27077:3)

Then if i refresh and re-enter into the page then i have two event listener as my callback func triggers twice.
I event tried to use "EventsOff" explicitly before setting a "EventsOn" but that goes to vain.
Am I implementing the navigation right with hash router and useNavigate?

my router setup:

import React from "react";
import ReactDOM from "react-dom/client";
import { RouterProvider, createHashRouter } from "react-router-dom";
import "./index.css";

import Dashboard from "./pages/Dashboard";
import Playground from "./pages/Playground/Playground";
import Login from "./pages/Login/Login";
import { usePaymentSync } from "./hooks/usePaymentSync";
import { useAuthSync } from "./hooks/useAuthSync";

// Define the routes using createHashRouter
const router = createHashRouter([
  {
    path: "/",
    element: <Dashboard />,
  },
  {
    path: "/playground",
    element: <Playground />,
  },
  {
    path: "/login",
    element: <Login />,
  },
]);

const App = () => {
  useAuthSync(); // Sync auth state on app start
  usePaymentSync(); // Sync payment state on app start

  return <RouterProvider router={router} />;
};

ReactDOM.createRoot(document.getElementById("root")).render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
);

To Reproduce

1. navigate to the route
2. setup event listener with useEffect with no dependency
3. navigate back to new route
4. See console log for error
5. navigate back to event page
6. now the callback function inside the EventsOn would run twice

Expected behaviour

event listener should be termination when useEffect cancel function run. Or if I explicitly call EventsOff before calling EventsOn the previous events should not exist.

Screenshots

No response

Attempted Fixes

No response

System Details

# Wails
Version | v2.9.1

# System
┌──────────────────────────────────────────────────────────────────────────────────────────────┐
| OS           | Windows 10 Pro                           
                                     |
| Version      | 2009 (Build: 22631)                      
                                     |
| ID           | 23H2                                     
                                     |
| Go Version   | go1.23.0                                 
                                     |
| Platform     | windows                                  
                                     |
| Architecture | amd64                                    
                                     |
| CPU          | AMD Ryzen 5 5600G with Radeon Graphics                                        |
| GPU          | AMD Radeon(TM) Graphics (Advanced Micro Devices, Inc.) - Driver: 31.0.14046.0 |
| Memory       | 24GB                                     
                                     |
└──────────────────────────────────────────────────────────────────────────────────────────────┘

# Dependencies
┌───────────────────────────────────────────────────────┐ 
| Dependency | Package Name | Status    | Version       | 
| WebView2   | N/A          | Installed | 129.0.2792.65 | 
| Nodejs     | N/A          | Installed | 22.4.0        | 
| npm        | N/A          | Installed | 10.2.5        | 
| *upx       | N/A          | Available |               | 
| *nsis      | N/A          | Available |               | 
└─────────────── * - Optional Dependency ───────────────┘

Additional context

No response