import { useState } from "react"; import { useTranslation } from "react-i18next"; import { Dropdown, DropdownItem, DropdownMenu, DropdownToggle, } from "reactstrap"; import { useIntParam } from "taehui-ts/fe-utility"; export default function SrcInput() { const [isSrcOpened, setSrcOpened] = useState(false); const { t } = useTranslation(); const { param: src, setParam: setSrc } = useIntParam("src", 0); const onInput = (src: number) => () => { setSrc(src); }; return ( <Dropdown isOpen={isSrcOpened} toggle={() => { setSrcOpened(!isSrcOpened); }} > <DropdownToggle caret>{t(`toSrc${src}`)}</DropdownToggle> <DropdownMenu> <DropdownItem onClick={onInput(0)}>{t("toSrc0")}</DropdownItem> <DropdownItem onClick={onInput(1)}>{t("toSrc1")}</DropdownItem> <DropdownItem onClick={onInput(2)}>{t("toSrc2")}</DropdownItem> <DropdownItem onClick={onInput(3)}>{t("toSrc3")}</DropdownItem> </DropdownMenu> </Dropdown> ); }