Menu for hiding and showing columns

[chriddyp]

• Ability to add / remove columns from a predefined list of columns using a contextual menu.
• All columns would appear in this contextual menu as a checklist
• The visible columns would be “checked” and the hidden columns would be “unchecked”
• The user could click on an icon in the header to display the menu
• This feature would be toggled on/off with a top-level table property
• These settings would be “save-able” in the user’s browser session. So, if a user selected a series of columns, they could “save” these options (to the browser’s localstorage) and when they re-visit the app, the same set of columns would be displayed.
• This would only work on the user’s browser. It would not work across computers.
• This would use localstorage to save data
• This menu would be “global” for the table. It would not be displayed on a per-column basis.

The UI for this (and the other features) will be considered in a separate issue

[Marc-Andre-Rivet]

Use local storage and revert to cookies if local storage is not available (the browser's configuration needs to be tested as some browsers / settings will mark the feature as available but allow 0 bytes to be saved). Session storage is useless here as it is not persisted between visits.

Determine initialization model for table: Gets loaded with XYZ values for columns -- when and how does the stored value kick in, when is it applied / ignored. Or, is hidden really part of the table's column API or just something derived from other settings like filtering, sorting, pagination influencing derived_**_data.

Storage must support multiple tables for a given path (use id) -- generated id might be problematic for unnamed tables.

Implement internally as a standalone component for isolation and future flexibility.

Use generic icon from some package (e.g. font-awesome -- in this specific case explicit es6 pruning the font library is a must -- one-on-one basis for other packages) or do we have a in-house icon source.

All in all, probably ~1 week of work here to build the UI, answer these questions to some satisfaction and test.

[Marc-Andre-Rivet]

With Dash 1.0 removing column.hidden, need to make sure hidden columns are taken into consideration on export (#313) -- will require its own additional test.

[vivekvs1]

With the "hidden" option removed in DASH 1.0, is there a temporary alternative method to achieve the same? Now my app breaks and I am unable to use it anymore.

[alexcjohnson]

@vivekvs1 you can put extra fields in data that have no counterpart in columns - ie any column that you previously marked hidden, just remove it. Does that cover your use case?

[vivekvs1]

I used toggle switches to show and hide sets of columns. So i initialized them with 'hidden':'False' and changed some of them to 'hidden':True though a callback, based on which toggle switch was triggered.

[notatallshaw]

Feel free to delete this comment if it ends up littering this issue thread but I would like to make it clear the hidden feature on Dash Table 3.7.0 is used by all my important projects.

This wasn't some obscure feature hardly used, it's heavily relied on and stops upgrading of most of my projects. Which either use it to sort data not visible to the user (e.g. a status with visible colours but a hidden "serverity" columns to show the red colours at the top) or for users to hide or show columns themselves a configuration UI that I developed.

you can put extra fields in data that have no counterpart in columns - ie any column that you previously marked hidden, just remove it. Does that cover your use case?

FYI this doesn't cover my use cases as if the column is removed I can't sort by it, which is a feature that I rely on on use case 1 and a feature I offer to the user in use case 2.