@terraware/web-components 2.16.3 → 2.16.4-rc.0

package/components/table/index.js

@@ -1,16 +1,13 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = EnhancedTable;
 exports.isTopBarButton = void 0;
 exports.tableSort = tableSort;
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
 var _material = require("@mui/material");
 var _react = _interopRequireWildcard(require("react"));
 var _EnhancedTableToolbarV = _interopRequireDefault(require("./EnhancedTableToolbarV2"));
@@ -22,129 +19,107 @@ var _core = require("@dnd-kit/core");
 var _sortable = require("@dnd-kit/sortable");
 var _utils = require("../../utils");
 var _Checkbox = require("../Checkbox");
-var tableStyles = (0, _styles.makeStyles)(function (theme) {
-  return {
-    hover: {
-      '&:hover': {
-        cursor: 'pointer',
-        backgroundColor: "".concat(theme.palette.neutral[100], "!important")
-      }
-    },
-    table: {
-      borderCollapse: 'initial'
-    },
-    inactiveRow: {
-      background: theme.palette.neutral[50]
-    },
-    tableRow: {
-      '&.MuiTableRow-root.Mui-selected': {
-        backgroundColor: 'initial'
-      }
-    },
-    cellDefault: {
-      '&.MuiTableCell-root': {
-        borderBottom: "1px solid ".concat(theme.palette.TwClrBrdrSecondary)
-      }
+const tableStyles = (0, _styles.makeStyles)(theme => ({
+  hover: {
+    '&:hover': {
+      cursor: 'pointer',
+      backgroundColor: "".concat(theme.palette.neutral[100], "!important")
     }
-  };
-});
+  },
+  table: {
+    borderCollapse: 'initial'
+  },
+  inactiveRow: {
+    background: theme.palette.neutral[50]
+  },
+  tableRow: {
+    '&.MuiTableRow-root.Mui-selected': {
+      backgroundColor: 'initial'
+    }
+  },
+  cellDefault: {
+    '&.MuiTableCell-root': {
+      borderBottom: "1px solid ".concat(theme.palette.TwClrBrdrSecondary)
+    }
+  }
+}));
 
 // Only the text related props need to be passed in by the implementer, and extra data is passed to the caller
 
-var isTopBarButton = exports.isTopBarButton = function isTopBarButton(input) {
-  var castInput = input;
+const isTopBarButton = input => {
+  const castInput = input;
   return !!(castInput.buttonType && castInput.onButtonClick);
 };
+exports.isTopBarButton = isTopBarButton;
 function EnhancedTable(_ref) {
-  var id = _ref.id,
-    columns = _ref.columns,
-    rows = _ref.rows,
-    _ref$order = _ref.order,
-    _order = _ref$order === void 0 ? 'asc' : _ref$order,
-    _orderBy = _ref.orderBy,
-    _ref$Renderer = _ref.Renderer,
-    Renderer = _ref$Renderer === void 0 ? _TableCellRenderer.default : _ref$Renderer,
-    onSelect = _ref.onSelect,
-    DetailsRenderer = _ref.DetailsRenderer,
-    _ref$sortComparator = _ref.sortComparator,
-    sortComparator = _ref$sortComparator === void 0 ? _sort.descendingComparator : _ref$sortComparator,
-    sortHandler = _ref.sortHandler,
-    isInactive = _ref.isInactive,
-    isPresorted = _ref.isPresorted,
-    onReorderEnd = _ref.onReorderEnd,
-    isClickable = _ref.isClickable,
-    emptyTableMessage = _ref.emptyTableMessage,
-    showCheckbox = _ref.showCheckbox,
-    showTopBar = _ref.showTopBar,
-    topBarButtons = _ref.topBarButtons,
-    selectedRows = _ref.selectedRows,
-    setSelectedRows = _ref.setSelectedRows,
-    controlledOnSelect = _ref.controlledOnSelect,
-    reloadData = _ref.reloadData,
-    _ref$stickyHeader = _ref.stickyHeader,
-    stickyHeader = _ref$stickyHeader === void 0 ? true : _ref$stickyHeader,
-    hideHeader = _ref.hideHeader,
-    booleanFalseText = _ref.booleanFalseText,
-    booleanTrueText = _ref.booleanTrueText,
-    editText = _ref.editText,
-    renderNumSelectedText = _ref.renderNumSelectedText,
-    renderPaginationText = _ref.renderPaginationText,
-    enhancedTopBarSelectionConfig = _ref.enhancedTopBarSelectionConfig;
-  var classes = tableStyles();
-  var theme = (0, _material.useTheme)();
-  var _React$useState = _react.default.useState(_order),
-    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-    order = _React$useState2[0],
-    setOrder = _React$useState2[1];
-  var _React$useState3 = _react.default.useState(_orderBy),
-    _React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
-    orderBy = _React$useState4[0],
-    setOrderBy = _React$useState4[1];
-  var _useState = (0, _react.useState)(100),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 1),
-    maxItemsPerPage = _useState2[0];
-  var _useState3 = (0, _react.useState)(0),
-    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-    itemsToSkip = _useState4[0],
-    setItemsToSkip = _useState4[1];
-  var _useDeviceInfo = (0, _utils.useDeviceInfo)(),
-    isMobile = _useDeviceInfo.isMobile;
-  var _useState5 = (0, _react.useState)(),
-    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-    displayColumnKeyNames = _useState6[0],
-    setDisplayColumnKeyNames = _useState6[1];
-  var _useState7 = (0, _react.useState)(),
-    _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
-    displayColumnsIndexed = _useState8[0],
-    setDisplayColumnsIndexed = _useState8[1];
-  var _useState9 = (0, _react.useState)(),
-    _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
-    displayColumnDetails = _useState10[0],
-    setDisplayColumnDetails = _useState10[1];
-  (0, _react.useEffect)(function () {
-    var columnsKeyNames = columns.map(function (col) {
-      return col.key;
-    });
-    var columnsIndexed = columns.reduce(function (acum, value) {
+  let {
+    id,
+    columns,
+    rows,
+    order: _order = 'asc',
+    orderBy: _orderBy,
+    Renderer = _TableCellRenderer.default,
+    onSelect,
+    DetailsRenderer,
+    sortComparator = _sort.descendingComparator,
+    sortHandler,
+    isInactive,
+    isPresorted,
+    onReorderEnd,
+    isClickable,
+    emptyTableMessage,
+    showCheckbox,
+    showTopBar,
+    topBarButtons,
+    selectedRows,
+    setSelectedRows,
+    controlledOnSelect,
+    reloadData,
+    stickyHeader = true,
+    hideHeader,
+    booleanFalseText,
+    booleanTrueText,
+    editText,
+    renderNumSelectedText,
+    renderPaginationText,
+    enhancedTopBarSelectionConfig
+  } = _ref;
+  const classes = tableStyles();
+  const theme = (0, _material.useTheme)();
+  const [order, setOrder] = _react.default.useState(_order);
+  const [orderBy, setOrderBy] = _react.default.useState(_orderBy);
+  const [maxItemsPerPage] = (0, _react.useState)(100);
+  const [itemsToSkip, setItemsToSkip] = (0, _react.useState)(0);
+  const {
+    isMobile
+  } = (0, _utils.useDeviceInfo)();
+  const [displayColumnKeyNames, setDisplayColumnKeyNames] = (0, _react.useState)();
+  const [displayColumnsIndexed, setDisplayColumnsIndexed] = (0, _react.useState)();
+  const [displayColumnDetails, setDisplayColumnDetails] = (0, _react.useState)();
+  (0, _react.useEffect)(() => {
+    const columnsKeyNames = columns.map(col => col.key);
+    const columnsIndexed = columns.reduce((acum, value) => {
       acum[value.key] = value;
       return acum;
     }, {});
     setDisplayColumnKeyNames(columnsKeyNames);
     setDisplayColumnsIndexed(columnsIndexed);
   }, [columns]);
-  (0, _react.useEffect)(function () {
+  (0, _react.useEffect)(() => {
     if (displayColumnKeyNames && displayColumnsIndexed) {
-      var columnsDetails = displayColumnKeyNames.map(function (key) {
-        var detail = (0, _objectSpread2.default)({}, displayColumnsIndexed[key]);
+      const columnsDetails = displayColumnKeyNames.map(key => {
+        const detail = {
+          ...displayColumnsIndexed[key]
+        };
         return detail;
       });
       setDisplayColumnDetails(columnsDetails);
     }
   }, [displayColumnKeyNames, displayColumnsIndexed]);
-  (0, _react.useEffect)(function () {
+  (0, _react.useEffect)(() => {
     if (setSelectedRows && rows.length >= 0) {
-      setSelectedRows(function (currentlySelectedRows) {
-        var emptyArray = [];
+      setSelectedRows(currentlySelectedRows => {
+        const emptyArray = [];
         if (rows.length || currentlySelectedRows.length > rows.length) {
           return emptyArray;
         }
@@ -152,7 +127,7 @@ function EnhancedTable(_ref) {
       });
     }
   }, [rows, setSelectedRows]);
-  (0, _react.useEffect)(function () {
+  (0, _react.useEffect)(() => {
     // this is not most elegant but we want to do this if table was sorted by some column in a presorted table
     // but we don't know when the data changes, hence this useEffect on the data size
     if (isPresorted) {
@@ -161,22 +136,20 @@ function EnhancedTable(_ref) {
       handleChangePage({}, 1);
     }
   }, [rows]);
-  var handleRequestSort = function handleRequestSort(event, property) {
-    var isAsc = orderBy === property && order === 'asc';
-    var newOrder = isAsc ? 'desc' : 'asc';
+  const handleRequestSort = (event, property) => {
+    const isAsc = orderBy === property && order === 'asc';
+    const newOrder = isAsc ? 'desc' : 'asc';
     setOrder(newOrder);
     setOrderBy(property);
     if (sortHandler) {
       sortHandler(newOrder, property);
     }
   };
-  var hasEditColumn = columns.filter(function (c) {
-    return c.type === 'edit';
-  }).length > 0;
-  var isSelected = function isSelected(row) {
+  const hasEditColumn = columns.filter(c => c.type === 'edit').length > 0;
+  const isSelected = row => {
     return selectedRows && selectedRows.indexOf(row) !== -1;
   };
-  var handleSelectAllClick = function handleSelectAllClick(event) {
+  const handleSelectAllClick = event => {
     if (setSelectedRows) {
       if (event.target.checked) {
         setSelectedRows(rows);
@@ -186,10 +159,10 @@ function EnhancedTable(_ref) {
       }
     }
   };
-  var handleClick = function handleClick(event, row) {
+  const handleClick = (event, row) => {
     if (setSelectedRows && selectedRows) {
-      var selectedIndex = selectedRows.indexOf(row);
-      var newSelected = [];
+      const selectedIndex = selectedRows.indexOf(row);
+      let newSelected = [];
       if (selectedIndex === -1) {
         newSelected = newSelected.concat(selectedRows, row);
       } else if (selectedIndex === 0) {
@@ -202,79 +175,71 @@ function EnhancedTable(_ref) {
       setSelectedRows(newSelected);
     }
   };
-  var handleChangePage = function handleChangePage(event, newPage) {
+  const handleChangePage = (event, newPage) => {
     setItemsToSkip(maxItemsPerPage * (newPage - 1));
   };
   function columnsToHeadCells(columnsR) {
-    return columnsR.map(function (c) {
-      return {
-        id: c.key,
-        disablePadding: false,
-        label: typeof c.name === 'string' ? c.name.toUpperCase() : c.name,
-        tooltipTitle: c.tooltipTitle
-      };
-    });
+    return columnsR.map(c => ({
+      id: c.key,
+      disablePadding: false,
+      label: typeof c.name === 'string' ? c.name.toUpperCase() : c.name,
+      tooltipTitle: c.tooltipTitle
+    }));
   }
-  var _React$useState5 = _react.default.useState(),
-    _React$useState6 = (0, _slicedToArray2.default)(_React$useState5, 2),
-    headCells = _React$useState6[0],
-    setHeadCells = _React$useState6[1];
-  _react.default.useEffect(function () {
+  const [headCells, setHeadCells] = _react.default.useState();
+  _react.default.useEffect(() => {
     if (displayColumnDetails) {
       setHeadCells(columnsToHeadCells(displayColumnDetails));
     }
   }, [displayColumnDetails]);
-  var sensors = (0, _core.useSensors)((0, _core.useSensor)(_core.MouseSensor), (0, _core.useSensor)(_core.TouchSensor), (0, _core.useSensor)(_core.KeyboardSensor, {
+  const sensors = (0, _core.useSensors)((0, _core.useSensor)(_core.MouseSensor), (0, _core.useSensor)(_core.TouchSensor), (0, _core.useSensor)(_core.KeyboardSensor, {
     coordinateGetter: _sortable.sortableKeyboardCoordinates
   }));
-  var onReorderEndHandler = (0, _react.useCallback)(function (_ref2) {
-    var oldIndex = _ref2.oldIndex,
-      newIndex = _ref2.newIndex;
+  const onReorderEndHandler = (0, _react.useCallback)(_ref2 => {
+    let {
+      oldIndex,
+      newIndex
+    } = _ref2;
     if (displayColumnKeyNames) {
       if (newIndex !== 0 && oldIndex !== 0) {
-        var _newOrder = (0, _toConsumableArray2.default)(displayColumnKeyNames);
-        var moved = _newOrder.splice(oldIndex, 1);
-        _newOrder.splice(newIndex, 0, moved[0]);
-        setDisplayColumnKeyNames(_newOrder);
+        const newOrder = [...displayColumnKeyNames];
+        const moved = newOrder.splice(oldIndex, 1);
+        newOrder.splice(newIndex, 0, moved[0]);
+        setDisplayColumnKeyNames(newOrder);
         if (onReorderEnd) {
-          onReorderEnd(_newOrder);
+          onReorderEnd(newOrder);
         }
       }
     }
   }, [displayColumnKeyNames, setDisplayColumnKeyNames, onReorderEnd]);
   function handleDragEnd(event) {
     if (headCells) {
-      var active = event.active,
-        over = event.over;
+      const {
+        active,
+        over
+      } = event;
       if (active && over && active.id !== over.id && onReorderEndHandler) {
-        var oldIndex = headCells.findIndex(function (item) {
-          return item.id === active.id;
-        });
-        var newIndex = headCells.findIndex(function (item) {
-          return item.id === over.id;
-        });
+        const oldIndex = headCells.findIndex(item => item.id === active.id);
+        const newIndex = headCells.findIndex(item => item.id === over.id);
         onReorderEndHandler({
-          oldIndex: oldIndex,
-          newIndex: newIndex
+          oldIndex,
+          newIndex
         });
       }
     }
   }
-  var pagesCount = Math.ceil(rows.length / maxItemsPerPage);
+  const pagesCount = Math.ceil(rows.length / maxItemsPerPage);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, showTopBar && /*#__PURE__*/_react.default.createElement(_EnhancedTableToolbarV.default, {
     selectedRowsCount: (selectedRows === null || selectedRows === void 0 ? void 0 : selectedRows.length) || 0,
     pagesCount: pagesCount,
     renderNumSelectedText: renderNumSelectedText,
     rowsCount: rows.length,
     topBarButtons: topBarButtons,
-    topBarSelectionConfig: enhancedTopBarSelectionConfig ? (0, _objectSpread2.default)((0, _objectSpread2.default)({}, enhancedTopBarSelectionConfig), {}, {
-      handleSelectAll: function handleSelectAll() {
-        return setSelectedRows && setSelectedRows(rows);
-      },
-      handleSelectNone: function handleSelectNone() {
-        return setSelectedRows && setSelectedRows([]);
-      }
-    }) : undefined
+    topBarSelectionConfig: enhancedTopBarSelectionConfig ? {
+      ...enhancedTopBarSelectionConfig,
+      handleSelectAll: () => setSelectedRows && setSelectedRows(rows),
+      handleSelectNone: () => setSelectedRows && setSelectedRows([])
+    } : undefined
   }), /*#__PURE__*/_react.default.createElement(_material.TableContainer, {
     id: id
   }, /*#__PURE__*/_react.default.createElement(_core.DndContext, {
@@ -298,11 +263,9 @@ function EnhancedTable(_ref) {
   }), /*#__PURE__*/_react.default.createElement(_material.TableBody, null, rows.length < 1 && emptyTableMessage && /*#__PURE__*/_react.default.createElement(_material.TableRow, null, /*#__PURE__*/_react.default.createElement(_material.TableCell, {
     colSpan: columns.length + 1,
     align: "center"
-  }, /*#__PURE__*/_react.default.createElement("p", null, emptyTableMessage))), rows && (isPresorted ? rows : (0, _sort.stableSort)(rows, (0, _sort.getComparator)(order, orderBy, sortComparator))).slice(itemsToSkip, itemsToSkip + maxItemsPerPage).map(function (row, index) {
-    var _onClick = onSelect && !controlledOnSelect ? function () {
-      return onSelect(row);
-    } : undefined;
-    var isItemSelected = isSelected(row);
+  }, /*#__PURE__*/_react.default.createElement("p", null, emptyTableMessage))), rows && (isPresorted ? rows : (0, _sort.stableSort)(rows, (0, _sort.getComparator)(order, orderBy, sortComparator))).slice(itemsToSkip, itemsToSkip + maxItemsPerPage).map((row, index) => {
+    const onClick = onSelect && !controlledOnSelect ? () => onSelect(row) : undefined;
+    const isItemSelected = isSelected(row);
     return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, {
       key: index
     }, /*#__PURE__*/_react.default.createElement(_material.TableRow, {
@@ -311,12 +274,12 @@ function EnhancedTable(_ref) {
         hover: classes.hover
       },
       hover: Boolean(onSelect) && (isClickable ? isClickable(row) : true) && !hasEditColumn,
-      onClick: function onClick(e) {
+      onClick: e => {
         e.stopPropagation();
-        if (_onClick && !hasEditColumn && (isClickable ? isClickable(row) : true)) {
-          _onClick();
+        if (onClick && !hasEditColumn && (isClickable ? isClickable(row) : true)) {
+          onClick();
         }
-        if (!_onClick && !hasEditColumn && (isClickable ? isClickable(row) : true)) {
+        if (!onClick && !hasEditColumn && (isClickable ? isClickable(row) : true)) {
           handleClick(e, row);
         }
       },
@@ -331,25 +294,19 @@ function EnhancedTable(_ref) {
       sx: (0, _Checkbox.CheckboxStyle)(theme),
       color: "primary",
       checked: isItemSelected,
-      onClick: function onClick(e) {
-        return !isClickable || !isClickable(row) ? handleClick(e, row) : null;
-      }
-    })), displayColumnDetails && displayColumnDetails.map(function (c) {
-      return /*#__PURE__*/_react.default.createElement(Renderer, {
-        index: index + 1,
-        key: c.key,
-        row: row,
-        column: c,
-        value: row[c.key],
-        onRowClick: onSelect && controlledOnSelect ? function (newValue) {
-          return onSelect(row, c.key, newValue);
-        } : _onClick,
-        reloadData: reloadData,
-        booleanFalseText: booleanFalseText,
-        booleanTrueText: booleanTrueText,
-        editText: editText
-      });
-    })), DetailsRenderer && /*#__PURE__*/_react.default.createElement(DetailsRenderer, {
+      onClick: e => !isClickable || !isClickable(row) ? handleClick(e, row) : null
+    })), displayColumnDetails && displayColumnDetails.map(c => /*#__PURE__*/_react.default.createElement(Renderer, {
+      index: index + 1,
+      key: c.key,
+      row: row,
+      column: c,
+      value: row[c.key],
+      onRowClick: onSelect && controlledOnSelect ? newValue => onSelect(row, c.key, newValue) : onClick,
+      reloadData: reloadData,
+      booleanFalseText: booleanFalseText,
+      booleanTrueText: booleanTrueText,
+      editText: editText
+    }))), DetailsRenderer && /*#__PURE__*/_react.default.createElement(DetailsRenderer, {
       index: index,
       row: row
     }));

package/components/table/sort.js

@@ -9,14 +9,14 @@ exports.stableSort = stableSort;
 function descendingComparator(a, b, orderBy, order) {
   var _b$orderBy, _a$orderBy;
   // first attempt to parse into a numeric value and compare
-  var numCompare = descendingNumComparator(a, b, orderBy);
+  const numCompare = descendingNumComparator(a, b, orderBy);
   if (numCompare !== null) {
     return numCompare;
   }
 
   // if non-numeric, compare using the javascript built-in compare for this type
-  var bValue = (_b$orderBy = b[orderBy]) !== null && _b$orderBy !== void 0 ? _b$orderBy : '';
-  var aValue = (_a$orderBy = a[orderBy]) !== null && _a$orderBy !== void 0 ? _a$orderBy : '';
+  const bValue = (_b$orderBy = b[orderBy]) !== null && _b$orderBy !== void 0 ? _b$orderBy : '';
+  const aValue = (_a$orderBy = a[orderBy]) !== null && _a$orderBy !== void 0 ? _a$orderBy : '';
 
   // blank values at the end always (any order)
   if (isEmptyValue(aValue.toString()) && isEmptyValue(bValue.toString())) {
@@ -45,30 +45,24 @@ function isEmptyValue(value) {
 }
 function descendingNumComparator(a, b, orderBy) {
   var _a$orderBy2, _b$orderBy2;
-  var aNumValue = Number((_a$orderBy2 = a[orderBy]) !== null && _a$orderBy2 !== void 0 ? _a$orderBy2 : '0.0');
-  var bNumValue = Number((_b$orderBy2 = b[orderBy]) !== null && _b$orderBy2 !== void 0 ? _b$orderBy2 : '0.0');
+  const aNumValue = Number((_a$orderBy2 = a[orderBy]) !== null && _a$orderBy2 !== void 0 ? _a$orderBy2 : '0.0');
+  const bNumValue = Number((_b$orderBy2 = b[orderBy]) !== null && _b$orderBy2 !== void 0 ? _b$orderBy2 : '0.0');
   if (!isNaN(aNumValue) && !isNaN(bNumValue)) {
     return bNumValue - aNumValue;
   }
   return null;
 }
 function getComparator(order, orderBy, sorting) {
-  return function (a, b) {
-    return sorting(a, b, orderBy, order);
-  };
+  return (a, b) => sorting(a, b, orderBy, order);
 }
 function stableSort(array, comparator) {
-  var stabilizedThis = array.map(function (el, index) {
-    return [el, index];
-  });
-  stabilizedThis.sort(function (a, b) {
-    var order = comparator(a[0], b[0]);
+  const stabilizedThis = array.map((el, index) => [el, index]);
+  stabilizedThis.sort((a, b) => {
+    const order = comparator(a[0], b[0]);
     if (order !== 0) {
       return order;
     }
     return a[1] - b[1];
   });
-  return stabilizedThis.map(function (el) {
-    return el[0];
-  });
+  return stabilizedThis.map(el => el[0]);
 }

package/components/table/sort.test.js

@@ -1,37 +1,37 @@
 "use strict";
 
 var _sort = require("./sort");
-var rowA = {
+const rowA = {
   string1: 'foo',
   string2: 'same',
   number1: '1050',
   number2: '150',
   number3: '1.100'
 };
-var rowB = {
+const rowB = {
   string1: 'barbaz',
   string2: 'same',
   number1: '1099',
   number2: '21.001',
   number3: '1.1'
 };
-test('compare unequal string fields', function () {
-  var cmp = (0, _sort.descendingComparator)(rowA, rowB, 'string1', 'desc');
+test('compare unequal string fields', () => {
+  const cmp = (0, _sort.descendingComparator)(rowA, rowB, 'string1', 'desc');
   expect(cmp).toEqual(-1);
 });
-test('compare equal string fields', function () {
-  var cmp = (0, _sort.descendingComparator)(rowA, rowB, 'string2', 'desc');
+test('compare equal string fields', () => {
+  const cmp = (0, _sort.descendingComparator)(rowA, rowB, 'string2', 'desc');
   expect(cmp).toEqual(0);
 });
-test('compare unequal number fields with same whole number digits', function () {
-  var cmp = (0, _sort.descendingComparator)(rowA, rowB, 'number1', 'desc');
+test('compare unequal number fields with same whole number digits', () => {
+  const cmp = (0, _sort.descendingComparator)(rowA, rowB, 'number1', 'desc');
   expect(Math.sign(cmp)).toEqual(1);
 });
-test('compare unequal number fields with differing whole number digits', function () {
-  var cmp = (0, _sort.descendingComparator)(rowA, rowB, 'number2', 'desc');
+test('compare unequal number fields with differing whole number digits', () => {
+  const cmp = (0, _sort.descendingComparator)(rowA, rowB, 'number2', 'desc');
   expect(Math.sign(cmp)).toEqual(-1);
 });
-test('compare equal number fields', function () {
-  var cmp = (0, _sort.descendingComparator)(rowA, rowB, 'number3', 'desc');
+test('compare equal number fields', () => {
+  const cmp = (0, _sort.descendingComparator)(rowA, rowB, 'number3', 'desc');
   expect(Math.sign(cmp)).toEqual(0);
 });