import { create } from 'zustand';

type State = {
  ref: React.MutableRefObject<HTMLDivElement> | null;
  statusId: string | null;
  hovered: boolean;
  actions: {
    openStatusHoverCard: (ref: React.MutableRefObject<HTMLDivElement>, statusId: string) => void;
    updateStatusHoverCard: () => void;
    closeStatusHoverCard: (force?: boolean) => void;
  };
}

const useStatusHoverCardStore = create<State>((set) => ({
  ref: null,
  statusId: null,
  hovered: false,
  actions: {
    openStatusHoverCard: (ref, statusId) => set({
      ref,
      statusId,
    }),
    updateStatusHoverCard: () => set({
      hovered: true,
    }),
    closeStatusHoverCard: (force = false) => set((state) => state.hovered && !force ? {} : {
      ref: null,
      statusId: null,
      hovered: false,
    }),
  },
}));

const useStatusHoverCardActions = () => useStatusHoverCardStore((state) => state.actions);

export { useStatusHoverCardStore, useStatusHoverCardActions };