import styles from './styles.module.css'
import {useContext} from "react";
import Context, {ContextInterface} from "../command/context";

export interface OptionInterface {
    name: string,
    description: string | null,
    default: any,
    value: any,
    shortcut: string | null,
    isArray: boolean,
    isNegatable: boolean,
    isValueOptional: boolean,
    isValueRequired: boolean
    acceptValue: boolean
}

export default function Option(option: OptionInterface) {
    let {optionList: ol, setOptionList} = useContext<ContextInterface>(Context)

    let onInput = (event: any) => {
        let temp = {
            ...ol
        }
        temp[option.name] = event.target.value
        setOptionList(temp)
    }
    return (
        <span>
            {option.shortcut ? '-' : '--'}{option.shortcut || option.name} {option.acceptValue && <input onInput={onInput} type="text"/>}&nbsp;
        </span>
    )
}
