Context Menu
Context Menus enhance the data exploration UX by providing relevant actions at the appropriate positions.
Column Context Menu
SQL Frames allows opening a contextual menu within each column header. Each column may have system actions that are contextual (the type of DataFrame and the type of the field). In addition, it is also possible to customize and add additional actions.
System Actions
Right click on the table filling blank column header and notice how Add Calculated Field option is available.
For an existing calculated field, the Edit Calculated Field action is shown.
A calculated field may be inherited as data is transformed, say by projecting or filtering. The edit option for a calculated field is available only on a DataFrame where the field is originally defined.
In the following example, the calculation for the field Price per unit cannot be edited directly within the projected DataFrame.
Custom Actions
Below is a fully working example of providing the ability to add and remove custom calculated fields. Click on any of the column headers to open a contextual menu (using appropriate contextual menu gesture) to see this in action.
The API used to provide custom contextual actions is available within the UI plugin
and accessible off of any DataFrame df as df.ui.fieldContextMenuProvider. The
argument is a function which should return a Menu object whose interface is specified
in the Menubar config page. The
argument to the function has the following interface
type FieldContextMenuData = {
field: {
aliasedName: string,
displayName: string,
},
fillColumn: boolean // when fillWidth is true, indicates if this is the blank column used to fill the width
pivotValues?: Map<string,unknown> // pivot column values for pivot tables
}
In SQL Frames a field refers to a physical column of the DataFrame while a
column refers to the UI column. In most cases there is no difference. However
in case of Pivot tables, a field such as Revenue may show as several columns
in the UI once for each pivoted column value. Hence, both the field and the pivotValues
together provide the context of the UI column of a Pivot table.
Data Context Menu
SQL Frames allows opening contextual menu on each cell within the data grid. There may be system actions available based on the type of the DataFrame.
System Actions
Right click on any data cell and notice how there are quick filtering options for fdf and
gdf. In addition, the gdf has the option to view the record details which make up the summary data.
Custom Actions
Below is a fully working example of specifying a custom action based on the data.
The API used to provide custom contextual actions is available within the UI plugin
and accessible off of any DataFrame df as df.ui.dataContextMenuProvider. The
argument is a function which should return a Menu object whose interface is specified
in the Menubar config page. The argument to the
function has the following interface
type DataContextMenuData = {
drow: DataRow,
column: DataColumnField,
value: unknown,
dvalue: unknown
}