oa-componentbook 1.0.1-stage.45 → 1.0.1-stage.47

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -45,6 +45,8 @@ CollapseIcon.propTypes = {
45
45
  * @param {string | number} [key] - Key to be used for the collapsible panel.
46
46
  * @param {string | number} [defaultActiveKey] - Key of the collapsible panel that should be active by default.
47
47
  * @param {boolean} [hasContentPadding=true] - Whether to apply content padding to the collapsible panel or not.
48
+ * @param {Function} [onChange=() => {}] - Function to be called when the panel is expanded or collapsed.
49
+ * @param {string | number} [activeKey] - Key of the collapsible panel that is currently active.
48
50
  */
49
51
  function Accordion(_ref2) {
50
52
  let {
@@ -55,7 +57,10 @@ function Accordion(_ref2) {
55
57
  smallText,
56
58
  key,
57
59
  defaultActiveKey,
58
- hasContentPadding // New prop to determine whether to apply contentPadding
60
+ hasContentPadding,
61
+ // New prop to determine whether to apply contentPadding
62
+ onChange,
63
+ activeKey
59
64
  } = _ref2;
60
65
  const themeConfig = {
61
66
  components: {
@@ -70,11 +75,12 @@ function Accordion(_ref2) {
70
75
  }, /*#__PURE__*/_react.default.createElement(_styles.CollapseStyle, null, /*#__PURE__*/_react.default.createElement(_antd.Collapse, {
71
76
  expandIcon: CollapseIcon,
72
77
  expandIconPosition: "end",
73
- defaultActiveKey: disabled ? '-1' : defaultActiveKey
78
+ defaultActiveKey: disabled ? '-1' : defaultActiveKey,
79
+ onChange: onChange
74
80
  }, /*#__PURE__*/_react.default.createElement(_antd.Collapse.Panel, {
75
81
  "data-test": dataTest ? "".concat(dataTest, "--complete") : undefined,
76
82
  collapsible: disabled ? 'disabled' : undefined,
77
- key: key,
83
+ key: activeKey || key,
78
84
  header: /*#__PURE__*/_react.default.createElement("div", {
79
85
  "data-test": dataTest ? "".concat(dataTest, "--header") : undefined,
80
86
  className: "type-button-500"
@@ -92,7 +98,9 @@ Accordion.propTypes = {
92
98
  hasContentPadding: _propTypes.default.bool,
93
99
  // New prop for controlling contentPadding
94
100
  key: _propTypes.default.string,
95
- defaultActiveKey: _propTypes.default.string
101
+ defaultActiveKey: _propTypes.default.string,
102
+ onChange: _propTypes.default.func,
103
+ activeKey: _propTypes.default.string || _propTypes.default.number
96
104
  };
97
105
  Accordion.defaultProps = {
98
106
  body: '',
@@ -101,6 +109,9 @@ Accordion.defaultProps = {
101
109
  smallText: '',
102
110
  key: '1',
103
111
  defaultActiveKey: '1',
104
- hasContentPadding: true // Default value for contentPadding
112
+ hasContentPadding: true,
113
+ // Default value for contentPadding
114
+ onChange: () => {},
115
+ activeKey: null
105
116
  };
106
117
  var _default = exports.default = Accordion;
@@ -27,6 +27,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
27
27
  * @param {string} fontColor - The color of the text.
28
28
  * @param {object} iconConfig - Configuration for the icon.
29
29
  * @param {string} title - The title to be displayed.
30
+ * @param {string} borderColor - The border color of the component.
30
31
  *
31
32
  * @returns {ReactElement} A styled component with the specified properties.
32
33
  */
@@ -37,7 +38,8 @@ function CustomInfo(_ref) {
37
38
  description,
38
39
  fontColor,
39
40
  iconConfig,
40
- title
41
+ title,
42
+ borderColor
41
43
  } = _ref;
42
44
  /**
43
45
  * Renders the icon based on the presence of a title.
@@ -65,7 +67,8 @@ function CustomInfo(_ref) {
65
67
  }, renderIcon()) : renderIcon();
66
68
  };
67
69
  return /*#__PURE__*/_react.default.createElement(_styles.InfoContainer, {
68
- $color: color
70
+ $color: color,
71
+ $borderColor: borderColor
69
72
  }, /*#__PURE__*/_react.default.createElement(_styles.RowFlex, null, iconConfig.position === 'left' && conditionallyAddTooltipToIcon(), /*#__PURE__*/_react.default.createElement(_styles.ColFlex, null, title && /*#__PURE__*/_react.default.createElement(_Typography.default, {
70
73
  color: fontColor,
71
74
  typography: "type-t2-700"
@@ -96,7 +99,8 @@ CustomInfo.propTypes = {
96
99
  position: _propTypes.default.oneOf(['left', 'right']),
97
100
  tooltipText: _propTypes.default.string
98
101
  }),
99
- title: _propTypes.default.string
102
+ title: _propTypes.default.string,
103
+ borderColor: _propTypes.default.string
100
104
  };
101
105
  CustomInfo.defaultProps = {
102
106
  buttonConfig: {
@@ -110,5 +114,6 @@ CustomInfo.defaultProps = {
110
114
  },
111
115
  fontColor: 'primary-content',
112
116
  title: '',
113
- description: ''
117
+ description: '',
118
+ borderColor: ''
114
119
  };
@@ -8,8 +8,8 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
8
8
  var _templateObject, _templateObject2, _templateObject3;
9
9
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
10
10
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
11
- const RowFlex = exports.RowFlex = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
12
- const ColFlex = exports.ColFlex = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n gap: 8px;\n"])));
11
+ const RowFlex = exports.RowFlex = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
12
+ const ColFlex = exports.ColFlex = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n gap: 8px;\n"])));
13
13
  const InfoContainer = exports.InfoContainer = (0, _styledComponents.default)(RowFlex).attrs({
14
14
  as: 'section'
15
- })(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n padding: 12px;\n align-items: center;\n border-radius: 8px;\n background-color: var(--color-", ");\n \n button {\n margin-left: 8px;\n };\n"])), props => props.$color);
15
+ })(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n padding: 12px;\n align-items: center;\n border-radius: 8px;\n background-color: var(--color-", ");\n border: 1px solid var(--color-", ");\n\n button {\n margin-left: 8px;\n }\n"])), props => props.$color, props => props.$borderColor);
package/build/index.js CHANGED
@@ -353,12 +353,6 @@ Object.defineProperty(exports, "GridLayout", {
353
353
  return _GridLayout.default;
354
354
  }
355
355
  });
356
- Object.defineProperty(exports, "ImageCarouselWidget", {
357
- enumerable: true,
358
- get: function get() {
359
- return _ImageCarouselWidget.default;
360
- }
361
- });
362
356
  Object.defineProperty(exports, "KeyValueWidget", {
363
357
  enumerable: true,
364
358
  get: function get() {
@@ -503,10 +497,10 @@ Object.defineProperty(exports, "TrackShipmentWidget", {
503
497
  return _TrackShipmentWidget.default;
504
498
  }
505
499
  });
506
- Object.defineProperty(exports, "TrackShipmentWidgetDev", {
500
+ Object.defineProperty(exports, "TrackShipmentWidgetList", {
507
501
  enumerable: true,
508
502
  get: function get() {
509
- return _TrackShipmentWidget2.default;
503
+ return _TrackShipmentWidgetList.default;
510
504
  }
511
505
  });
512
506
  Object.defineProperty(exports, "Typographies", {
@@ -628,6 +622,7 @@ var _SparePartsWidget = _interopRequireDefault(require("./widgets/oa-widget-spar
628
622
  var _SparePartsCollapseWidget = _interopRequireDefault(require("./widgets/oa-widget-spare-part/SparePartsCollapseWidget"));
629
623
  var _StageTimelineWidget = _interopRequireWildcard(require("./widgets/oa-widget-stage-timeline/StageTimelineWidget"));
630
624
  var _TrackShipmentWidget = _interopRequireDefault(require("./widgets/oa-widget-track-shipment/TrackShipmentWidget"));
625
+ var _TrackShipmentWidgetList = _interopRequireDefault(require("./widgets/oa-widget-track-shipment-list/TrackShipmentWidgetList"));
631
626
  var _UploadDownloadWidget = _interopRequireDefault(require("./widgets/oa-widget-upload-download/UploadDownloadWidget"));
632
627
  var _ViewHistoryWidget = _interopRequireDefault(require("./widgets/oa-widget-view-history/ViewHistoryWidget"));
633
628
  var _ViewPreviousDescriptionWidget = _interopRequireDefault(require("./widgets/oa-widget-view-previous-description/ViewPreviousDescriptionWidget"));
@@ -638,7 +633,6 @@ var _ServiceCard = _interopRequireDefault(require("./widgets/oa-widget-serviceca
638
633
  var _CustomProgressBar = _interopRequireDefault(require("./components/oa-component-progress-bar/CustomProgressBar"));
639
634
  var _CustomHeaderWidget = _interopRequireDefault(require("./widgets/oa-widget-header/CustomHeaderWidget"));
640
635
  var _CustomPinPatternCaptureWidget = _interopRequireDefault(require("./widgets/oa-widget-input-pattern-pin/CustomPinPatternCaptureWidget"));
641
- var _ImageCarouselWidget = _interopRequireDefault(require("./widgets/oa-widget-image-carousel/ImageCarouselWidget"));
642
636
  var _CustomFormWidget = _interopRequireDefault(require("./widgets/oa-widget-form/CustomFormWidget"));
643
637
  var _DateDropDown = _interopRequireDefault(require("./widgets/oa-widget-date-dropdown/DateDropDown"));
644
638
  var _CustomRating = _interopRequireDefault(require("./components/oa-component-rating/CustomRating"));
@@ -649,7 +643,6 @@ var _Preview = _interopRequireDefault(require("./widgets/oa-widget-preview/Previ
649
643
  var _PincodeBaseLocation = _interopRequireDefault(require("./widgets/oa-widget-pincode-base-location/PincodeBaseLocation"));
650
644
  var _MapBaseLocation = _interopRequireDefault(require("./widgets/oa-widget-map-base-location/MapBaseLocation"));
651
645
  var _CustomTimeline2 = _interopRequireDefault(require("./dev/oa-component-timeline/CustomTimeline"));
652
- var _TrackShipmentWidget2 = _interopRequireDefault(require("./dev/oa-widget-track-shipment/TrackShipmentWidget"));
653
646
  var _DocUploadCardWidget2 = _interopRequireDefault(require("./dev/oa-widget-document-upload-card/DocUploadCardWidget"));
654
647
  var _CustomUpload2 = _interopRequireDefault(require("./dev/oa-component-upload/CustomUpload"));
655
648
  var _PaymentAndConsent = _interopRequireDefault(require("./layout/paymentAndConsent/PaymentAndConsent"));
@@ -82,7 +82,8 @@ function AddSparePartCollapseWidget(_ref) {
82
82
  setActiveKey(Array.from(initialSelectedItems).map(String)); // Set initially selected items as active keys
83
83
  }, [selectedItems]);
84
84
  (0, _react.useEffect)(() => {
85
- const sortedItems = [...selectedItems.map(item => items && items.find(i => i.id === item.scopeId)).filter(Boolean), ...items.filter(item => !selectedItems.some(selected => selected.scopeId === item.id))];
85
+ var _selectedItems$map$fi, _items$filter;
86
+ const sortedItems = [...((_selectedItems$map$fi = selectedItems === null || selectedItems === void 0 ? void 0 : selectedItems.map(item => items && items.find(i => i.id === item.scopeId)).filter(Boolean)) !== null && _selectedItems$map$fi !== void 0 ? _selectedItems$map$fi : []), ...((_items$filter = items === null || items === void 0 ? void 0 : items.filter(item => !selectedItems.some(selected => selected.scopeId === item.id))) !== null && _items$filter !== void 0 ? _items$filter : [])];
86
87
  setFilteredItems(sortedItems);
87
88
  }, [items, selectedItems]);
88
89
 
@@ -141,7 +142,7 @@ function AddSparePartCollapseWidget(_ref) {
141
142
  }
142
143
  }, 0);
143
144
  };
144
- const isNumeric = value => /^\d*$/.test(value); // Regular expression to check if the value is numeric
145
+ const isNumeric = value => /^\d+(\.\d{0,2})?$/.test(value); // Regular expression to check if the value is numeric
145
146
 
146
147
  /**
147
148
  * Handles changes in the fields of the items.
@@ -163,11 +164,11 @@ function AddSparePartCollapseWidget(_ref) {
163
164
  });
164
165
  setFormValues(updatedFormValues);
165
166
  } else {
166
- openNotification({
167
- title: 'Error',
168
- description: 'Please enter only numeric values.',
169
- type: 'failure'
170
- });
167
+ // openNotification({
168
+ // title: 'Error',
169
+ // description: 'Please enter only numeric values 146.',
170
+ // type: 'failure',
171
+ // });
171
172
  }
172
173
  };
173
174
 
@@ -179,7 +180,7 @@ function AddSparePartCollapseWidget(_ref) {
179
180
  * @param {React.KeyboardEvent} event - The event triggered by the key press.
180
181
  */
181
182
  const handleKeyPress = event => {
182
- if (!/[0-9]/.test(event.key)) {
183
+ if (!/[\d.]/.test(event.key) || event.key === '.' && event.target.value.includes('.')) {
183
184
  event.preventDefault();
184
185
  openNotification({
185
186
  title: 'Error',
@@ -314,7 +315,7 @@ function AddSparePartCollapseWidget(_ref) {
314
315
  onChange: e => onFieldChange(item.id, 'cost', e.target.value),
315
316
  onKeyPress: handleKeyPress,
316
317
  inputMode: "numeric",
317
- pattern: "[0-9]*",
318
+ pattern: "[0-9]+(\\.[0-9]{0,2})?",
318
319
  value: ((_formValues$item$id = formValues[item.id]) === null || _formValues$item$id === void 0 ? void 0 : _formValues$item$id.cost) !== null && ((_formValues$item$id2 = formValues[item.id]) === null || _formValues$item$id2 === void 0 ? void 0 : _formValues$item$id2.cost) !== undefined ? (_formValues$item$id3 = formValues[item.id]) === null || _formValues$item$id3 === void 0 ? void 0 : _formValues$item$id3.cost : '',
319
320
  disabled: isItemDisabled
320
321
  })), !disableDiscount && /*#__PURE__*/_react.default.createElement("div", {
@@ -9,12 +9,14 @@ exports.default = void 0;
9
9
  var _react = _interopRequireWildcard(require("react"));
10
10
  var _propTypes = _interopRequireDefault(require("prop-types"));
11
11
  var _FileCopyOutlined = _interopRequireDefault(require("@material-ui/icons/FileCopyOutlined"));
12
+ var _InfoOutlined = _interopRequireDefault(require("@material-ui/icons/InfoOutlined"));
12
13
  var _AddressWidget = _interopRequireDefault(require("../oa-widget-address/AddressWidget"));
13
14
  var _CustomTable = _interopRequireDefault(require("../../components/oa-component-table/CustomTable"));
14
15
  var _CustomTimeline = _interopRequireDefault(require("../../components/oa-component-timeline/CustomTimeline"));
15
16
  var _MaterialIcon = _interopRequireDefault(require("../../components/oa-component-icons/MaterialIcon"));
16
17
  var _styles = require("./styles");
17
18
  var _CustomNotification = _interopRequireDefault(require("../../components/oa-component-notification/CustomNotification"));
19
+ var _CustomInfo = _interopRequireDefault(require("../../components/oa-component-info/CustomInfo"));
18
20
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
19
21
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
20
22
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -41,7 +43,9 @@ function TrackShipmentWidget(_ref) {
41
43
  tableData,
42
44
  title,
43
45
  toAddress,
44
- heading
46
+ heading,
47
+ partnerName,
48
+ errorReason
45
49
  } = _ref;
46
50
  // local variables
47
51
  const deilveryStageText = 'SHIPMENT DELIVERED to Customer';
@@ -81,7 +85,7 @@ function TrackShipmentWidget(_ref) {
81
85
  const isOnDeliveryStage = Array.isArray(tableData) && tableData.length > 0 && ((_tableData = tableData[tableData.length - 1]) === null || _tableData === void 0 ? void 0 : _tableData.oneassistDisplayStatus) === deilveryStageText && ((_tableData2 = tableData[tableData.length - 1]) === null || _tableData2 === void 0 ? void 0 : _tableData2.toDate) === null;
82
86
 
83
87
  // remove duplicate consicutive objects only show single unique objects
84
- const stepsData = tableData.map(item => ({
88
+ const stepsData = tableData === null || tableData === void 0 ? void 0 : tableData.map(item => ({
85
89
  title: item.oneassistDisplayStatus,
86
90
  status: getCircleClass(item, true)
87
91
  })).filter((item, index) => {
@@ -96,7 +100,7 @@ function TrackShipmentWidget(_ref) {
96
100
  className: "type-t1-500"
97
101
  }, title) : null, /*#__PURE__*/_react.default.createElement("h3", {
98
102
  className: "type-t1-500"
99
- }, heading), /*#__PURE__*/_react.default.createElement("p", {
103
+ }, heading), awbNumber && /*#__PURE__*/_react.default.createElement("p", {
100
104
  className: "type-b2-400 disFlex"
101
105
  }, "AWB Number:", awbNumber, awbNumber && /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
102
106
  icon: _FileCopyOutlined.default,
@@ -106,16 +110,30 @@ function TrackShipmentWidget(_ref) {
106
110
  cursor: 'pointer',
107
111
  color: '014FC5'
108
112
  }
109
- })), /*#__PURE__*/_react.default.createElement(_styles.AddressesContainer, null, /*#__PURE__*/_react.default.createElement(_AddressWidget.default, {
113
+ })), partnerName && /*#__PURE__*/_react.default.createElement("p", {
114
+ className: "type-b2-400 disFlex"
115
+ }, "Partner:", partnerName), fromAddress && toAddress && /*#__PURE__*/_react.default.createElement(_styles.AddressesContainer, null, /*#__PURE__*/_react.default.createElement(_AddressWidget.default, {
110
116
  address: fromAddress
111
117
  }), /*#__PURE__*/_react.default.createElement(_AddressWidget.default, {
112
118
  address: toAddress
113
- })), /*#__PURE__*/_react.default.createElement("div", {
119
+ })), (stepsData === null || stepsData === void 0 ? void 0 : stepsData.length) > 0 && /*#__PURE__*/_react.default.createElement("div", {
114
120
  className: "cstScroll"
115
121
  }, /*#__PURE__*/_react.default.createElement(_CustomTimeline.default, {
116
122
  currentStep: isOnDeliveryStage ? stepsData.length : stepsData.length - 1,
117
123
  stepsData: stepsData
118
- })), /*#__PURE__*/_react.default.createElement(_CustomTable.default, {
124
+ })), errorReason && /*#__PURE__*/_react.default.createElement("div", {
125
+ className: "margin-top-16 margin-bottom-16"
126
+ }, /*#__PURE__*/_react.default.createElement(_CustomInfo.default, {
127
+ iconConfig: {
128
+ icon: /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
129
+ color: "warning",
130
+ size: 24,
131
+ icon: _InfoOutlined.default
132
+ }),
133
+ position: 'left'
134
+ },
135
+ description: errorReason
136
+ })), (tableData === null || tableData === void 0 ? void 0 : tableData.length) > 0 && /*#__PURE__*/_react.default.createElement(_CustomTable.default, {
119
137
  bordered: true,
120
138
  rowKey: "key",
121
139
  columns: [{
@@ -158,6 +176,8 @@ function TrackShipmentWidget(_ref) {
158
176
  }
159
177
  TrackShipmentWidget.propTypes = {
160
178
  awbNumber: _propTypes.default.string.isRequired,
179
+ errorReason: _propTypes.default.string,
180
+ partnerName: _propTypes.default.string,
161
181
  fromAddress: _propTypes.default.shape({
162
182
  heading: _propTypes.default.string,
163
183
  addressLine1: _propTypes.default.string,
@@ -198,6 +218,8 @@ TrackShipmentWidget.propTypes = {
198
218
  })
199
219
  };
200
220
  TrackShipmentWidget.defaultProps = {
221
+ errorReason: '',
222
+ partnerName: '',
201
223
  fromAddress: {
202
224
  heading: ''
203
225
  },
@@ -0,0 +1,103 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ var _propTypes = _interopRequireDefault(require("prop-types"));
9
+ var _fn = require("./fn");
10
+ var _TrackShipmentWidget = _interopRequireDefault(require("../oa-widget-track-shipment/TrackShipmentWidget"));
11
+ var _Accordion = _interopRequireDefault(require("../../components/oa-component-accordion/Accordion"));
12
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
+ function TrackShipmentWidgetList(_ref) {
14
+ var _assignments$map;
15
+ let {
16
+ shipmentData,
17
+ onChange
18
+ } = _ref;
19
+ const assignments = (shipmentData === null || shipmentData === void 0 ? void 0 : shipmentData.assignments) || [];
20
+ if (assignments.length === 0) {
21
+ return /*#__PURE__*/_react.default.createElement(_TrackShipmentWidget.default, (0, _fn.getSingleShipmentHistory)(shipmentData));
22
+ }
23
+ if (assignments.length === 1) {
24
+ return /*#__PURE__*/_react.default.createElement(_TrackShipmentWidget.default, (0, _fn.getSingleShipmentHistory)(assignments[0]));
25
+ }
26
+ const lastReassignmentId = assignments && assignments.length > 0 ? assignments[assignments.length - 1].assignmentId || 0 : 0;
27
+ return assignments === null || assignments === void 0 || (_assignments$map = assignments.map) === null || _assignments$map === void 0 ? void 0 : _assignments$map.call(assignments, (item, index) => {
28
+ const {
29
+ assignmentId,
30
+ assignmentDate,
31
+ assignmentClosedTime,
32
+ status
33
+ } = item !== null && item !== void 0 ? item : {};
34
+ return /*#__PURE__*/_react.default.createElement("div", {
35
+ className: "margin-bottom-16",
36
+ key: assignmentId
37
+ }, /*#__PURE__*/_react.default.createElement(_Accordion.default, {
38
+ defaultActiveKey: lastReassignmentId,
39
+ activeKey: assignmentId,
40
+ body: /*#__PURE__*/_react.default.createElement(_TrackShipmentWidget.default, (0, _fn.getSingleShipmentHistory)(item)),
41
+ headerText: (0, _fn.headerText)(index, assignmentDate, assignmentClosedTime, status)
42
+ }));
43
+ });
44
+ }
45
+ const HistoryPropType = _propTypes.default.shape({
46
+ shipmentStatus: _propTypes.default.string.isRequired,
47
+ fromDate: _propTypes.default.string.isRequired,
48
+ toDate: _propTypes.default.string.isRequired,
49
+ partnerStatus: _propTypes.default.string,
50
+ customerDisplayStatus: _propTypes.default.string.isRequired,
51
+ oneassistDisplayStatus: _propTypes.default.string.isRequired,
52
+ stageConsistent: _propTypes.default.bool.isRequired
53
+ });
54
+ const AssignmentPropType = _propTypes.default.shape({
55
+ assignmentDate: _propTypes.default.number.isRequired,
56
+ assignmentClosedTime: _propTypes.default.number.isRequired,
57
+ logisticPartnerName: _propTypes.default.string.isRequired,
58
+ assignmentId: _propTypes.default.number.isRequired,
59
+ logisticPartnerRefNum: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
60
+ originAddressLine1: _propTypes.default.string.isRequired,
61
+ originDistrict: _propTypes.default.string.isRequired,
62
+ originPincode: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]).isRequired,
63
+ destAddressLine1: _propTypes.default.string.isRequired,
64
+ destDistrict: _propTypes.default.string,
65
+ destPincode: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]).isRequired,
66
+ history: _propTypes.default.arrayOf(HistoryPropType).isRequired,
67
+ origAddressFullName: _propTypes.default.string.isRequired,
68
+ destAddressFullName: _propTypes.default.string.isRequired,
69
+ assignments: _propTypes.default.arrayOf(_propTypes.default.shape({
70
+ logisticPartnerRefNum: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
71
+ originAddressLine1: _propTypes.default.string.isRequired,
72
+ originDistrict: _propTypes.default.string.isRequired,
73
+ originPincode: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]).isRequired,
74
+ destAddressLine1: _propTypes.default.string.isRequired,
75
+ destDistrict: _propTypes.default.string,
76
+ destPincode: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]).isRequired,
77
+ history: _propTypes.default.arrayOf(HistoryPropType).isRequired,
78
+ origAddressFullName: _propTypes.default.string.isRequired,
79
+ destAddressFullName: _propTypes.default.string.isRequired,
80
+ assignments: _propTypes.default.array // Placeholder to break recursion
81
+ }))
82
+ });
83
+ TrackShipmentWidgetList.propTypes = {
84
+ shipmentData: _propTypes.default.shape({
85
+ logisticPartnerRefNum: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
86
+ originAddressLine1: _propTypes.default.string.isRequired,
87
+ originDistrict: _propTypes.default.string.isRequired,
88
+ originPincode: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]).isRequired,
89
+ destAddressLine1: _propTypes.default.string.isRequired,
90
+ destDistrict: _propTypes.default.string,
91
+ destPincode: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]).isRequired,
92
+ history: _propTypes.default.arrayOf(HistoryPropType).isRequired,
93
+ origAddressFullName: _propTypes.default.string.isRequired,
94
+ destAddressFullName: _propTypes.default.string.isRequired,
95
+ assignments: _propTypes.default.arrayOf(AssignmentPropType)
96
+ }),
97
+ onChange: _propTypes.default.func
98
+ };
99
+ TrackShipmentWidgetList.defaultProps = {
100
+ shipmentData: {},
101
+ onChange: () => {}
102
+ };
103
+ var _default = exports.default = TrackShipmentWidgetList;
@@ -0,0 +1,69 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.isActive = exports.headerText = exports.getSingleShipmentHistory = exports.getDateString = exports.getCurrentShipmentLabel = void 0;
7
+ function numberToOrdinal(number) {
8
+ const suffixes = ['th', 'st', 'nd', 'rd'];
9
+ const value = number % 100;
10
+ const suffix = value >= 11 && value <= 13 ? suffixes[0] // 11th, 12th, 13th
11
+ : suffixes[number % 10] || suffixes[0]; // 1st, 2nd, 3rd, others
12
+ return "".concat(number).concat(suffix); // Use template literal correctly
13
+ }
14
+ const getDateFromEpoch = date => {
15
+ if (!date) {
16
+ return '';
17
+ }
18
+ const dateObj = new Date(date);
19
+ const day = dateObj.getDate();
20
+ const month = dateObj.getMonth();
21
+ const year = dateObj.getFullYear();
22
+ const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
23
+ return "".concat(day, " ").concat(months[month], " ").concat(year);
24
+ };
25
+ const getDateString = (startTime, endTime) => {
26
+ const startDate = getDateFromEpoch(startTime);
27
+ const endDate = getDateFromEpoch(endTime);
28
+ if (startDate === '' && endDate === '') {
29
+ return '';
30
+ }
31
+ if (endDate === '') {
32
+ return startDate;
33
+ }
34
+ return "".concat(startDate, " - ").concat(endDate);
35
+ };
36
+ exports.getDateString = getDateString;
37
+ const getCurrentShipmentLabel = number => {
38
+ const ordinalNumber = numberToOrdinal(number);
39
+ return "".concat(ordinalNumber, " Shipment");
40
+ };
41
+ exports.getCurrentShipmentLabel = getCurrentShipmentLabel;
42
+ const isActive = time => time === null;
43
+ exports.isActive = isActive;
44
+ const headerText = (index, reassignmentTime, modifiedTime, status) => "".concat(getCurrentShipmentLabel(index + 1), " | ").concat(getDateString(reassignmentTime, modifiedTime)).concat(isActive(modifiedTime) ? ' - Present' : '');
45
+ exports.headerText = headerText;
46
+ const getSingleShipmentHistory = item => {
47
+ var _item$history;
48
+ return {
49
+ partnerName: item === null || item === void 0 ? void 0 : item.logisticPartnerName,
50
+ errorReason: item === null || item === void 0 ? void 0 : item.failureReason,
51
+ awbNumber: item === null || item === void 0 ? void 0 : item.logisticPartnerRefNum,
52
+ fromAddress: {
53
+ heading: 'From Address:',
54
+ addressLine1: item === null || item === void 0 ? void 0 : item.origAddressFullName,
55
+ addressLine2: item === null || item === void 0 ? void 0 : item.originAddressLine1,
56
+ pincode: item === null || item === void 0 ? void 0 : item.originPincode,
57
+ city: item === null || item === void 0 ? void 0 : item.originDistrict
58
+ },
59
+ toAddress: {
60
+ heading: 'To Address:',
61
+ addressLine1: item === null || item === void 0 ? void 0 : item.destAddressFullName,
62
+ addressLine2: item === null || item === void 0 ? void 0 : item.destAddressLine1,
63
+ pincode: item === null || item === void 0 ? void 0 : item.destPincode,
64
+ city: item === null || item === void 0 ? void 0 : item.destDistrict
65
+ },
66
+ tableData: (_item$history = item === null || item === void 0 ? void 0 : item.history) !== null && _item$history !== void 0 ? _item$history : []
67
+ };
68
+ };
69
+ exports.getSingleShipmentHistory = getSingleShipmentHistory;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "oa-componentbook",
3
- "version": "1.0.1-stage.45",
3
+ "version": "1.0.1-stage.47",
4
4
  "private": false,
5
5
  "description": "Reusable components",
6
6
  "main": "build/index.js",
@@ -27,7 +27,7 @@
27
27
  "react-markdown": "^8.0.7",
28
28
  "react-pattern-lock": "^12.0.12",
29
29
  "react-pdf": "^5.3.0",
30
- "react-zoom-pan-pinch": "^3.7.0"
30
+ "react-zoom-pan-pinch": "^3.4.4"
31
31
  },
32
32
  "devDependencies": {
33
33
  "@babel/cli": "^7.22.9",
@@ -1,195 +0,0 @@
1
- "use strict";
2
-
3
- require("core-js/modules/es.weak-map.js");
4
- require("core-js/modules/web.dom-collections.iterator.js");
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.default = void 0;
9
- var _react = _interopRequireWildcard(require("react"));
10
- var _propTypes = _interopRequireDefault(require("prop-types"));
11
- var _FileCopyOutlined = _interopRequireDefault(require("@material-ui/icons/FileCopyOutlined"));
12
- var _AddressWidget = _interopRequireDefault(require("../../widgets/oa-widget-address/AddressWidget"));
13
- var _CustomTable = _interopRequireDefault(require("../../components/oa-component-table/CustomTable"));
14
- var _CustomTimeline = _interopRequireDefault(require("../oa-component-timeline/CustomTimeline"));
15
- var _MaterialIcon = _interopRequireDefault(require("../../components/oa-component-icons/MaterialIcon"));
16
- var _styles = require("./styles");
17
- var _CustomNotification = _interopRequireDefault(require("../../components/oa-component-notification/CustomNotification"));
18
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
19
- function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
20
- function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
21
- function TrackShipmentWidget(_ref) {
22
- var _tableData, _tableData2;
23
- let {
24
- awbNumber,
25
- fromAddress,
26
- tableData,
27
- title,
28
- toAddress,
29
- heading
30
- } = _ref;
31
- // local variables
32
- const deilveryStageText = 'SHIPMENT DELIVERED to Customer';
33
-
34
- // show notification when user click on clipboard
35
- const notificationRef = (0, _react.useRef)(null);
36
- const openNotification = parameters => {
37
- var _notificationRef$curr;
38
- return notificationRef === null || notificationRef === void 0 || (_notificationRef$curr = notificationRef.current) === null || _notificationRef$curr === void 0 ? void 0 : _notificationRef$curr.openNotification(parameters);
39
- };
40
- const handleCopyToClipboard = () => {
41
- navigator.clipboard.writeText(awbNumber).then(() => {
42
- openNotification({
43
- description: 'Copy to clipboard',
44
- type: 'success'
45
- });
46
- }).catch(err => {
47
- openNotification({
48
- description: 'Failed to copy text',
49
- type: 'failure'
50
- });
51
- });
52
- };
53
-
54
- // return circle color depands on stageConsistent key coming from backend
55
- const getCircleClass = (row, isTimeLineStep) => {
56
- if (row.stageConsistent) {
57
- return isTimeLineStep ? 'finish' : 'greenBg';
58
- }
59
- if (row.toDate === null && row.oneassistDisplayStatus === deilveryStageText) {
60
- return isTimeLineStep ? 'process' : 'greenBr';
61
- }
62
- return isTimeLineStep ? 'error' : 'redBg';
63
- };
64
-
65
- // check if current stage is delivery stage or not
66
- const isOnDeliveryStage = Array.isArray(tableData) && tableData.length > 0 && ((_tableData = tableData[tableData.length - 1]) === null || _tableData === void 0 ? void 0 : _tableData.oneassistDisplayStatus) === deilveryStageText && ((_tableData2 = tableData[tableData.length - 1]) === null || _tableData2 === void 0 ? void 0 : _tableData2.toDate) === null;
67
-
68
- // remove duplicate consicutive objects only show single unique objects
69
- const stepsData = tableData.map(item => ({
70
- title: item.oneassistDisplayStatus,
71
- status: getCircleClass(item, true)
72
- })).filter((item, index) => {
73
- var _tableData3;
74
- return item.title !== ((_tableData3 = tableData[index - 1]) === null || _tableData3 === void 0 ? void 0 : _tableData3.oneassistDisplayStatus);
75
- });
76
- return /*#__PURE__*/_react.default.createElement(_styles.StyleTrackShipment, {
77
- className: "trackingDetails"
78
- }, /*#__PURE__*/_react.default.createElement(_CustomNotification.default, {
79
- ref: notificationRef
80
- }), title ? /*#__PURE__*/_react.default.createElement("h1", {
81
- className: "type-t1-500"
82
- }, title) : null, /*#__PURE__*/_react.default.createElement("h3", {
83
- className: "type-t1-500"
84
- }, heading), /*#__PURE__*/_react.default.createElement("p", {
85
- className: "type-b2-400 disFlex"
86
- }, "AWB Number:", awbNumber, awbNumber && /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
87
- icon: _FileCopyOutlined.default,
88
- size: 20,
89
- onClick: handleCopyToClipboard,
90
- style: {
91
- cursor: 'pointer',
92
- color: '014FC5'
93
- }
94
- })), /*#__PURE__*/_react.default.createElement(_styles.AddressesContainer, null, /*#__PURE__*/_react.default.createElement(_AddressWidget.default, {
95
- address: fromAddress
96
- }), /*#__PURE__*/_react.default.createElement(_AddressWidget.default, {
97
- address: toAddress
98
- })), /*#__PURE__*/_react.default.createElement("div", {
99
- className: "cstScroll"
100
- }, /*#__PURE__*/_react.default.createElement(_CustomTimeline.default, {
101
- currentStep: isOnDeliveryStage ? stepsData.length : stepsData.length - 1,
102
- stepsData: stepsData
103
- })), /*#__PURE__*/_react.default.createElement(_CustomTable.default, {
104
- bordered: true,
105
- rowKey: "key",
106
- columns: [{
107
- title: 'Stage',
108
- dataIndex: 'oneassistDisplayStatus',
109
- key: 'oneassistDisplayStatus',
110
- render: (text, row, index) => {
111
- const obj = {
112
- children: /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("em", {
113
- className: "comIcon ".concat(getCircleClass(row))
114
- }), text),
115
- props: {}
116
- };
117
- if (index === 0 || tableData[index - 1].oneassistDisplayStatus !== text) {
118
- let rowSpanCount = 1;
119
- for (let i = index + 1; i < tableData.length; i += 1) {
120
- if (tableData[i].oneassistDisplayStatus === text) {
121
- rowSpanCount += 1;
122
- } else {
123
- break;
124
- }
125
- }
126
- obj.props.rowSpan = rowSpanCount;
127
- } else {
128
- obj.props.rowSpan = 0;
129
- }
130
- return obj;
131
- }
132
- }, {
133
- title: 'description from partner',
134
- dataIndex: 'partnerStatus',
135
- key: 'partnerStatus'
136
- }, {
137
- title: 'Time',
138
- dataIndex: 'toDate',
139
- key: 'toDate'
140
- }],
141
- dataSource: tableData
142
- }));
143
- }
144
- TrackShipmentWidget.propTypes = {
145
- awbNumber: _propTypes.default.string.isRequired,
146
- fromAddress: _propTypes.default.shape({
147
- heading: _propTypes.default.string,
148
- addressLine1: _propTypes.default.string,
149
- addressLine2: _propTypes.default.string,
150
- addressLine3: _propTypes.default.string,
151
- landmark: _propTypes.default.string,
152
- pincode: _propTypes.default.string || _propTypes.default.number,
153
- city: _propTypes.default.string,
154
- state: _propTypes.default.string,
155
- type: _propTypes.default.oneOf(['permanent', 'temporary']),
156
- additional_info: _propTypes.default.shape({
157
- lat: _propTypes.default.string,
158
- long: _propTypes.default.string
159
- })
160
- }),
161
- tableData: _propTypes.default.arrayOf(_propTypes.default.shape({
162
- key: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
163
- oneassistDisplayStatus: _propTypes.default.string,
164
- partnerStatus: _propTypes.default.string,
165
- toDate: _propTypes.default.string
166
- })).isRequired,
167
- title: _propTypes.default.string,
168
- heading: _propTypes.default.string,
169
- toAddress: _propTypes.default.shape({
170
- heading: _propTypes.default.string,
171
- addressLine1: _propTypes.default.string,
172
- addressLine2: _propTypes.default.string,
173
- addressLine3: _propTypes.default.string,
174
- landmark: _propTypes.default.string,
175
- pincode: _propTypes.default.string || _propTypes.default.number,
176
- city: _propTypes.default.string,
177
- state: _propTypes.default.string,
178
- type: _propTypes.default.oneOf(['permanent', 'temporary']),
179
- additional_info: _propTypes.default.shape({
180
- lat: _propTypes.default.string,
181
- long: _propTypes.default.string
182
- })
183
- })
184
- };
185
- TrackShipmentWidget.defaultProps = {
186
- fromAddress: {
187
- heading: ''
188
- },
189
- title: '',
190
- heading: 'Shipment tracking details',
191
- toAddress: {
192
- heading: ''
193
- }
194
- };
195
- var _default = exports.default = TrackShipmentWidget;
@@ -1,230 +0,0 @@
1
- "use strict";
2
-
3
- require("core-js/modules/es.symbol.description.js");
4
- require("core-js/modules/es.weak-map.js");
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.default = void 0;
9
- require("core-js/modules/web.dom-collections.iterator.js");
10
- require("core-js/modules/es.promise.js");
11
- var _react = _interopRequireWildcard(require("react"));
12
- var _propTypes = _interopRequireDefault(require("prop-types"));
13
- var _antd = require("antd");
14
- var _icons = require("@ant-design/icons");
15
- var _reactZoomPanPinch = require("react-zoom-pan-pinch");
16
- var _Fullscreen = _interopRequireDefault(require("@material-ui/icons/Fullscreen"));
17
- var _CustomButton = _interopRequireDefault(require("../../components/oa-component-button/CustomButton"));
18
- var _CustomModal = _interopRequireDefault(require("../../components/oa-component-modal/CustomModal"));
19
- var _styles = require("./styles");
20
- var _MaterialIcon = _interopRequireDefault(require("../../components/oa-component-icons/MaterialIcon"));
21
- var _CustomLoader = _interopRequireDefault(require("../../components/oa-component-loader/CustomLoader"));
22
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
23
- function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
24
- function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
25
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
26
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
27
- function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
28
- function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
29
- function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
30
- /**
31
- * ImageCarouselWidget is a component that displays images in a carousel and allows zooming and switching between original and heatmap images.
32
- * @param {object} props The props passed to the component
33
- * @param {array} [props.images={}] An object with keys representing image types and values as arrays of images
34
- * @param {boolean} [props.visible=false] Whether the modal is visible
35
- * @param {function} [props.onClose] A function that is called when the modal is closed
36
- * @returns {object} A React component
37
- */
38
- function ImageCarouselWidget(_ref) {
39
- let {
40
- images = [],
41
- visible,
42
- onClose,
43
- headingSuffixText,
44
- typeToNamemapping,
45
- s3DownloadApiUrl
46
- } = _ref;
47
- const [currentIndex, setCurrentIndex] = (0, _react.useState)(0);
48
- const [showHeatmap, setShowHeatmap] = (0, _react.useState)(false);
49
- const [fullscreen, setFullscreen] = (0, _react.useState)(false);
50
- const [imageUrls, setImageUrls] = (0, _react.useState)([]);
51
- const [loading, setLoading] = (0, _react.useState)(false);
52
-
53
- // Fetch image URL by UUID
54
- const fetchImageUrl = uuid => fetch("".concat(s3DownloadApiUrl).concat(uuid)).then(response => response.json()).then(data => {
55
- var _data$data;
56
- return data === null || data === void 0 || (_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data.downloadUrl;
57
- }) // Assuming the API response has `src` key for the image URL
58
- .catch(error => {
59
- console.error('Error fetching image URL:', error);
60
- return ''; // Return an empty string if there's an error
61
- });
62
-
63
- // Fetch image URLs for all grouped images
64
- (0, _react.useEffect)(() => {
65
- const fetchImages = async () => {
66
- setLoading(true);
67
- const urls = await Promise.all(images.map(async img => {
68
- const originalUrl = await fetchImageUrl(img.originalDocId); // Fetch URL for the original image
69
- return _objectSpread(_objectSpread({}, img), {}, {
70
- originalImageUrl: originalUrl,
71
- // Add the original image URL to the object
72
- heatmapImageUrl: '' // Set heatmap image URL as empty initially
73
- });
74
- }));
75
- console.log(urls);
76
- setImageUrls(urls);
77
- setLoading(false);
78
- };
79
- fetchImages();
80
- }, [images === null || images === void 0 ? void 0 : images.length]);
81
-
82
- // Enter fullscreen for the whole document
83
- const enterFullscreen = () => {
84
- if (document.documentElement.requestFullscreen) {
85
- document.documentElement.requestFullscreen();
86
- } else if (document.documentElement.mozRequestFullScreen) {
87
- // Firefox
88
- document.documentElement.mozRequestFullScreen();
89
- } else if (document.documentElement.webkitRequestFullscreen) {
90
- // Chrome, Safari, Opera
91
- document.documentElement.webkitRequestFullscreen();
92
- } else if (document.documentElement.msRequestFullscreen) {
93
- // IE/Edge
94
- document.documentElement.msRequestFullscreen();
95
- }
96
- setFullscreen(true);
97
- };
98
-
99
- // Exit fullscreen
100
- const exitFullscreen = () => {
101
- if (document.exitFullscreen) {
102
- document.exitFullscreen();
103
- } else if (document.mozCancelFullScreen) {
104
- // Firefox
105
- document.mozCancelFullScreen();
106
- } else if (document.webkitExitFullscreen) {
107
- // Chrome, Safari and Opera
108
- document.webkitExitFullscreen();
109
- } else if (document.msExitFullscreen) {
110
- // IE/Edge
111
- document.msExitFullscreen();
112
- }
113
- setFullscreen(false);
114
- };
115
- const handleFullscreenToggle = () => {
116
- if (fullscreen) {
117
- exitFullscreen();
118
- } else {
119
- enterFullscreen();
120
- }
121
- };
122
- const handleImageChange = newIndex => {
123
- setCurrentIndex(newIndex);
124
- };
125
- const handleShowHeatmap = async () => {
126
- const currentViewType = !showHeatmap; // Toggle the current view mode (show heatmap or not)
127
- setLoading(true);
128
-
129
- // Fetching URLs for all images based on the new view mode
130
- const updatedImages = await Promise.all(imageUrls.map(async img => {
131
- var _img$heatmapImageUrl, _img$originalImageUrl;
132
- // Check if the image is already fetched
133
- const isImageAlreadyFetched = currentViewType && ((_img$heatmapImageUrl = img.heatmapImageUrl) === null || _img$heatmapImageUrl === void 0 ? void 0 : _img$heatmapImageUrl.length) > 0 || !currentViewType && ((_img$originalImageUrl = img.originalImageUrl) === null || _img$originalImageUrl === void 0 ? void 0 : _img$originalImageUrl.length) > 0;
134
- // Fetch the image URL only if it's not already fetched
135
- if (!isImageAlreadyFetched) {
136
- const imageSrcUrl = await fetchImageUrl(currentViewType ? img.heatmapDocId : img.originalDocId);
137
- // Return the updated image object with the appropriate URL
138
- return _objectSpread(_objectSpread({}, img), currentViewType ? {
139
- heatmapImageUrl: imageSrcUrl
140
- } : {
141
- originalImageUrl: imageSrcUrl
142
- });
143
- }
144
- // If image is already fetched, return it as is
145
- return img;
146
- }));
147
-
148
- // Update state with the new image URLs
149
- setImageUrls(updatedImages);
150
- setLoading(false);
151
- setShowHeatmap(currentViewType); // Toggle the view mode
152
- };
153
- const currentImage = imageUrls[currentIndex];
154
- return /*#__PURE__*/_react.default.createElement(_styles.ImageCarouselWidgetStyle, null, /*#__PURE__*/_react.default.createElement(_CustomModal.default, {
155
- open: visible,
156
- onCancel: onClose,
157
- footer: null,
158
- className: fullscreen ? 'fullscreen-modal' : ''
159
- }, /*#__PURE__*/_react.default.createElement(_CustomLoader.default, {
160
- spinning: loading
161
- }, !fullscreen && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
162
- style: {
163
- textAlign: 'center',
164
- fontSize: 18,
165
- fontWeight: 'bold'
166
- }
167
- }, typeToNamemapping && typeToNamemapping[currentImage === null || currentImage === void 0 ? void 0 : currentImage.imageType] ? typeToNamemapping[currentImage === null || currentImage === void 0 ? void 0 : currentImage.imageType] : currentImage === null || currentImage === void 0 ? void 0 : currentImage.imageType, ' ', headingSuffixText), /*#__PURE__*/_react.default.createElement("p", {
168
- style: {
169
- color: 'red',
170
- textAlign: 'center'
171
- }
172
- }, currentImage === null || currentImage === void 0 ? void 0 : currentImage.rejectReason), /*#__PURE__*/_react.default.createElement(_CustomButton.default, {
173
- onClick: handleShowHeatmap,
174
- type: "text-only",
175
- label: showHeatmap ? 'View Original Image' : 'View Heatmap Image'
176
- }), /*#__PURE__*/_react.default.createElement(_antd.Carousel, {
177
- afterChange: handleImageChange,
178
- dots: true,
179
- infinite: true
180
- }, imageUrls.map(img => /*#__PURE__*/_react.default.createElement("div", {
181
- key: img.imageType
182
- }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
183
- icon: _Fullscreen.default,
184
- onClick: handleFullscreenToggle
185
- }), /*#__PURE__*/_react.default.createElement("img", {
186
- src: showHeatmap ? img.heatmapImageUrl : img.originalImageUrl,
187
- alt: img.imageType,
188
- style: {
189
- width: '100%',
190
- maxHeight: '400px',
191
- objectFit: 'contain'
192
- }
193
- })))))), fullscreen && /*#__PURE__*/_react.default.createElement("div", {
194
- style: {
195
- textAlign: 'center',
196
- marginTop: 20
197
- }
198
- }, /*#__PURE__*/_react.default.createElement("div", {
199
- style: {
200
- fontSize: 18,
201
- fontWeight: 'bold'
202
- }
203
- }, typeToNamemapping && typeToNamemapping[currentImage === null || currentImage === void 0 ? void 0 : currentImage.imageType] ? typeToNamemapping[currentImage === null || currentImage === void 0 ? void 0 : currentImage.imageType] : currentImage === null || currentImage === void 0 ? void 0 : currentImage.imageType, ' ', headingSuffixText), /*#__PURE__*/_react.default.createElement("p", {
204
- style: {
205
- color: 'red'
206
- }
207
- }, currentImage === null || currentImage === void 0 ? void 0 : currentImage.rejectReason), /*#__PURE__*/_react.default.createElement(_icons.CloseOutlined, {
208
- style: {
209
- fontSize: '26px'
210
- },
211
- onClick: handleFullscreenToggle
212
- }), /*#__PURE__*/_react.default.createElement(_reactZoomPanPinch.TransformWrapper, null, /*#__PURE__*/_react.default.createElement(_reactZoomPanPinch.TransformComponent, null, /*#__PURE__*/_react.default.createElement("img", {
213
- src: showHeatmap ? currentImage === null || currentImage === void 0 ? void 0 : currentImage.heatmapImageUrl : currentImage === null || currentImage === void 0 ? void 0 : currentImage.originalImageUrl,
214
- alt: currentImage === null || currentImage === void 0 ? void 0 : currentImage.imageType
215
- }))), /*#__PURE__*/_react.default.createElement("div", null, "Pinch in/out to zoom")))));
216
- }
217
- ImageCarouselWidget.propTypes = {
218
- images: _propTypes.default.array.isRequired,
219
- visible: _propTypes.default.bool.isRequired,
220
- onClose: _propTypes.default.func.isRequired,
221
- headingSuffixText: _propTypes.default.string,
222
- typeToNamemapping: _propTypes.default.object,
223
- s3DownloadApiUrl: _propTypes.default.string
224
- };
225
- ImageCarouselWidget.defaultProps = {
226
- headingSuffixText: 'Damage',
227
- typeToNamemapping: {},
228
- s3DownloadApiUrl: ''
229
- };
230
- var _default = exports.default = ImageCarouselWidget;
@@ -1,12 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = exports.ImageCarouselWidgetStyle = void 0;
7
- var _styledComponents = _interopRequireDefault(require("styled-components"));
8
- var _templateObject;
9
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
10
- function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
11
- var _default = exports.default = {};
12
- const ImageCarouselWidgetStyle = exports.ImageCarouselWidgetStyle = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\n"])));