Menu Items Order Should Match Table Column Headers Order

[Bonapara]

Current Behavior

Filter and Sort menu items are displayed in alphabetical order (1)

Desired Behavior

Visible Filter and Sort menu items (1) should be displayed in the same order as the column headers in the table (2)(A).

Hidden columns should be displayed below - in a different section - by alphabetical order (B). There should be a separator between the two sections (C)

[greptile-apps]

To ensure the Filter and Sort menu items match the order of the table column headers, follow these steps:

1. Locate Column Order Definition: Open RecordTableHeader.tsx and identify the order of the columns.

2. Adjust Menu Rendering Logic: Open RecordTableColumnDropdownMenu.tsx and modify the logic to render menu items in the same order as defined in RecordTableHeader.tsx.

3. Example Implementation:

// RecordTableHeader.tsx
const columnHeaders = ['Name', 'Age', 'Address'];

// RecordTableColumnDropdownMenu.tsx
const menuItems = columnHeaders.map(header => (
  <MenuItem key={header}>
    {header}
  </MenuItem>
));

Ensure the menuItems array in RecordTableColumnDropdownMenu.tsx is generated based on the columnHeaders array from RecordTableHeader.tsx.

References

[FelixMalfait]

You can filter/sort on fields that aren't visible on the table. That might get a bit confusing? The ones that are not visible should then be sorted alphabetically?

[Bonapara]

You can filter/sort on fields that aren't visible on the table. That might get a bit confusing? The ones that are not visible should then be sorted alphabetically?

Issue description updated: Let's introduce a second section for non visible fields to make things clear

[Nabhag8848]

@Bonapara I would like to take this, started working do assign.

[Nabhag8848]

/assign

[Nabhag8848]

/assign

[oss-gg]

This issue is already assigned to you. Let's get this shipped!