Filter Button

<Stack spacing={4} direction="column">
        <State initial={false}>
            {([value, setValue]) => (
                <FilterButton label="Active" value={value} onClick={() => setValue(!value)} />
            )}
    </State>
        <Stack spacing={1}>
            <FilterButton label="Active" value={true} />
            <FilterButton label="Active" value={false} />
        </Stack>
    </Stack>

<Stack spacing={4} direction="column">
        <State initial={false}>
            {([value, setValue]) => (
                <FilterButton label="Active" icon="check" value={value} onClick={() => setValue(!value)} />
            )}
        </State>
        <Stack spacing={1}>
            <FilterButton label="Active" icon="check" value={true} />
            <FilterButton label="Active" icon="check" value={false} />
        </Stack>
    </Stack>

const SingleSelect = () => {
    const [value, setValue] = React.useState(0);
    const [open, setOpen] = React.useState(false);

    const onChangeHandler = (e) => {
        setValue