feat: 🎸 [Table] Added option to sort toolbar actions

✅ Closes: 103
melfore · Sep 13, 2021 · 48e2106 · 48e2106
1 parent cc142ef
commit 48e2106
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 3 deletions.
diff --git a/src/components/Table/index.tsx b/src/components/Table/index.tsx
@@ -57,6 +57,7 @@ export const SUBPARTS_MAP = {
 
 const Table: FC<ITable> = ({
   actions = [],
+  actionsOrder = "list",
   columns: externalColumns,
   dataCy = DATA_CY_DEFAULT,
   emptyState,
@@ -200,13 +201,22 @@ const Table: FC<ITable> = ({
       ];
     }
 
-    const defaultActions = toolbarActions.sort(
-      ({ position }, { position: another }) => -1 * position!.localeCompare(another!)
-    );
+    let defaultActions = toolbarActions;
+    switch (actionsOrder) {
+      case "buttons-first":
+        defaultActions.sort(({ position }, { position: another }) => -1 * position!.localeCompare(another!));
+        break;
+      case "icons-first":
+        defaultActions.sort(({ position }, { position: another }) => position!.localeCompare(another!));
+        break;
+      default:
+        break;
+    }
 
     return { defaultActions, columns, rowActions, selectionActions };
   }, [
     actions,
+    actionsOrder,
     externalColumns,
     dataCy,
     loading,

diff --git a/src/types/Table.ts b/src/types/Table.ts
@@ -19,6 +19,8 @@ export interface ITableAction extends IPartialIconUtilizer {
   position?: TableActionPosition;
 }
 
+export type ITableActionsOrder = "buttons-first" | "icons-first" | "list";
+
 export interface ITableToolbarAction extends ISubpartItem, ITableAction {
   data: object | object[];
   index: number;
@@ -65,6 +67,7 @@ export type ITablePaginationActions = MUITablePaginationProps & ISubpartItem;
 export type ITable = ILocalizable &
   Partial<ITablePagination> & {
     actions?: ITableAction[];
+    actionsOrder?: "list" | "buttons-first" | "icons-first";
     columns: ITableColumn[];
     emptyState?: ReactNode;
     getRowStyle?: (data: any) => CSSProperties;