import {
  ChangeDetectionStrategy,
  Component,
  computed,
  inject,
  input,
  output,
  ViewEncapsulation,
} from '@angular/core';
import { CheckboxFilterInput, FilterInput, FilterService } from '../../core';
import { InputType } from '../../types';
import { SwitchComponent } from '@isa/ui/switch';

/**
 * A switch button component for filtering that displays as a toggle switch.
 * Unlike the input-menu-button, this component renders directly without an overlay menu.
 * It's designed for simple boolean/single-option filters where a compact toggle is preferred.
 *
 * Features:
 * - Direct toggle interaction (no menu)
 * - Auto-commits on toggle
 * - Compact visual footprint
 * - Uses checkbox filter model internally
 *
 * @example
 * ```html
 * <filter-switch-menu-button
 *   [filterInput]="availabilityFilter"
 *   [icon]="'isaActionCheck'"
 *   (toggled)="handleFilterToggle()">
 * </filter-switch-menu-button>
 * ```
 */
@Component({
  selector: 'filter-switch-menu-button',
  templateUrl: './switch-menu-button.component.html',
  styleUrls: ['./switch-menu-button.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
  encapsulation: ViewEncapsulation.None,
  standalone: true,
  imports: [SwitchComponent],
  host: {
    '[class]': "['filter-switch-menu-button']",
  },
})
export class SwitchMenuButtonComponent {
  /** Filter service for managing filter state */
  #filter = inject(FilterService);

  /**
   * The filter input configuration used to render the switch.
   */
  filterInput = input.required<FilterInput>();

  /**
   * The icon name to display in the switch.
   */
  icon = input.required<string>();

  /**
   * Emits an event when the switch is toggled.
   */
  toggled = output<void>();

  /**
   * Computed property that retrieves the checkbox filter input from FilterService.
   * This component uses the checkbox model internally while rendering as a switch.
   */
  input = computed<CheckboxFilterInput>(() => {
    const filterInput = this.filterInput();
    const inputs = this.#filter.inputs();
    return inputs.find(
      (input) =>
        input.key === filterInput.key && input.type === InputType.Checkbox,
    ) as CheckboxFilterInput;
  });

  /**
   * Computed property that determines if the switch is checked.
   * For switch inputs, we consider it checked if there's at least one selected option.
   * Typically used with single-option checkbox filters.
   */
  checked = computed<boolean>(() => {
    const input = this.input();
    return input?.selected && input.selected.length > 0;
  });

  /**
   * Computed property that gets the first option from the checkbox input.
   * Switch inputs typically work with single-option checkbox configurations.
   */
  option = computed(() => {
    const input = this.input();
    return input?.options?.[0];
  });

  /**
   * Determines whether the current input state is the default state.
   */
  isDefaultInputState = computed(() => {
    const input = this.filterInput();
    return this.#filter.isDefaultFilterInput(input);
  });

  /**
   * Handles the switch toggle event.
   * When toggled, selects or deselects the first option in the checkbox filter.
   *
   * @param checked - The new checked state
   */
  onToggle(checked: boolean): void {
    const option = this.option();
    if (option) {
      this.#filter.setInputCheckboxOptionSelected(option, checked, {
        commit: true,
      });
    }
    this.toggled.emit();
  }
}
