Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 | 66x 66x | import React, { ReactElement, useEffect, useState } from "react";
import { EnumMetaProps, SelectMetaProps } from "@props/RecordProps";
import { isDynamicSelectColumn, isEnumColumn } from "@utils/ColumnsUtils";
import { fetchSelectOptions } from "@utils/FetchUtils";
import { Select } from "antd";
import { SearchInputProps } from "@kernel/SearchInputComponents";
import { MultipleModeMatcher } from "@kernel/ServerSideSearcherConfig";
const { Option } = Select;
const EnumOrDynamicSelectSearchInput = (props: SearchInputProps): ReactElement => {
const {
commonProps, onUpdateSearchKeyword, type, enumValue, dynamicSelectValue, fieldName, column, matchMode,
} = props;
const [options, setOptions] = useState([] as (Array<EnumMetaProps | SelectMetaProps>));
useEffect(() => {
if (isEnumColumn(type ?? "")) {
setOptions(enumValue ?? []);
} else {
if (type == 'enum') {
setOptions(column.enumOptions ?? []);
} else if (dynamicSelectValue != null && dynamicSelectValue?.length > 0){
setOptions(dynamicSelectValue);
} else if (isDynamicSelectColumn(type ?? "")) {
fieldName != null && fetchSelectOptions(fieldName).then((res: string[]) => {
console.log(res);
const opts = res.map((opt: string) => {
return { value: opt, label: opt };
});
setOptions(opts);
});
}
}
}, [type, dynamicSelectValue, enumValue, fieldName, column]);
return (
<Select
showSearch
className="search-input"
mode={matchMode && MultipleModeMatcher.includes(matchMode) ? "multiple" : undefined}
defaultActiveFirstOption={true}
showArrow={true}
dropdownMatchSelectWidth={true}
optionFilterProp="children"
filterOption={(input, option) => {
if (option == null || option.children == null) {
return false;
}
return option.children.toString().toLowerCase().indexOf(input.toLowerCase()) >= 0;
}}
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
onChange={(value) => onUpdateSearchKeyword(value)}
{...commonProps}
>
{options?.map((d: EnumMetaProps | SelectMetaProps) =>
<Option key={d.value} value={d.value}>{d.label}</Option>)}
</Select>
);
};
export default EnumOrDynamicSelectSearchInput;
|