Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

DataView: don't offer select/multiselect filters with empty filterOptions

Abierto Apto para principiantes
  • ¿Algo no está bien?
#849 0 comentarios 0 reacciones 1 asignado Ver en GitHub

Los mantenedores suelen responder en 2 días

@rohanchkrabrty ya está trabajando en esto.

Desde el 11/10/2026.

  • #934 de @rohanchkrabrty — abierto

Evaluación

Dificultad
2/5
Tiempo estimado
1-3 horas
Aptitud para principiantes
75/100
Tipo de issue
Error
Claridad
Bien especificado
Estado de actividad
Tranquilo
Stack tecnológico
react, typescript
Área
frontend

Línea de trabajo

Empieza en components/data-view-beta/components/filters.tsx leyendo filterableFields y availableFilters; después, inspecciona onAddFilter en components/data-view-beta/hooks/useFilters.tsx. Confirma que los campos select y multiselect con filterOptions vacíos se excluyen, mientras que los filtros que no son select siguen disponibles, y que los filtros select con opciones disponibles todavía se pueden añadir.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

Summary

DataView offers select / multiselect filters in the "add filter" menu even when the field's filterOptions is empty. Picking one seeds a chip that has no value and nothing to choose from — a dead control the user can't complete or use.

This is common when filter options are loaded async (e.g. a "Status" or "Owner" facet whose options arrive from the server after first paint): for a moment the field is filterable: true but has zero options, and the menu still lists it.

Where it happens

components/data-view-beta/components/filters.tsx

  • filterableFields only checks filterable (line ~105): 
    const filterableFields = fields?.filter(f => f.filterable) ?? [];
  • availableFilters only removes already-applied fields (line ~40): 
    const availableFilters = fieldList?.filter(
  f => !appliedFiltersSet.has(f.accessorKey)
);

Neither step checks whether a select / multiselect field actually has options.

components/data-view-beta/hooks/useFilters.tsx — onAddFilter then seeds the value from the (empty) options (line ~22):

const options = field.filterOptions || [];
...
: filterType === FilterType.select
  ? options[0]?.value        // undefined when filterOptions is empty

So the resulting filter is { _type: 'select', value: undefined, ... } — an unpickable chip.

Request

Exclude select / multiselect fields with no filterOptions from the available-filters list, so an unusable filter is never offered. Roughly:

const isSelect =
  field.filterType === 'select' || field.filterType === 'multiselect';
const hasOptions = Boolean(field.filterOptions?.length);
// keep the field only if it's not a select, or it's a select WITH options
return !isSelect || hasOptions;

Non-select filter types (string, number, date) are unaffected — they don't depend on filterOptions.

Workaround

We currently re-implement the add-filter menu (also needed for the align gap in #848) and apply this same guard client-side before offering a field. Folding the options check into Apsara's own available-filters logic would let consumers drop the guard.

Willing to contribute

Happy to open a PR if the approach looks right.

Lenguaje dominante
TypeScript
Estrellas
69
Forks
13
Merge medio
3 d 15 h
PR fusionados (30 d)
24

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de raystack/apsara

Todos los issues de raystack/apsara

Issues similares

Más issues de TypeScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.