Dataset Page - File Options Kebab Btn 🍡

[djbrooke]

Change the file table button style and appearance in the UI to maximum 3 icon buttons (3rd being "kabob" to display additional actions in a dropdown) to add scalability for future file-level actions.

Pulling this out as an individual issue from #6605. Link to mockup: https://www.sketch.com/s/c6f49cf6-795a-4138-931c-fd962ae2542a/a/Emwabv

[TaniaSchlatter]

When designing the button changes on the dataset page, we worked with the concept of using a "kebab" icon to support situations when there are many actions. The idea is to display up to 3 action buttons, and if there are 4 or more actions, display the "kebab" icon with a drop down, and include actions 4+ in the dropdown.

We need to define how this might happen, and details, even though the visual detail has been designed.

I propose a Discovery phase with the following steps and outcomes:

• Gather and conduct a preliminary review of related GitHub issues. Flag questions for follow up (@mheppler) and put them in the Design doc.
• Identify what's missing/what we need to know. Confirm: what are we talking about? Who wants what? Why? Document goals and next steps. (@djbrooke @TaniaSchlatter @mheppler).

For example, what if we prioritize the position of actions to help establish consistency? Would that feel restrictive to installations? To what degree should or might this be configurable?

• Create an inventory of current states/use cases. Include objects affected (icons states, drop down items, error/warning messages...)(@djbrooke @TaniaSchlatter @mheppler @scolapasta)
• Define/confirm scope for launch. What do we need to do to make this feature? Who will do what? Define checklist for detailed design effort.
• Document, including decisions clearly separated from work process.
• Use the documented decisions for estimation.

Definition of done for Discovery:

• Team understands the scope of the effort, or at least an initial effort/next steps:

• Access file drop down

• Preview button code (Preview Tools - New external tool preview type config setting, icon btn on dataset/file pgs #6919)

• Ingest warnings code

• Edit button code

• Accessibility/responsive layout of the file table

• Download Buttons - consolidate render logic (Download Buttons - consolidate render logic #7006)

• There is a plan for next steps

• Effort is prioritized in the backlog

For Design, we need to define logic for what buttons appear when, and have mockups of example display and behavior.

• Mockups showing Access file drop down: SBGrid and AJPS
• Mockups showing Preview button (image in this comment and prototype)
• Mockups showing Ingest warnings
• Mockups showing Edit (with Kebab)

[mheppler]

Changes to file-level action buttons and messages for the file table on the dataset pg and upload/edit files pg have been outlined in the File-Level Actions + Messages doc. They've been reviewed and approved by the design team, and outlined below. See more detail and screenshots of these changes in that doc.

TO-DO LIST

• Add new Access File icon button with dropdown options for Download, Explore, Compute to file-level actions in file table on dataset pg
• Add new file-level edit actions as options under new "kebab" File Options icon button to file-level actions in file table on dataset pg
• Move Configure external tools as options under new "kebab" File Options icon button file-level actions in file table on dataset pg
• Style and move ingest info + warning msgs in file-level actions in file table on dataset pg, as well as duplicate content msg on file table on upload/edit files pg
• Improve responsive layout and accessibility of the file table on the dataset pg file action buttons (responsive layout improvements for the file table has been moved to Dataset Page Filter, Sort, and Search Updates #7082)
• Refactor and consolidate multiple Download button render logic code, move from XHTML to backing bean (Download Buttons - consolidate render logic #7006)
• Add new UI features for file-level actions and external preview tools to User Guide and Installation Guide (Revise Explore Tools documentation to reflect modularity #4429, Preview Tools - New external tool preview type config setting, icon btn on dataset/file pgs #6919)

RELATED ISSUES NOT IN SCOPE OF THIS ISSUE

• Add Preview icon button which navigates to file pg to file-level actions in file table on dataset pg in support of new Preview external tool type in system configurations (Preview Tools - New external tool preview type config setting, icon btn on dataset/file pgs #6919)
• Improve responsive layout of filter, sort and search components above the file table on dataset pg (Dataset Page Filter, Sort, and Search Updates #7082)

[mheppler]

Dataset pg

• add new kebab file options icon btn
• move configure options to new file options dropdown menu
• add configure options dropdown header
• add edit options dropdown header
• add file access icon btn
• move download, explore, compute options to new file access dropdown menu
• style ingest in progress file level info msg
• move, style ingest failed file level warning msg
• move rsync data access info to new popup linked from Data Access dropdown option under access file icon btn

Upload/Edit Files pg

• change edit btn to new kebab file options icon btn
• add edit options dropdown header
• move, style duplicate file name file level warning msg

File pg

• move, style ingest failed file level warning msg

Footer

• add z-index: -1; to CSS to fix layering issue with dropdown menus

Guides

• removed explore btn reference from Developer Guide > Geospatial Data > Setting Up WorldMap Test Data
• changed compute btn reference to compute tool options in Installation Guide > Configuration > Setting up Compute with Swift
• changed download btn reference to access file btn in User Guide > Finding and Using Data > Download Files
• added reference to new data access option in User Guide > Finding and Using Data > Downloading a Dataverse Package via rsync
• removed reference to download btn in User Guide > Tabular Data File Ingest > CSV/TSV > Recognized data types and formatting (also fixed cvs-tsv.rst file name with a space in it by renaming it with a hyphen instead)

TO-DO

• file options btn render logic
• file edit links, render logic, disabled logic to file options dropdown menu
• file access btn showAccessFileButtonGroup render logic + fix display of file access icon btn for restricted file if request access is not enabled + fix display of file access icon btn for new rsync data access option (see TO-DO comments in dataset, filesFragment code)
• consolidate download options links under file access dropdown menu (Download Buttons - consolidate render logic #7006, Download Permissions: Remove business logic from Application fragments.  #2698)

QUESTIONS

• ? review the request access dropdown option (see screenshot below). The initial idea for Request Access was to have the Request Access icon display. The situation of use gets more complex with multiple files, one or more of which may be restricted. Also, file states and access are in flux with OpenDP (As a Researcher, I want to view differentially private metadata so that I can learn enough to determine whether or not it’s worth my time to go through the IRB process for the raw data. #4234) and DataTags (Integrate with DataTags #871) to come. Let's review behavior with the Preview button changes (Preview Tools - New external tool preview type config setting, icon btn on dataset/file pgs #6919) and determine next steps.

[mheppler]

Here are screenshots of the new rsync "Data Access" option under the access file icon btn in the file table on the dataset, plus the new popup displaying the necessary download info.

NOTE my localhost is not properly configured, so the Download Access values are empty and displayed blank in the popup screenshot, also hacked the display logic to show the "Data Access" option for a ZIP file as opposed to a Dataverse Package file.