import { SetupWidgetState, SetupWidgetConfig } from '@wix/bex-core';
import { useWixPatternsContainer } from '@wix/bex-core/react';
import { useEffect, useState } from 'react';

/**
 * Creates a {@link SetupWidgetState} instance and wires its lifecycle, then
 * returns it to be passed to the `SetupWidget` component — the same pattern as
 * `useCollection` → `CollectionState`.
 *
 * The widget owns loading / error / refetch; the returned state also exposes a
 * public API to read the steps / progress and to change a step's status
 * (`state.steps`, `state.getStep`, `state.setStepStatus`).
 *
 * @example
 * const setup = useSetupWidget({ fetchData });
 * return <SetupWidget state={setup} />;
 */
export const useSetupWidget = ({
  fetchData,
}: SetupWidgetConfig): SetupWidgetState => {
  const container = useWixPatternsContainer();
  const [state] = useState(
    () => new SetupWidgetState({ container, fetchData }),
  );

  useEffect(() => state.init(), [state]);

  return state;
};