import { Card, Flex } from "@phoenix/components";
import { CodeLanguageRadioGroup } from "@phoenix/components/code";
import { CodeBlock } from "@phoenix/components/CodeBlock";
import { usePreferencesContext } from "@phoenix/contexts";

const PYTHON_CODE = `
def contains(
  text: str,
  words: str,
  case_sensitive: bool = False,
  require_all: bool = False,
) -> bool:
  words = [word.strip() for word in words.split(",") if word.strip()]
  if not words:
    return False
  match_fn = all if require_all else any
  if case_sensitive:
    return match_fn(word in text for word in words)
  else:
    return match_fn(word.lower() in text.lower() for word in words)
`.trim();

const TYPESCRIPT_CODE = `
function contains(
  text: string,
  words: string,
  caseSensitive: boolean = false,
  requireAll: boolean = false,
): boolean {
  const wordList = words.split(",").map((w) => w.trim()).filter(Boolean);
  if (wordList.length === 0) return false;
  const matchFn = requireAll ? wordList.every.bind(wordList) : wordList.some.bind(wordList);
  if (caseSensitive) {
    return matchFn((word) => text.includes(word));
  }
  return matchFn((word) => text.toLowerCase().includes(word.toLowerCase()));
}
`.trim();

export const ContainsEvaluatorCodeBlock = () => {
  const { programmingLanguage, setProgrammingLanguage } = usePreferencesContext(
    (state) => ({
      programmingLanguage: state.programmingLanguage,
      setProgrammingLanguage: state.setProgrammingLanguage,
    })
  );
  return (
    <Card
      title="Code"
      extra={
        <Flex gap="size-100" alignItems="center">
          <CodeLanguageRadioGroup
            language={programmingLanguage}
            onChange={setProgrammingLanguage}
            size="S"
          />
        </Flex>
      }
    >
      <CodeBlock
        language={programmingLanguage}
        value={programmingLanguage === "Python" ? PYTHON_CODE : TYPESCRIPT_CODE}
      />
    </Card>
  );
};
