Changing Actions Column location for Editable Tables?

awarmfastbear · May 31, 2020, 4:39pm

Hi,

I couldn’t find a property in the documentation for specifying where the actions column is placed. As seen in the example here: https://www.patternfly.org/v4/documentation/react/components/table#editable-rows

The action column is at the very end of the table, how could I move it to the beginning of the columns? Is there a column order property to specify a location of ‘0’ to place it at the beginning?

seanforyou23 · June 1, 2020, 2:42pm

Hi! The actions column is currently hard-coded to exist at the end of the table columns, you can see it here

github.com

patternfly/patternfly-react/blob/master/packages/react-table/src/components/Table/utils/headerUtils.tsx#L278


* @param {*} extra object with custom callbacks.
* @returns {*} expected object for react tabular table.
*/
export const calculateColumns = (headerRows: (ICell | string)[], extra: any) =>
 headerRows &&
 [
   ...collapsibleTransfroms(extra),
   ...selectableTransforms(extra),
   ...expandContent(headerRows, extra),
   ...rowEditTransforms(extra),
   ...actionsTransforms(extra)
 ].map((oneCol, key) => ({
   ...mapHeader(oneCol as ICell, extra, key)
 }));

Simply swapping this order around will have the effect you’re looking for, but this is something that I think should be tested well to ensure it doesn’t break layouting or other aspects of the Table functionality.

So, not currently configurable, but you are welcome to make a feature request for it if its something you would like to be considered. Hope it helps!!