import { useContextSelector } from '@/hooks/useContextSelector';
import logWebUserEvent from '@/logging/logWebUserEvent';
import { ControlSliderKey } from '@/state/createV2Store';
import { CREATE_VERSION } from '@/utils/constants';

import CreateFormContext from '../v2/CreateFormContext';
import {
  getAllConditions,
  getCurrentAdvancedOptionsExpanded,
  getCurrentAudioInfluence,
  getCurrentExcludeStyles,
  getCurrentStyleInfluence,
  getCurrentWeirdness,
  setCurrentAdvancedOptionsExpanded,
  setCurrentAudioInfluence,
  setCurrentExcludeStyles,
  setCurrentStyleInfluence,
  setCurrentWeirdness,
} from '../v2/actions/currentModeSetters';
import resetSliders from '../v2/actions/resetSliders';
import { AdvancedOptions } from './AdvancedOptions';

const EMPTY_OBJECT = {};

export const AdvancedOptionsWrapper = () => {
  const setState = useContextSelector(CreateFormContext, (ctx) => ctx.setState);
  const model = useContextSelector(
    CreateFormContext,
    (ctx) => ctx.state.global.model
  );
  const isAdvancedOptionsExpanded = useContextSelector(
    CreateFormContext,
    (ctx) => getCurrentAdvancedOptionsExpanded(ctx.state) || false
  );
  const negativeTags = useContextSelector(CreateFormContext, (ctx) =>
    getCurrentExcludeStyles(ctx.state)
  );
  const weirdness = useContextSelector(CreateFormContext, (ctx) =>
    getCurrentWeirdness(ctx.state)
  );
  const styleInfluence = useContextSelector(CreateFormContext, (ctx) =>
    getCurrentStyleInfluence(ctx.state)
  );
  const audioInfluence = useContextSelector(CreateFormContext, (ctx) =>
    getCurrentAudioInfluence(ctx.state)
  );
  const conditions = useContextSelector(
    CreateFormContext,
    (ctx) => getAllConditions(ctx.state) || EMPTY_OBJECT
  );

  return (
    <AdvancedOptions
      withExcludeStyles
      isOpen={isAdvancedOptionsExpanded}
      onOpenChange={(isOpen: boolean) => {
        setState(setCurrentAdvancedOptionsExpanded(isOpen));
      }}
      negativeTags={negativeTags}
      onChangeNegativeTags={(negativeTags: string) =>
        setState(setCurrentExcludeStyles(negativeTags))
      }
      sliders={{
        weirdness_constraint: weirdness,
        style_weight: styleInfluence,
        audio_weight: audioInfluence,
      }}
      onSliderValueChanged={(
        sliderKey: ControlSliderKey,
        sliderValue: number
      ) => {
        if (sliderKey === 'style_weight') {
          setState(setCurrentStyleInfluence(sliderValue));
        } else if (sliderKey === 'audio_weight') {
          setState(setCurrentAudioInfluence(sliderValue));
        } else if (sliderKey === 'weirdness_constraint') {
          setState(setCurrentWeirdness(sliderValue));
        }
      }}
      onResetSliders={() => {
        setState(resetSliders);
        logWebUserEvent({
          actionName: 'ResetControlSliders',
          context: {
            createVersion: CREATE_VERSION,
          },
        });
      }}
      hasAudioCondition={!!Object.keys(conditions).length}
      modelName={model}
    />
  );
};