@bigbinary/neeto-molecules 1.0.0

package/dist/DateRangeFilter.cjs.js

@@ -0,0 +1,214 @@
+'use strict';
+
+var React = require('react');
+var initializers = require('@bigbinary/neeto-commons-frontend/initializers');
+var neetoui = require('@bigbinary/neetoui');
+var reactI18next = require('react-i18next');
+var dayjs = require('dayjs');
+var i18next = require('i18next');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var dayjs__default = /*#__PURE__*/_interopDefaultLegacy(dayjs);
+
+function _arrayWithHoles(arr) {
+  if (Array.isArray(arr)) return arr;
+}
+
+function _iterableToArrayLimit(arr, i) {
+  var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"];
+  if (null != _i) {
+    var _s,
+      _e,
+      _x,
+      _r,
+      _arr = [],
+      _n = !0,
+      _d = !1;
+    try {
+      if (_x = (_i = _i.call(arr)).next, 0 === i) {
+        if (Object(_i) !== _i) return;
+        _n = !1;
+      } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0);
+    } catch (err) {
+      _d = !0, _e = err;
+    } finally {
+      try {
+        if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return;
+      } finally {
+        if (_d) throw _e;
+      }
+    }
+    return _arr;
+  }
+}
+
+function _arrayLikeToArray(arr, len) {
+  if (len == null || len > arr.length) len = arr.length;
+  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+  return arr2;
+}
+
+function _unsupportedIterableToArray(o, minLen) {
+  if (!o) return;
+  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+  var n = Object.prototype.toString.call(o).slice(8, -1);
+  if (n === "Object" && o.constructor) n = o.constructor.name;
+  if (n === "Map" || n === "Set") return Array.from(o);
+  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+}
+
+function _nonIterableRest() {
+  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+
+function _slicedToArray(arr, i) {
+  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+}
+
+var quarterOfYear = require("dayjs/plugin/quarterOfYear");
+dayjs__default["default"].extend(quarterOfYear);
+var defaultTimePeriodOptions = function defaultTimePeriodOptions() {
+  var today = dayjs__default["default"]().startOf("day");
+  var startOfLastWeek = today.subtract(7, "day").startOf("week");
+  var endOfLastWeek = today.subtract(7, "day").endOf("week");
+  var lastMonthStart = today.subtract(1, "month").startOf("month");
+  var lastMonthEnd = today.subtract(1, "month").endOf("month");
+  var thisQuarterStart = dayjs__default["default"]().startOf("quarter");
+  var thisQuarterEnd = dayjs__default["default"]().endOf("quarter");
+  var lastQuarterStart = dayjs__default["default"]().subtract(1, "quarter").startOf("quarter");
+  var lastQuarterEnd = dayjs__default["default"]().subtract(1, "quarter").endOf("quarter");
+  var startOf24Hours = dayjs__default["default"]().subtract(24, "hour");
+  var now = dayjs__default["default"]();
+  var startOfLast7Days = dayjs__default["default"]().subtract(7, "day");
+  var startOfWeek = dayjs__default["default"]().startOf("week");
+  var startOfLast30Days = dayjs__default["default"]().subtract(30, "day");
+  var startOfMonth = today.startOf("month");
+  return [{
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.allTime"),
+    value: {
+      startDate: null,
+      endDate: null,
+      rangeType: "all"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.last24Hours"),
+    value: {
+      startDate: startOf24Hours,
+      endDate: now,
+      rangeType: "hours"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.last7Days"),
+    value: {
+      startDate: startOfLast7Days,
+      endDate: now,
+      rangeType: "days"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.thisWeek"),
+    value: {
+      startDate: startOfWeek,
+      endDate: now,
+      rangeType: "week"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.lastWeek"),
+    value: {
+      startDate: startOfLastWeek,
+      endDate: endOfLastWeek,
+      rangeType: "week"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.last30Days"),
+    value: {
+      startDate: startOfLast30Days,
+      endDate: now,
+      rangeType: "days"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.thisMonth"),
+    value: {
+      startDate: startOfMonth,
+      endDate: now,
+      rangeType: "month"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.lastMonth"),
+    value: {
+      startDate: lastMonthStart,
+      endDate: lastMonthEnd,
+      rangeType: "month"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.thisQuarter"),
+    value: {
+      startDate: thisQuarterStart,
+      endDate: thisQuarterEnd,
+      rangeType: "quarter"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.lastQuarter"),
+    value: {
+      startDate: lastQuarterStart,
+      endDate: lastQuarterEnd,
+      rangeType: "quarter"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.customDuration"),
+    value: "custom"
+  }];
+};
+
+var DateRangeFilter = function DateRangeFilter(_ref) {
+  var _globalProps$user;
+  var timePeriodOptions = _ref.timePeriodOptions,
+    timePeriod = _ref.timePeriod,
+    setTimePeriod = _ref.setTimePeriod;
+  var _useTranslation = reactI18next.useTranslation(),
+    t = _useTranslation.t;
+  var customDurationLabel = t("neetoMolecules.dateRangeFilter.timePeriodOptions.customDuration");
+  var isCustom = timePeriod.label === customDurationLabel;
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "flex pr-2",
+    "data-testid": "date-range-filter"
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "w-40"
+  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Select, {
+    required: true,
+    getOptionValue: function getOptionValue(_ref2) {
+      var label = _ref2.label;
+      return label;
+    },
+    options: timePeriodOptions || defaultTimePeriodOptions(),
+    value: timePeriod,
+    onChange: function onChange(option) {
+      return setTimePeriod(option);
+    }
+  })), isCustom && /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "w-2/3",
+    "data-testid": "date-range-filter-custom-duration-picker"
+  }, /*#__PURE__*/React__default["default"].createElement(neetoui.DatePicker, {
+    autoFocus: true,
+    className: "ml-3 w-full",
+    dateFormat: initializers.globalProps === null || initializers.globalProps === void 0 ? void 0 : (_globalProps$user = initializers.globalProps.user) === null || _globalProps$user === void 0 ? void 0 : _globalProps$user.dateFormat,
+    picker: "date",
+    type: "range",
+    onChange: function onChange(_, _ref3) {
+      var _ref4 = _slicedToArray(_ref3, 2),
+        startDate = _ref4[0],
+        endDate = _ref4[1];
+      setTimePeriod({
+        label: customDurationLabel,
+        value: {
+          startDate: startDate,
+          endDate: endDate,
+          rangeType: "custom"
+        }
+      });
+    }
+  })));
+};
+
+module.exports = DateRangeFilter;

package/dist/DateRangeFilter.js

@@ -0,0 +1,207 @@
+import React from 'react';
+import { globalProps } from '@bigbinary/neeto-commons-frontend/initializers';
+import { Select, DatePicker } from '@bigbinary/neetoui';
+import { useTranslation } from 'react-i18next';
+import dayjs from 'dayjs';
+import { t } from 'i18next';
+
+function _arrayWithHoles(arr) {
+  if (Array.isArray(arr)) return arr;
+}
+
+function _iterableToArrayLimit(arr, i) {
+  var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"];
+  if (null != _i) {
+    var _s,
+      _e,
+      _x,
+      _r,
+      _arr = [],
+      _n = !0,
+      _d = !1;
+    try {
+      if (_x = (_i = _i.call(arr)).next, 0 === i) {
+        if (Object(_i) !== _i) return;
+        _n = !1;
+      } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0);
+    } catch (err) {
+      _d = !0, _e = err;
+    } finally {
+      try {
+        if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return;
+      } finally {
+        if (_d) throw _e;
+      }
+    }
+    return _arr;
+  }
+}
+
+function _arrayLikeToArray(arr, len) {
+  if (len == null || len > arr.length) len = arr.length;
+  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+  return arr2;
+}
+
+function _unsupportedIterableToArray(o, minLen) {
+  if (!o) return;
+  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+  var n = Object.prototype.toString.call(o).slice(8, -1);
+  if (n === "Object" && o.constructor) n = o.constructor.name;
+  if (n === "Map" || n === "Set") return Array.from(o);
+  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+}
+
+function _nonIterableRest() {
+  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+
+function _slicedToArray(arr, i) {
+  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+}
+
+var quarterOfYear = require("dayjs/plugin/quarterOfYear");
+dayjs.extend(quarterOfYear);
+var defaultTimePeriodOptions = function defaultTimePeriodOptions() {
+  var today = dayjs().startOf("day");
+  var startOfLastWeek = today.subtract(7, "day").startOf("week");
+  var endOfLastWeek = today.subtract(7, "day").endOf("week");
+  var lastMonthStart = today.subtract(1, "month").startOf("month");
+  var lastMonthEnd = today.subtract(1, "month").endOf("month");
+  var thisQuarterStart = dayjs().startOf("quarter");
+  var thisQuarterEnd = dayjs().endOf("quarter");
+  var lastQuarterStart = dayjs().subtract(1, "quarter").startOf("quarter");
+  var lastQuarterEnd = dayjs().subtract(1, "quarter").endOf("quarter");
+  var startOf24Hours = dayjs().subtract(24, "hour");
+  var now = dayjs();
+  var startOfLast7Days = dayjs().subtract(7, "day");
+  var startOfWeek = dayjs().startOf("week");
+  var startOfLast30Days = dayjs().subtract(30, "day");
+  var startOfMonth = today.startOf("month");
+  return [{
+    label: t("neetoMolecules.dateRangeFilter.timePeriodOptions.allTime"),
+    value: {
+      startDate: null,
+      endDate: null,
+      rangeType: "all"
+    }
+  }, {
+    label: t("neetoMolecules.dateRangeFilter.timePeriodOptions.last24Hours"),
+    value: {
+      startDate: startOf24Hours,
+      endDate: now,
+      rangeType: "hours"
+    }
+  }, {
+    label: t("neetoMolecules.dateRangeFilter.timePeriodOptions.last7Days"),
+    value: {
+      startDate: startOfLast7Days,
+      endDate: now,
+      rangeType: "days"
+    }
+  }, {
+    label: t("neetoMolecules.dateRangeFilter.timePeriodOptions.thisWeek"),
+    value: {
+      startDate: startOfWeek,
+      endDate: now,
+      rangeType: "week"
+    }
+  }, {
+    label: t("neetoMolecules.dateRangeFilter.timePeriodOptions.lastWeek"),
+    value: {
+      startDate: startOfLastWeek,
+      endDate: endOfLastWeek,
+      rangeType: "week"
+    }
+  }, {
+    label: t("neetoMolecules.dateRangeFilter.timePeriodOptions.last30Days"),
+    value: {
+      startDate: startOfLast30Days,
+      endDate: now,
+      rangeType: "days"
+    }
+  }, {
+    label: t("neetoMolecules.dateRangeFilter.timePeriodOptions.thisMonth"),
+    value: {
+      startDate: startOfMonth,
+      endDate: now,
+      rangeType: "month"
+    }
+  }, {
+    label: t("neetoMolecules.dateRangeFilter.timePeriodOptions.lastMonth"),
+    value: {
+      startDate: lastMonthStart,
+      endDate: lastMonthEnd,
+      rangeType: "month"
+    }
+  }, {
+    label: t("neetoMolecules.dateRangeFilter.timePeriodOptions.thisQuarter"),
+    value: {
+      startDate: thisQuarterStart,
+      endDate: thisQuarterEnd,
+      rangeType: "quarter"
+    }
+  }, {
+    label: t("neetoMolecules.dateRangeFilter.timePeriodOptions.lastQuarter"),
+    value: {
+      startDate: lastQuarterStart,
+      endDate: lastQuarterEnd,
+      rangeType: "quarter"
+    }
+  }, {
+    label: t("neetoMolecules.dateRangeFilter.timePeriodOptions.customDuration"),
+    value: "custom"
+  }];
+};
+
+var DateRangeFilter = function DateRangeFilter(_ref) {
+  var _globalProps$user;
+  var timePeriodOptions = _ref.timePeriodOptions,
+    timePeriod = _ref.timePeriod,
+    setTimePeriod = _ref.setTimePeriod;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var customDurationLabel = t("neetoMolecules.dateRangeFilter.timePeriodOptions.customDuration");
+  var isCustom = timePeriod.label === customDurationLabel;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "flex pr-2",
+    "data-testid": "date-range-filter"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "w-40"
+  }, /*#__PURE__*/React.createElement(Select, {
+    required: true,
+    getOptionValue: function getOptionValue(_ref2) {
+      var label = _ref2.label;
+      return label;
+    },
+    options: timePeriodOptions || defaultTimePeriodOptions(),
+    value: timePeriod,
+    onChange: function onChange(option) {
+      return setTimePeriod(option);
+    }
+  })), isCustom && /*#__PURE__*/React.createElement("div", {
+    className: "w-2/3",
+    "data-testid": "date-range-filter-custom-duration-picker"
+  }, /*#__PURE__*/React.createElement(DatePicker, {
+    autoFocus: true,
+    className: "ml-3 w-full",
+    dateFormat: globalProps === null || globalProps === void 0 ? void 0 : (_globalProps$user = globalProps.user) === null || _globalProps$user === void 0 ? void 0 : _globalProps$user.dateFormat,
+    picker: "date",
+    type: "range",
+    onChange: function onChange(_, _ref3) {
+      var _ref4 = _slicedToArray(_ref3, 2),
+        startDate = _ref4[0],
+        endDate = _ref4[1];
+      setTimePeriod({
+        label: customDurationLabel,
+        value: {
+          startDate: startDate,
+          endDate: endDate,
+          rangeType: "custom"
+        }
+      });
+    }
+  })));
+};
+
+export { DateRangeFilter as default };