Skip to content

Add selectOptions props for InfitieTablePropColumns #273

Open
@ttruefix14

Description

@ttruefix14

Enhancement Description

It would be great if Infinite Table could do the following:
I can implement fields with selectable options by creating custom field type and mapping values in renderValue, but i want to impement SelectFilterEditor so i need my select options in filter. It can be done by adding selectOptions prop to columns and getting this options from column with useInfiniteColumnFilterEditor hook.
Code sample:

import {
    useInfiniteColumnFilterEditor,
} from '@infinite-table/infinite-react';
import { Form } from 'react-bootstrap';

export function SelectFilterEditor<T>() {
    const { value, setValue, className, column } =
        useInfiniteColumnFilterEditor<T>();
    return (
        <Form.Select
            className={className}
            value={value === null ? "" : value}
            onChange={(e) => {

                const selectedValue = e.target.value;
                setValue(selectedValue);
            }}
        >
            <option value="">Select</option>
            {column.selectOptions.map(opt => (
                <option key={opt.code} value={opt.code}>
                    {opt.value}
                </option>
            ))}
        </Form.Select>
    );
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions