On fast refresh realtime subscription created multiple time but never closed.

I'm using realtime subscription in a zustand store like this : ` import { Databases, Query } from "appwrite"; import { create } from "zustand"; import { DATABASE_ID } from "../models/database"; import { PLAYOUT_STATUS_COLLECTION_ID, PlayoutStatus } from "../models/playoutStatus"; import { Client } from "../utils/client";

const databases = new Databases(Client);

export const usePlayoutStatusStore = create<PlayoutStatusState>((set) => ({ [...] subscribeToRealtime: (containerId: string) => { set((state) => { if (state.realtimeSubscription) return state;

  const subscription = Client.subscribe(
    `databases.${DATABASE_ID}.collections.${PLAYOUT_STATUS_COLLECTION_ID}.documents`,
    (response) => {
      const events: string[] = response.events;
      const updatedStatus = response.payload as PlayoutStatus;

      if (updatedStatus.containerId !== containerId) return;

      if (events.some((evt) => evt.includes("create") || evt.includes("update"))) {
        set({ status: updatedStatus });
      }
      if (events.some((evt) => evt.includes("delete"))) {
        set({ status: null });
      }
    }
  );
  return { realtimeSubscription: subscription };
});

}, unsubscribeFromRealtime: () => { set((state) => { if (state.realtimeSubscription) { state.realtimeSubscription(); } return { realtimeSubscription: null }; }); } })); ` but when there multiple refresh in a short time it create multiple subscription for the same client and its impossible to close the old one without making a force restart of the appwrite-realtime via docker restart appwrite-realtime.

so there is orphan connection that can be seen in the dashboard. is there a way to solve this ?