import { useMemo } from 'react';
import { SINGLE_INTERACTION_WIDGET_KINDS } from '@livelike/javascript';
import { widgetStore } from '../store';
import { WidgetUIPhase } from '../types';
import { useSelectedFieldStore } from './useSelectedFieldStore';
import { useWidgetUIPhase } from './useWidgetUIPhase';

export type UseIsWidgetDisabledArg = {
  widgetId: string;
};

export const useIsWidgetDisabled = ({ widgetId }: UseIsWidgetDisabledArg) => {
  const widgetUIPhase = useWidgetUIPhase({ widgetId });

  const widgetKind = useSelectedFieldStore(
    widgetStore,
    () => widgetStore.get()[widgetId]?.widgetPayload?.kind
  );

  return useMemo(() => {
    // disable widget if widget interaction is exprired or is in submitting phase
    const isSubmitting = widgetUIPhase === WidgetUIPhase.SUBMITTING;
    const isExpired = widgetUIPhase === WidgetUIPhase.EXPIRED;
    const isFollowUpPublished =
      widgetUIPhase === WidgetUIPhase.FOLLOW_UP_PUBLISHED;
    if (isSubmitting || isExpired || isFollowUpPublished) {
      return true;
    }

    // disable widget if widget interaction is already submitted for one time interactable widgets
    const isSubmitted = widgetUIPhase === WidgetUIPhase.SUBMITTED;
    if (isSubmitted && SINGLE_INTERACTION_WIDGET_KINDS.includes(widgetKind)) {
      return true;
    }

    // disable widget if widget interactivity is timed out
    if (widgetUIPhase === WidgetUIPhase.INTERACTIVE_TIMED_OUT) {
      return true;
    }
    return false;
  }, [widgetUIPhase, widgetKind]);
};