@helpscout/hsds-react/components/Table/Table.testUtils.js

React component library for Help Scout's Design System

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.createFakeCustomers = createFakeCustomers;
exports.getCurrentPageData = getCurrentPageData;
exports.sortData = sortData;
exports.compoundColumns = exports.columsnWithCustomHeaderNameCell = exports.columsnWithCustomNameCell = exports.defaultColumnsCustomContent = exports.columnsChooser = exports.defaultColumns = void 0;

var _react = _interopRequireDefault(require("react"));

var _helix = require("@helpscout/helix");

var _Truncate = _interopRequireDefault(require("../Truncate"));

var _jsxRuntime = require("react/jsx-runtime");

/* istanbul ignore file */
var defaultColumns = [{
  title: 'Name',
  columnKey: 'name',
  width: '25%'
}, {
  title: 'Company',
  columnKey: 'companyName',
  width: '25%'
}, {
  title: 'Email',
  columnKey: 'emails',
  width: '25%'
}, {
  title: 'Last Seen',
  columnKey: 'lastSeen',
  width: '25%'
}];
exports.defaultColumns = defaultColumns;
var columnsChooser = [{
  title: 'Name',
  columnKey: 'name',
  width: '25%',
  group: 'Customer',
  show: true,
  disabledForChoosing: true
}, {
  title: 'Company',
  columnKey: 'companyName',
  width: '25%',
  group: 'Customer',
  show: true
}, {
  title: 'Email',
  columnKey: 'emails',
  width: '25%',
  group: 'Properties',
  show: true
}, {
  title: 'Last Seen',
  columnKey: 'lastSeen',
  width: '25%',
  show: false
}];
exports.columnsChooser = columnsChooser;
var defaultColumnsCustomContent = [{
  title: 'Name',
  columnKey: 'name',
  width: '25%',
  renderHeaderCell: function renderHeaderCell(column) {
    return /*#__PURE__*/(0, _jsxRuntime.jsx)("em", {
      children: column.title
    });
  },
  renderCell: function renderCell(_ref) {
    var name = _ref.name;
    return /*#__PURE__*/(0, _jsxRuntime.jsx)("strong", {
      children: name
    });
  }
}, {
  title: 'Company',
  renderHeaderCell: {
    iconName: 'chat'
  },
  columnKey: 'companyName',
  width: '25%'
}, {
  title: 'Email',
  columnKey: 'emails',
  width: '25%'
}, {
  title: 'Last Seen',
  columnKey: 'lastSeen',
  width: '25%'
}];
exports.defaultColumnsCustomContent = defaultColumnsCustomContent;
var columsnWithCustomNameCell = [{
  title: 'Name',
  columnKey: 'name',
  width: '25%',
  renderCell: function renderCell(_ref2) {
    var name = _ref2.name;
    return /*#__PURE__*/(0, _jsxRuntime.jsx)("strong", {
      style: {
        color: 'dodgerblue'
      },
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Truncate.default, {
        showTooltipOnTruncate: true,
        type: "end",
        limit: 15,
        children: name
      })
    });
  }
}, {
  title: 'Company',
  columnKey: 'companyName',
  width: '25%'
}, {
  title: 'Email',
  columnKey: 'emails',
  width: '25%',
  renderCell: function renderCell(_ref3) {
    var emails = _ref3.emails;
    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Truncate.default, {
      type: "end",
      limit: 12,
      children: emails
    });
  }
}, {
  title: 'Last Seen',
  columnKey: 'lastSeen',
  width: '25%'
}];
exports.columsnWithCustomNameCell = columsnWithCustomNameCell;
var columsnWithCustomHeaderNameCell = [{
  title: 'Name',
  columnKey: 'name',
  width: '34%',
  renderHeaderCell: function renderHeaderCell(column) {
    return /*#__PURE__*/(0, _jsxRuntime.jsx)("em", {
      style: {
        textShadow: '0 0 2px darkred, 0 0 8px firebrick',
        fontSize: '18px',
        color: 'white'
      },
      children: column.title
    });
  }
}, {
  title: 'Company',
  columnKey: 'companyName',
  width: '33%',
  renderHeaderCell: function renderHeaderCell(column) {
    return /*#__PURE__*/(0, _jsxRuntime.jsx)("em", {
      style: {
        textShadow: '0 0 2px darkblue, 0 0 8px indigo',
        fontSize: '18px',
        color: 'white'
      },
      children: column.title
    });
  }
}, {
  title: 'Email',
  columnKey: 'emails',
  width: '33%',
  renderHeaderCell: function renderHeaderCell(column) {
    return /*#__PURE__*/(0, _jsxRuntime.jsx)("em", {
      style: {
        textShadow: '0 0 2px darkgreen, 0 0 8px seagreen',
        fontSize: '18px',
        color: 'white'
      },
      children: column.title
    });
  }
}];
exports.columsnWithCustomHeaderNameCell = columsnWithCustomHeaderNameCell;
var compoundColumns = [{
  title: 'Customer (name & company)',
  columnKey: ['name', 'companyName'],
  width: '33%'
}, {
  title: 'Customer (name & email)',
  columnKey: ['name', 'emails'],
  width: '33%',
  renderCell: function renderCell(_ref4) {
    var name = _ref4.name,
        emails = _ref4.emails;
    return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("strong", {
        children: name
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("br", {}), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
        children: emails
      })]
    });
  }
}, {
  title: 'Email',
  columnKey: 'emails',
  width: '34%',
  renderCell: function renderCell(_ref5) {
    var emails = _ref5.emails;
    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Truncate.default, {
      type: "end",
      limit: 15,
      children: emails
    });
  }
}];
exports.compoundColumns = compoundColumns;

function createFakeCustomers(_ref6) {
  var amount = _ref6.amount,
      multipleEmails = _ref6.multipleEmails,
      longNames = _ref6.longNames;
  var emailsAmount = multipleEmails ? Math.floor(Math.random() * 3) + 1 : 1;
  var emails = [];

  for (var j = 0; j < emailsAmount; j++) {
    emails.push(_helix.faker.internet.email());
  }

  return (0, _helix.createSpec)({
    id: _helix.faker.datatype.uuid(),
    firstName: _helix.faker.name.firstName(),
    middleName: _helix.faker.name.firstName(),
    lastName: _helix.faker.name.lastName(),
    lastName2: _helix.faker.name.lastName(),
    name: (0, _helix.derived)(function (props) {
      var firstName = props.firstName,
          middleName = props.middleName,
          lastName = props.lastName,
          lastName2 = props.lastName2;
      return !longNames ? firstName + " " + lastName : firstName + " " + middleName + " " + lastName + " " + lastName2;
    }),
    jobTitle: _helix.faker.name.jobTitle(),
    companyName: _helix.faker.company.companyName(),
    days: _helix.faker.datatype.number(100),
    lastSeen: (0, _helix.derived)(function (props) {
      var days = props.days;
      return days + " days ago";
    }),
    emails: emails.length === 1 ? emails[0] : emails
  }).generate(amount);
}

function getCurrentPageData(data, pageNumber) {
  // simulate an API call here
  return new Promise(function (resolve, reject) {
    setTimeout(function () {
      var rowsPerPage = 10;
      var page = data.slice(rowsPerPage * pageNumber - rowsPerPage, rowsPerPage * pageNumber);
      resolve(page);
    }, 1000);
  });
}

function sortData(data, columnKey, order) {
  // simulate an API call here
  return new Promise(function (resolve, reject) {
    setTimeout(function () {
      var sorted = data.sort(function (a, b) {
        if (a[columnKey] < b[columnKey]) {
          return order === 'descending' ? -1 : 1;
        }

        if (a[columnKey] > b[columnKey]) {
          return order === 'descending' ? 1 : -1;
        }

        return 0;
      });
      resolve(sorted);
    }, 1000);
  });
}