import type { CSSProperties, ReactElement } from 'react';
import { SearchType, VariantType } from '../../types/search';
import { EmbeddedSearchH5 } from './EmbeddedSearchH5';
import { ExactSearchH5 } from './ExactSearchH5';
import { StandardSearchH5 } from './StandardSearchH5';
import type { ExactSearchH5Result } from './ExactSearchH5';
import type { StandardSearchH5Result } from './StandardSearchH5';
import type { MessageInfo } from 'tuikit-atomicx-react/chat';

export type SearchH5Result =
  | ExactSearchH5Result
  | StandardSearchH5Result
  | { type: 'chat_message'; data: MessageInfo };

export interface SearchH5Props {
  variant?: VariantType;
  debounceTime?: number;
  autoFocus?: boolean;
  enableLocalSearch?: boolean;
  className?: string;
  style?: CSSProperties;
  onKeywordChange?: (keyword: string) => void;
  onResultItemClick?: (result: SearchH5Result) => void;
  onBack?: () => void;
}

/**
 * Unified H5 Search entry — dispatches to Exact / Embedded / Standard.
 * Mirrors Vue3 `SearchNewH5.vue`. No Mini variant on H5.
 */
export function SearchNewH5({
  variant = VariantType.STANDARD,
  debounceTime,
  autoFocus = false,
  enableLocalSearch = true,
  className,
  style,
  onKeywordChange,
  onResultItemClick,
  onBack,
}: SearchH5Props): ReactElement | null {
  const handleEmbeddedResultItemClick = (message: MessageInfo, type: SearchType) => {
    if (type === SearchType.CHAT_MESSAGE) {
      onResultItemClick?.({ type: 'chat_message', data: message });
    }
  };

  switch (variant) {
    case VariantType.EXACT:
      return (
        <ExactSearchH5
          autoFocus={autoFocus}
          {...(className !== undefined && { className })}
          {...(style !== undefined && { style })}
          {...(onKeywordChange !== undefined && { onKeywordChange })}
          {...(onResultItemClick !== undefined && { onResultItemClick })}
        />
      );
    case VariantType.EMBEDDED:
      return (
        <EmbeddedSearchH5
          {...(debounceTime !== undefined && { debounceTime })}
          autoFocus={autoFocus}
          {...(className !== undefined && { className })}
          {...(style !== undefined && { style })}
          {...(onBack !== undefined && { onBack })}
          onResultItemClick={handleEmbeddedResultItemClick}
        />
      );
    case VariantType.STANDARD:
    default:
      return (
        <StandardSearchH5
          {...(debounceTime !== undefined && { debounceTime })}
          enableLocalSearch={enableLocalSearch}
          {...(className !== undefined && { className })}
          {...(style !== undefined && { style })}
          {...(onKeywordChange !== undefined && { onKeywordChange })}
          {...(onResultItemClick !== undefined && { onResultItemClick })}
          {...(onBack !== undefined && { onBack })}
        />
      );
  }
}

export default SearchNewH5;