amp-workflow-ui 0.1.2 → 0.1.4

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.
Files changed (7) hide show
  1. package/dist/index.d.mts +2 -0
  2. package/dist/index.d.ts +2 -0
  3. package/dist/index.js +639 -471
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.mjs +640 -472
  6. package/dist/index.mjs.map +1 -1
  7. package/package.json +1 -1
package/dist/index.mjs CHANGED
@@ -6,7 +6,7 @@ import { useTheme } from '@mui/material/styles';
6
6
  import useMediaQuery from '@mui/material/useMediaQuery';
7
7
  import DialogActions5 from '@mui/material/DialogActions';
8
8
  import DialogContent from '@mui/material/DialogContent';
9
- import { styled, Chip, Typography, IconButton, useTheme as useTheme$1, Tooltip, Card, CardContent, Divider, CircularProgress, Box as Box$1, TextField, InputAdornment, Button, Menu, MenuItem, Grid, DialogTitle, DialogActions, FormControl, InputLabel, Select } from '@mui/material';
9
+ import { styled, Chip, IconButton, useTheme as useTheme$1, Tooltip, Card, CardContent, Typography, Divider, CircularProgress, Box as Box$1, TextField, InputAdornment, Button, Menu, MenuItem, DialogTitle, Grid, DialogActions, FormControl, InputLabel, Select } from '@mui/material';
10
10
  import HighlightOffIcon from '@mui/icons-material/HighlightOff';
11
11
  import { Box } from '@mui/system';
12
12
  import moment from 'moment';
@@ -70,7 +70,12 @@ var ActionMenu = ({
70
70
  ] });
71
71
  };
72
72
  var Statusselector_default = ActionMenu;
73
- function SendBackDialog({ openModal, closeModal, header, workflowLogId }) {
73
+ function SendBackDialog({
74
+ openModal,
75
+ closeModal,
76
+ header,
77
+ workflowLogId
78
+ }) {
74
79
  const { userInfo, api } = useWorkflowContext();
75
80
  const [comment, setComment] = useState("");
76
81
  const [selectedFile, setSelectedFile] = useState(null);
@@ -88,7 +93,9 @@ function SendBackDialog({ openModal, closeModal, header, workflowLogId }) {
88
93
  const formData = new FormData();
89
94
  formData.append("file", file);
90
95
  try {
91
- const response = await api.post("/workflow/upload-document", formData, {
96
+ const response = await api.post({
97
+ url: "/workflow/upload-document",
98
+ data: formData,
92
99
  headers: { "Content-Type": "multipart/form-data" }
93
100
  });
94
101
  setFileName(response.data.file);
@@ -124,10 +131,14 @@ function SendBackDialog({ openModal, closeModal, header, workflowLogId }) {
124
131
  if (!validateFields()) return;
125
132
  setLoading(true);
126
133
  try {
127
- const res = await api.post(`/workflow/send-back/${workflowLogId}`, {
128
- comment,
129
- file: selectedFile,
130
- created_by: (_a = userInfo == null ? void 0 : userInfo.userInfo) == null ? void 0 : _a.id
134
+ const res = await api.post({
135
+ url: `/workflow/send-back/${workflowLogId}`,
136
+ data: {
137
+ comment,
138
+ file: selectedFile,
139
+ created_by: (_a = userInfo == null ? void 0 : userInfo.userInfo) == null ? void 0 : _a.id
140
+ },
141
+ serviceURL: "api"
131
142
  });
132
143
  if ((res == null ? void 0 : res.status) === 200) toast.success("Successfully sent back!");
133
144
  if ((_b = res == null ? void 0 : res.error) == null ? void 0 : _b.message) {
@@ -140,50 +151,107 @@ function SendBackDialog({ openModal, closeModal, header, workflowLogId }) {
140
151
  setLoading(false);
141
152
  }
142
153
  };
143
- return /* @__PURE__ */ jsxs(Dialog, { open: openModal, onClose: closeModal, "aria-labelledby": "responsive-dialog-title", sx: { "& .MuiPaper-root.MuiDialog-paper": { width: "550px" } }, children: [
144
- /* @__PURE__ */ jsxs(Box$1, { sx: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
145
- /* @__PURE__ */ jsx(DialogTitle, { id: "responsive-dialog-title", children: header }),
146
- /* @__PURE__ */ jsx(IconButton, { disableFocusRipple: true, disableRipple: true, onClick: closeModal, children: /* @__PURE__ */ jsx(HighlightOffIcon, { style: { color: "#666666" } }) })
147
- ] }),
148
- /* @__PURE__ */ jsx(DialogContent, { children: /* @__PURE__ */ jsx(Box$1, { sx: { mb: 5 }, children: /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 5, children: [
149
- /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(
150
- TextField,
151
- {
152
- fullWidth: true,
153
- label: "Comment",
154
- value: comment,
155
- placeholder: "Comment Here",
156
- onChange: (e) => setComment(e.target.value),
157
- required: true,
158
- error: !!error.comment,
159
- helperText: error.comment
160
- }
161
- ) }),
162
- /* @__PURE__ */ jsxs(Grid, { item: true, xs: 12, children: [
163
- /* @__PURE__ */ jsx(
164
- TextField,
154
+ return /* @__PURE__ */ jsxs(
155
+ Dialog,
156
+ {
157
+ open: openModal,
158
+ onClose: closeModal,
159
+ "aria-labelledby": "responsive-dialog-title",
160
+ sx: { "& .MuiPaper-root.MuiDialog-paper": { width: "550px" } },
161
+ children: [
162
+ /* @__PURE__ */ jsxs(
163
+ Box$1,
165
164
  {
166
- type: "text",
167
- fullWidth: true,
168
- label: "Attachment",
169
- placeholder: "Attachment",
170
- InputProps: {
171
- endAdornment: /* @__PURE__ */ jsx(InputAdornment, { position: "end", children: /* @__PURE__ */ jsx("span", { className: "icon-export-1" }) })
165
+ sx: {
166
+ display: "flex",
167
+ justifyContent: "space-between",
168
+ alignItems: "center"
172
169
  },
173
- onClick: handleAttachment,
174
- value: fileName,
175
- error: !!error.file,
176
- helperText: error.file
170
+ children: [
171
+ /* @__PURE__ */ jsx(DialogTitle, { id: "responsive-dialog-title", children: header }),
172
+ /* @__PURE__ */ jsx(IconButton, { disableFocusRipple: true, disableRipple: true, onClick: closeModal, children: /* @__PURE__ */ jsx(HighlightOffIcon, { style: { color: "#666666" } }) })
173
+ ]
177
174
  }
178
175
  ),
179
- /* @__PURE__ */ jsx("input", { type: "file", ref: fileInputRef, style: { display: "none" }, onChange: handleFileChange })
180
- ] })
181
- ] }) }) }),
182
- /* @__PURE__ */ jsx(DialogActions, { children: /* @__PURE__ */ jsxs(Box$1, { sx: { display: "flex", justifyContent: "flex-end", alignItems: "center" }, children: [
183
- /* @__PURE__ */ jsx(Button, { onClick: closeModal, size: "large", variant: "outlined", color: "primary", sx: { mr: 2 }, children: "Close" }),
184
- /* @__PURE__ */ jsx(Button, { onClick: onSubmit, size: "large", variant: "contained", color: "primary", disabled: loading || fileLoading, children: loading ? /* @__PURE__ */ jsx(CircularProgress, { size: 24, color: "inherit" }) : "Submit" })
185
- ] }) })
186
- ] });
176
+ /* @__PURE__ */ jsx(DialogContent, { children: /* @__PURE__ */ jsx(Box$1, { sx: { mb: 5 }, children: /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 5, children: [
177
+ /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(
178
+ TextField,
179
+ {
180
+ fullWidth: true,
181
+ label: "Comment",
182
+ value: comment,
183
+ placeholder: "Comment Here",
184
+ onChange: (e) => setComment(e.target.value),
185
+ required: true,
186
+ error: !!error.comment,
187
+ helperText: error.comment
188
+ }
189
+ ) }),
190
+ /* @__PURE__ */ jsxs(Grid, { item: true, xs: 12, children: [
191
+ /* @__PURE__ */ jsx(
192
+ TextField,
193
+ {
194
+ type: "text",
195
+ fullWidth: true,
196
+ label: "Attachment",
197
+ placeholder: "Attachment",
198
+ InputProps: {
199
+ endAdornment: /* @__PURE__ */ jsx(InputAdornment, { position: "end", children: /* @__PURE__ */ jsx("span", { className: "icon-export-1" }) })
200
+ },
201
+ onClick: handleAttachment,
202
+ value: fileName,
203
+ error: !!error.file,
204
+ helperText: error.file
205
+ }
206
+ ),
207
+ /* @__PURE__ */ jsx(
208
+ "input",
209
+ {
210
+ type: "file",
211
+ ref: fileInputRef,
212
+ style: { display: "none" },
213
+ onChange: handleFileChange
214
+ }
215
+ )
216
+ ] })
217
+ ] }) }) }),
218
+ /* @__PURE__ */ jsx(DialogActions, { children: /* @__PURE__ */ jsxs(
219
+ Box$1,
220
+ {
221
+ sx: {
222
+ display: "flex",
223
+ justifyContent: "flex-end",
224
+ alignItems: "center"
225
+ },
226
+ children: [
227
+ /* @__PURE__ */ jsx(
228
+ Button,
229
+ {
230
+ onClick: closeModal,
231
+ size: "large",
232
+ variant: "outlined",
233
+ color: "primary",
234
+ sx: { mr: 2 },
235
+ children: "Close"
236
+ }
237
+ ),
238
+ /* @__PURE__ */ jsx(
239
+ Button,
240
+ {
241
+ onClick: onSubmit,
242
+ size: "large",
243
+ variant: "contained",
244
+ color: "primary",
245
+ disabled: loading || fileLoading,
246
+ children: loading ? /* @__PURE__ */ jsx(CircularProgress, { size: 24, color: "inherit" }) : "Submit"
247
+ }
248
+ )
249
+ ]
250
+ }
251
+ ) })
252
+ ]
253
+ }
254
+ );
187
255
  }
188
256
  var SendBackDialog_default = SendBackDialog;
189
257
  function ApproveDialog({ openModal, closeModal, header, workflowLogId, statusId }) {
@@ -354,31 +422,6 @@ function OnHoldDialog({ openModal, closeModal, header, workflowLogId, statusId }
354
422
  ] });
355
423
  }
356
424
  var OnHoldDialog_default = OnHoldDialog;
357
- var Bull = ({
358
- count,
359
- isDisabled
360
- }) => {
361
- const theme = useTheme$1();
362
- const color = isDisabled ? theme.palette.success.main : theme.palette.primary.main;
363
- return /* @__PURE__ */ jsx(
364
- Box$1,
365
- {
366
- sx: {
367
- display: "flex",
368
- justifyContent: "center",
369
- alignItems: "center",
370
- width: 32,
371
- height: 32,
372
- borderRadius: "50%",
373
- border: `2px solid ${color}`,
374
- color,
375
- fontWeight: 600,
376
- fontSize: 14
377
- },
378
- children: count
379
- }
380
- );
381
- };
382
425
  var getStatus = (status, theme) => {
383
426
  const s = status == null ? void 0 : status.toLowerCase();
384
427
  const colors = {
@@ -396,7 +439,7 @@ var getStatus = (status, theme) => {
396
439
  };
397
440
  return colors[s] || colors.pending;
398
441
  };
399
- function CustomTimelineWithStatus({ events }) {
442
+ function ConnectedTimeline({ events }) {
400
443
  const { api } = useWorkflowContext();
401
444
  const theme = useTheme$1();
402
445
  const [isMobile, setIsMobile] = useState(false);
@@ -412,126 +455,210 @@ function CustomTimelineWithStatus({ events }) {
412
455
  serviceURL: "api"
413
456
  }).then((res) => window.open(res.data, "_blank"));
414
457
  };
458
+ const columns = 4;
415
459
  const rows = [];
416
- for (let i = 0; i < (events == null ? void 0 : events.length); i += 4) rows.push(events.slice(i, i + 4));
417
- return /* @__PURE__ */ jsx(Box$1, { sx: { p: 2 }, children: rows.map((row, rowIndex) => /* @__PURE__ */ jsx(
418
- Box$1,
419
- {
420
- sx: {
421
- display: "flex",
422
- flexDirection: isMobile ? "column" : rowIndex % 2 === 0 ? "row" : "row-reverse",
423
- gap: isMobile ? 3 : 6,
424
- alignItems: "center",
425
- mb: 6
426
- },
427
- children: row.map((event, index) => {
428
- var _a;
429
- const status = getStatus((_a = event.status) == null ? void 0 : _a.title, theme);
430
- const isDisabled = event.cardType === "disableCard";
431
- return /* @__PURE__ */ jsx(Grid, { item: true, xs: isMobile ? 12 : 3, children: /* @__PURE__ */ jsx(
432
- Card,
433
- {
434
- variant: "outlined",
435
- sx: {
436
- width: "100%",
437
- borderRadius: 3,
438
- p: 2,
439
- borderColor: isDisabled ? theme.palette.success.main : theme.palette.divider,
440
- backgroundColor: isDisabled ? theme.palette.action.hover : theme.palette.background.paper,
441
- textAlign: "center",
442
- boxShadow: 2,
443
- "&:hover": { boxShadow: 5 }
444
- },
445
- children: /* @__PURE__ */ jsxs(CardContent, { children: [
446
- /* @__PURE__ */ jsxs(
447
- Box$1,
448
- {
449
- sx: {
450
- display: "flex",
451
- justifyContent: "space-between",
452
- alignItems: "center",
453
- mb: 1
454
- },
455
- children: [
456
- /* @__PURE__ */ jsx(
457
- Typography,
458
- {
459
- variant: "body2",
460
- color: theme.palette.text.secondary,
461
- children: event.date
460
+ for (let i = 0; i < (events == null ? void 0 : events.length); i += columns)
461
+ rows.push(events.slice(i, i + columns));
462
+ return /* @__PURE__ */ jsx(Box$1, { sx: { py: 4, position: "relative" }, children: rows.map((row, rowIndex) => {
463
+ const reversed = rowIndex % 2 === 1;
464
+ return /* @__PURE__ */ jsx(
465
+ Box$1,
466
+ {
467
+ sx: {
468
+ display: "flex",
469
+ flexDirection: reversed ? "row-reverse" : "row",
470
+ justifyContent: "left",
471
+ alignItems: "center",
472
+ gap: 6,
473
+ position: "relative",
474
+ mb: 8,
475
+ flexWrap: isMobile ? "wrap" : "nowrap"
476
+ },
477
+ children: row.map((event, index) => {
478
+ var _a;
479
+ const globalIndex = rowIndex * columns + index;
480
+ const status = getStatus((_a = event.status) == null ? void 0 : _a.title, theme);
481
+ const isDisabled = event.cardType === "disableCard";
482
+ return /* @__PURE__ */ jsxs(
483
+ Box$1,
484
+ {
485
+ sx: {
486
+ position: "relative",
487
+ display: "flex",
488
+ justifyContent: "center",
489
+ alignItems: "center"
490
+ },
491
+ children: [
492
+ !isMobile && index < row.length - 1 && /* @__PURE__ */ jsx(
493
+ Box$1,
494
+ {
495
+ sx: {
496
+ position: "absolute",
497
+ top: "50%",
498
+ [reversed ? "right" : "left"]: "100%",
499
+ width: "60px",
500
+ height: "2px",
501
+ background: theme.palette.primary.main,
502
+ zIndex: 0
503
+ }
504
+ }
505
+ ),
506
+ !isMobile && globalIndex === (rowIndex + 1) * columns - 1 && globalIndex < events.length - 1 && /* @__PURE__ */ jsx(
507
+ Box$1,
508
+ {
509
+ sx: {
510
+ position: "absolute",
511
+ bottom: "-48px",
512
+ left: reversed ? "0%" : "100%",
513
+ width: "2px",
514
+ height: "48px",
515
+ background: theme.palette.primary.main,
516
+ zIndex: 0
517
+ }
518
+ }
519
+ ),
520
+ /* @__PURE__ */ jsx(
521
+ Card,
522
+ {
523
+ sx: {
524
+ width: "230px",
525
+ minHeight: "180px",
526
+ borderRadius: "16px",
527
+ border: `1px solid ${isDisabled ? theme.palette.success.light : theme.palette.divider}`,
528
+ backgroundColor: isDisabled ? theme.palette.action.hover : theme.palette.background.paper,
529
+ textAlign: "center",
530
+ boxShadow: "0px 4px 10px rgba(0,0,0,0.05)",
531
+ transition: "all 0.25s ease-in-out",
532
+ "&:hover": {
533
+ boxShadow: "0px 6px 14px rgba(0,0,0,0.1)",
534
+ transform: "translateY(-2px)"
462
535
  }
463
- ),
464
- event.status && /* @__PURE__ */ jsx(
465
- Chip,
466
- {
467
- label: event.status.title,
468
- sx: {
469
- backgroundColor: status.bg,
470
- color: status.text,
471
- fontSize: 12,
472
- height: 26,
536
+ },
537
+ children: /* @__PURE__ */ jsxs(CardContent, { children: [
538
+ /* @__PURE__ */ jsxs(
539
+ Box$1,
540
+ {
541
+ sx: {
542
+ display: "flex",
543
+ justifyContent: "space-between",
544
+ alignItems: "center",
545
+ mb: 1
546
+ },
547
+ children: [
548
+ /* @__PURE__ */ jsx(
549
+ Typography,
550
+ {
551
+ variant: "body2",
552
+ color: theme.palette.text.secondary,
553
+ children: event.date
554
+ }
555
+ ),
556
+ event.status && /* @__PURE__ */ jsx(
557
+ Chip,
558
+ {
559
+ label: event.status.title,
560
+ sx: {
561
+ backgroundColor: status.bg,
562
+ color: status.text,
563
+ fontSize: 12,
564
+ height: 24,
565
+ fontWeight: 600,
566
+ borderRadius: "16px"
567
+ }
568
+ }
569
+ )
570
+ ]
571
+ }
572
+ ),
573
+ /* @__PURE__ */ jsx(
574
+ Box$1,
575
+ {
576
+ sx: {
577
+ width: 36,
578
+ height: 36,
579
+ borderRadius: "50%",
580
+ border: `2px solid ${theme.palette.primary.main}`,
581
+ display: "flex",
582
+ justifyContent: "center",
583
+ alignItems: "center",
584
+ color: theme.palette.primary.main,
585
+ fontWeight: 600,
586
+ fontSize: 14,
587
+ mx: "auto",
588
+ mb: 1.5
589
+ },
590
+ children: event.count
591
+ }
592
+ ),
593
+ /* @__PURE__ */ jsx(Tooltip, { title: event.title, children: /* @__PURE__ */ jsx(
594
+ Typography,
595
+ {
596
+ variant: "subtitle1",
473
597
  fontWeight: 600,
474
- borderRadius: "16px"
598
+ color: isDisabled ? theme.palette.text.secondary : theme.palette.text.primary,
599
+ sx: {
600
+ overflow: "hidden",
601
+ textOverflow: "ellipsis",
602
+ whiteSpace: "nowrap",
603
+ mb: 0.5
604
+ },
605
+ children: event.title
475
606
  }
476
- }
477
- )
478
- ]
479
- }
480
- ),
481
- /* @__PURE__ */ jsx(Bull, { count: event.count, isDisabled }),
482
- /* @__PURE__ */ jsx(
483
- Typography,
484
- {
485
- variant: "subtitle1",
486
- fontWeight: 600,
487
- color: isDisabled ? theme.palette.text.secondary : theme.palette.text.primary,
488
- sx: { mt: 2, mb: 0.5 },
489
- children: event.title
490
- }
491
- ),
492
- /* @__PURE__ */ jsx(
493
- Typography,
494
- {
495
- variant: "body2",
496
- color: theme.palette.text.secondary,
497
- sx: { mb: 1 },
498
- children: event.subTitle
499
- }
500
- ),
501
- event.attachment && /* @__PURE__ */ jsx(Tooltip, { title: "View attachment", children: /* @__PURE__ */ jsx(
502
- Typography,
503
- {
504
- variant: "body2",
505
- sx: {
506
- color: theme.palette.primary.main,
507
- cursor: "pointer",
508
- fontWeight: 500,
509
- textDecoration: "underline",
510
- "&:hover": {
511
- color: theme.palette.primary.dark
512
- }
513
- },
514
- onClick: () => handleAttachmentClick(event.attachment),
515
- children: "Attachment"
516
- }
517
- ) }),
518
- /* @__PURE__ */ jsx(
519
- Typography,
520
- {
521
- variant: "caption",
522
- display: "block",
523
- color: theme.palette.text.disabled,
524
- sx: { mt: 2 },
525
- children: event.time
526
- }
527
- )
528
- ] })
529
- }
530
- ) }, index);
531
- })
532
- },
533
- rowIndex
534
- )) });
607
+ ) }),
608
+ /* @__PURE__ */ jsx(
609
+ Typography,
610
+ {
611
+ variant: "body2",
612
+ color: theme.palette.text.secondary,
613
+ sx: {
614
+ minHeight: "20px",
615
+ mb: 0.8,
616
+ textOverflow: "ellipsis",
617
+ whiteSpace: "nowrap",
618
+ overflow: "hidden"
619
+ },
620
+ children: event.subTitle || "No Comments"
621
+ }
622
+ ),
623
+ event.attachment && /* @__PURE__ */ jsx(Tooltip, { title: "View attachment", children: /* @__PURE__ */ jsx(
624
+ Typography,
625
+ {
626
+ variant: "body2",
627
+ sx: {
628
+ color: theme.palette.primary.main,
629
+ cursor: "pointer",
630
+ textDecoration: "underline",
631
+ fontWeight: 500,
632
+ "&:hover": {
633
+ color: theme.palette.primary.dark
634
+ }
635
+ },
636
+ onClick: () => handleAttachmentClick(event.attachment),
637
+ children: "Attachment"
638
+ }
639
+ ) }),
640
+ /* @__PURE__ */ jsx(
641
+ Typography,
642
+ {
643
+ variant: "caption",
644
+ display: "block",
645
+ color: theme.palette.text.disabled,
646
+ sx: { mt: 1 },
647
+ children: event.time
648
+ }
649
+ )
650
+ ] })
651
+ }
652
+ )
653
+ ]
654
+ },
655
+ index
656
+ );
657
+ })
658
+ },
659
+ rowIndex
660
+ );
661
+ }) });
535
662
  }
536
663
  var useDebounce = (value, delay) => {
537
664
  const [debouncedValue, setDebouncedValue] = useState(value);
@@ -577,15 +704,15 @@ var SearchBox = ({
577
704
  };
578
705
  var SearchBox_default = SearchBox;
579
706
  var StyledChipProps = styled(Chip)(({ theme }) => {
580
- var _a, _b, _c, _d, _e, _f, _g;
707
+ var _a, _b, _c;
581
708
  return {
582
709
  "&.MuiChip-colorPrimary": {
583
710
  border: `1px solid ${theme.palette.primary.dark}`,
584
711
  borderRadius: "8px",
585
712
  height: "36px",
586
713
  padding: "6px 4px",
587
- background: `${(_b = (_a = theme.palette.customColors) == null ? void 0 : _a.customChipBackgroundColor) != null ? _b : "rgba(25,118,210,0.1)"}`,
588
- color: `${(_d = (_c = theme.palette.customColors) == null ? void 0 : _c.customChipColor) != null ? _d : theme.palette.primary.dark}`,
714
+ background: `${"rgba(25,118,210,0.1)"}`,
715
+ color: `${theme.palette.primary.dark}`,
589
716
  width: "170px",
590
717
  overflow: "hidden",
591
718
  whiteSpace: "nowrap",
@@ -597,7 +724,7 @@ var StyledChipProps = styled(Chip)(({ theme }) => {
597
724
  height: "36px",
598
725
  padding: "6px 4px",
599
726
  background: "none !important",
600
- color: `${(_g = (_f = (_e = theme.palette) == null ? void 0 : _e.customColors) == null ? void 0 : _f.mainText) != null ? _g : theme.palette.text.primary} `,
727
+ color: `${(_c = (_b = (_a = theme.palette) == null ? void 0 : _a.customColors) == null ? void 0 : _b.mainText) != null ? _c : theme.palette.text.primary} `,
601
728
  width: "170px",
602
729
  overflow: "hidden",
603
730
  whiteSpace: "nowrap",
@@ -605,22 +732,13 @@ var StyledChipProps = styled(Chip)(({ theme }) => {
605
732
  }
606
733
  };
607
734
  });
608
- styled(Typography)(({ theme }) => ({
609
- overflow: "hidden",
610
- textOverflow: "ellipsis",
611
- whiteSpace: "nowrap",
612
- width: "200px",
613
- [theme.breakpoints.down("sm")]: {
614
- width: "80px"
615
- }
616
- }));
617
735
  function ApprovalWorkflow({
618
736
  selectedWorkflowsList = [],
619
737
  userInfo
620
738
  }) {
621
739
  var _a, _b, _c, _d, _e, _f, _g;
622
740
  const theme = useTheme$1();
623
- const { api, urlBuilder, loadingComponent } = useWorkflowContext();
741
+ const { api, urlBuilder, loadingComponent, ENV_VARIABLES } = useWorkflowContext();
624
742
  const [selectedApprovalOtions, setSelectedApprovalOtions] = useState(
625
743
  selectedWorkflowsList.length ? "selected" : "Action Required"
626
744
  );
@@ -630,12 +748,14 @@ function ApprovalWorkflow({
630
748
  const [rejectTarget, setRejectTarget] = React7.useState(null);
631
749
  const [onHoldTarget, setOnHoldTarget] = React7.useState(null);
632
750
  const [expandedDetails, setExpandedDetails] = useState([]);
633
- const [statusCount, setStatusCount] = useState({});
634
751
  const [urlConfig, setUrlConfig] = useState({});
635
752
  const [allRequestArray, setAllRequestArray] = useState([]);
636
753
  const [pendingRequestArray, setPendingRequestArray] = useState([]);
637
754
  const [selectedRequestArray, setSelectedRequestArray] = useState([]);
638
755
  const [isLoading, setIsLoading] = useState(false);
756
+ const [visibleAll, setVisibleAll] = useState(10);
757
+ const [visiblePending, setVisiblePending] = useState(10);
758
+ const [visibleSelected, setVisibleSelected] = useState(10);
639
759
  const [searchText, setSearchText] = useState("");
640
760
  const handleClearSearch = useCallback(() => {
641
761
  setSearchText("");
@@ -671,6 +791,35 @@ function ApprovalWorkflow({
671
791
  return name.includes(q) || desc.includes(q);
672
792
  });
673
793
  }, [pendingRequestArray, debouncedSearchTerm]);
794
+ const observer = React7.useRef(null);
795
+ const lastCardRef = useCallback(
796
+ (node) => {
797
+ if (isLoading) return;
798
+ if (observer.current) observer.current.disconnect();
799
+ observer.current = new IntersectionObserver((entries) => {
800
+ if (entries[0].isIntersecting) {
801
+ if (selectedApprovalOtions === "All Requests") {
802
+ setVisibleAll((prev) => prev + 10);
803
+ } else if (selectedApprovalOtions === "Action Required") {
804
+ setVisiblePending((prev) => prev + 10);
805
+ } else if (selectedApprovalOtions === "selected") {
806
+ setVisibleSelected((prev) => prev + 10);
807
+ }
808
+ }
809
+ });
810
+ if (node) observer.current.observe(node);
811
+ },
812
+ [isLoading, selectedApprovalOtions]
813
+ );
814
+ const visibleAllRequests = filteredAllRequestArray.slice(0, visibleAll);
815
+ const visiblePendingRequests = filteredPendingRequestArray.slice(
816
+ 0,
817
+ visiblePending
818
+ );
819
+ const visibleSelectedRequests = filteredSelectedRequestArray.slice(
820
+ 0,
821
+ visibleSelected
822
+ );
674
823
  const handleSendBack = (workflowLogId) => {
675
824
  setSendDialog(workflowLogId);
676
825
  };
@@ -744,12 +893,12 @@ function ApprovalWorkflow({
744
893
  {
745
894
  label: "Action Required",
746
895
  icon: /* @__PURE__ */ jsx("span", { className: "icon-document-forward" }),
747
- count: (statusCount == null ? void 0 : statusCount.pending_activities_count) || ""
896
+ count: pendingRequestArray.length || ""
748
897
  },
749
898
  {
750
899
  label: "All Requests",
751
900
  icon: /* @__PURE__ */ jsx("span", { className: "icon-document-copy" }),
752
- count: (statusCount == null ? void 0 : statusCount.total_activities_count) || ""
901
+ count: allRequestArray.length || ""
753
902
  }
754
903
  ];
755
904
  const fetchExpandedActivityLogs = (workflowLogId) => {
@@ -789,20 +938,9 @@ function ApprovalWorkflow({
789
938
  data: { workflowIds: selectedWorkflowsList }
790
939
  }).then((res) => setSelectedRequestArray(res == null ? void 0 : res.data)).finally(() => setIsLoading(false));
791
940
  };
792
- const fetchStatusCount = () => {
793
- var _a2;
794
- api.get({
795
- url: `/workflow/status-count/${(_a2 = userInfo == null ? void 0 : userInfo.userInfo) == null ? void 0 : _a2.id}`,
796
- serviceURL: "api"
797
- }).then((res) => {
798
- var _a3;
799
- setStatusCount((_a3 = res == null ? void 0 : res.data) == null ? void 0 : _a3[0]);
800
- });
801
- };
802
941
  useEffect(() => {
803
942
  if (!sendDialog && !approveTarget && !onHoldTarget && !rejectTarget) {
804
943
  fetchAllActivites();
805
- fetchStatusCount();
806
944
  fetchPendingActivities();
807
945
  setExpandedDetails([]);
808
946
  setExpandedId(null);
@@ -823,48 +961,35 @@ function ApprovalWorkflow({
823
961
  fetchSelectedActivites();
824
962
  }
825
963
  }, [selectedWorkflowsList]);
964
+ useEffect(() => {
965
+ if (Object.keys(urlConfig).length > 0 && userInfo) {
966
+ fetchPendingActivities();
967
+ }
968
+ }, [urlConfig, userInfo]);
826
969
  const buildRedirectionUrl = (info) => {
827
- if (info == null ? void 0 : info.redirection_link) return info.redirection_link;
828
- if (urlBuilder)
829
- return urlBuilder(
830
- info == null ? void 0 : info.module_name,
831
- info == null ? void 0 : info.module_id,
832
- urlConfig,
833
- info == null ? void 0 : info.reference_id
834
- );
835
- const ref = urlConfig == null ? void 0 : urlConfig[info == null ? void 0 : info.module_name];
970
+ const { module_name, module_id, reference_id, redirection_link } = info;
971
+ if (redirection_link) return redirection_link;
972
+ if (module_name === "route_approval") {
973
+ return `${ENV_VARIABLES == null ? void 0 : ENV_VARIABLES.TRANSPORT_URL}route-listing/view/${reference_id}`;
974
+ } else if (module_name === "update_bus_details_approval") {
975
+ return `${ENV_VARIABLES == null ? void 0 : ENV_VARIABLES.TRANSPORT_URL}bus-listing/view/${reference_id}`;
976
+ } else if (module_name === "kit_handover_approve") {
977
+ return `${ENV_VARIABLES == null ? void 0 : ENV_VARIABLES.FINANCE_URL}fee-collection/?reference_id=${reference_id}&module_name=${module_name}&module_id=${module_id}`;
978
+ }
979
+ if (urlBuilder) {
980
+ return urlBuilder(module_name, module_id, urlConfig, reference_id);
981
+ }
982
+ const ref = urlConfig == null ? void 0 : urlConfig[module_name];
836
983
  if ((ref == null ? void 0 : ref.base_url) && (ref == null ? void 0 : ref.sub_url)) {
837
984
  const qs = new URLSearchParams();
838
- if (info == null ? void 0 : info.reference_id)
839
- qs.set("reference_id", String(info == null ? void 0 : info.reference_id));
840
- if (info == null ? void 0 : info.module_name) qs.set("module_name", String(info == null ? void 0 : info.module_name));
841
- return `${ref.base_url}${ref.sub_url}${qs.toString() ? `?${qs.toString()}` : ""}`;
985
+ if (reference_id) qs.set("reference_id", String(reference_id));
986
+ if (module_name) qs.set("module_name", String(module_name));
987
+ if (module_id) qs.set("module_id", String(module_id));
988
+ return `${ref.base_url}${ref.sub_url}?${qs.toString()}`;
842
989
  }
843
990
  return "#";
844
991
  };
845
992
  if (isLoading && loadingComponent) return /* @__PURE__ */ jsx(Fragment, { children: loadingComponent });
846
- ({
847
- approved: {
848
- color: theme.palette.success.light,
849
- labelColor: theme.palette.success.main
850
- },
851
- rejected: {
852
- color: theme.palette.success.light,
853
- labelColor: theme.palette.success.main
854
- },
855
- onhold: {
856
- color: theme.palette.success.light,
857
- labelColor: theme.palette.success.main
858
- },
859
- sendback: {
860
- color: theme.palette.success.light,
861
- labelColor: theme.palette.success.main
862
- },
863
- pending: {
864
- color: theme.palette.success.light,
865
- labelColor: theme.palette.success.main
866
- }
867
- });
868
993
  return /* @__PURE__ */ jsxs(Fragment, { children: [
869
994
  /* @__PURE__ */ jsx(
870
995
  Box,
@@ -934,7 +1059,7 @@ function ApprovalWorkflow({
934
1059
  px: 2,
935
1060
  pb: 3
936
1061
  },
937
- children: filteredSelectedRequestArray == null ? void 0 : filteredSelectedRequestArray.map((info, index) => {
1062
+ children: visibleSelectedRequests == null ? void 0 : visibleSelectedRequests.map((info, index) => {
938
1063
  var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h, _i, _j, _k, _l, _m, _n, _o;
939
1064
  const currentLevel = info == null ? void 0 : info.levels.find(
940
1065
  (level_) => level_.id === (info == null ? void 0 : info.current_level)
@@ -957,6 +1082,7 @@ function ApprovalWorkflow({
957
1082
  return /* @__PURE__ */ jsxs(
958
1083
  Card,
959
1084
  {
1085
+ ref: index === visibleSelectedRequests.length - 1 ? lastCardRef : null,
960
1086
  sx: {
961
1087
  mb: 3,
962
1088
  borderRadius: "14px",
@@ -1001,23 +1127,30 @@ function ApprovalWorkflow({
1001
1127
  /* @__PURE__ */ jsxs(Box, { sx: { flexBasis: "20%", minWidth: 180 }, children: [
1002
1128
  /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "text.secondary", children: "Links" }),
1003
1129
  /* @__PURE__ */ jsx(Tooltip, { title: redir, children: /* @__PURE__ */ jsx(
1004
- Typography,
1130
+ "a",
1005
1131
  {
1006
- component: "a",
1007
1132
  href: redir,
1008
1133
  target: "_blank",
1009
1134
  rel: "noreferrer",
1010
- sx: {
1011
- display: "block",
1012
- color: "primary.dark",
1013
- fontWeight: 500,
1014
- textDecoration: "none",
1015
- overflow: "hidden",
1016
- textOverflow: "ellipsis",
1017
- whiteSpace: "nowrap",
1018
- mt: 0.8
1135
+ style: {
1136
+ cursor: "pointer",
1137
+ textDecoration: "none"
1019
1138
  },
1020
- children: redir
1139
+ children: /* @__PURE__ */ jsx(
1140
+ Typography,
1141
+ {
1142
+ variant: "subtitle2",
1143
+ color: "primary.dark",
1144
+ sx: {
1145
+ mt: 0.8,
1146
+ lineHeight: "15.4px",
1147
+ overflow: "hidden",
1148
+ textOverflow: "ellipsis",
1149
+ whiteSpace: "nowrap"
1150
+ },
1151
+ children: redir
1152
+ }
1153
+ )
1021
1154
  }
1022
1155
  ) })
1023
1156
  ] }),
@@ -1176,7 +1309,7 @@ function ApprovalWorkflow({
1176
1309
  children: /* @__PURE__ */ jsx(CircularProgress, { size: 36, color: "primary" })
1177
1310
  }
1178
1311
  ) : /* @__PURE__ */ jsx(
1179
- CustomTimelineWithStatus,
1312
+ ConnectedTimeline,
1180
1313
  {
1181
1314
  events: expandedDetails == null ? void 0 : expandedDetails.map((item) => {
1182
1315
  var _a3, _b3, _c3, _d3;
@@ -1211,7 +1344,7 @@ function ApprovalWorkflow({
1211
1344
  px: 2,
1212
1345
  pb: 3
1213
1346
  },
1214
- children: filteredAllRequestArray == null ? void 0 : filteredAllRequestArray.map((info, index) => {
1347
+ children: visibleAllRequests == null ? void 0 : visibleAllRequests.map((info, index) => {
1215
1348
  var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h, _i, _j, _k, _l, _m, _n, _o;
1216
1349
  const currentLevel = info == null ? void 0 : info.levels.find(
1217
1350
  (level_) => level_.id === (info == null ? void 0 : info.current_level)
@@ -1234,6 +1367,7 @@ function ApprovalWorkflow({
1234
1367
  return /* @__PURE__ */ jsxs(
1235
1368
  Card,
1236
1369
  {
1370
+ ref: index === visibleAllRequests.length - 1 ? lastCardRef : null,
1237
1371
  sx: {
1238
1372
  mb: 3,
1239
1373
  borderRadius: "14px",
@@ -1285,23 +1419,30 @@ function ApprovalWorkflow({
1285
1419
  }
1286
1420
  ),
1287
1421
  /* @__PURE__ */ jsx(Tooltip, { title: redir, children: /* @__PURE__ */ jsx(
1288
- Typography,
1422
+ "a",
1289
1423
  {
1290
- component: "a",
1291
1424
  href: redir,
1292
1425
  target: "_blank",
1293
1426
  rel: "noreferrer",
1294
- sx: {
1295
- display: "block",
1296
- color: "primary.dark",
1297
- fontWeight: 500,
1298
- textDecoration: "none",
1299
- overflow: "hidden",
1300
- textOverflow: "ellipsis",
1301
- whiteSpace: "nowrap",
1302
- mt: 0.8
1427
+ style: {
1428
+ cursor: "pointer",
1429
+ textDecoration: "none"
1303
1430
  },
1304
- children: redir
1431
+ children: /* @__PURE__ */ jsx(
1432
+ Typography,
1433
+ {
1434
+ variant: "subtitle2",
1435
+ color: "primary.dark",
1436
+ sx: {
1437
+ mt: 0.8,
1438
+ lineHeight: "15.4px",
1439
+ overflow: "hidden",
1440
+ textOverflow: "ellipsis",
1441
+ whiteSpace: "nowrap"
1442
+ },
1443
+ children: redir
1444
+ }
1445
+ )
1305
1446
  }
1306
1447
  ) })
1307
1448
  ] }),
@@ -1460,7 +1601,7 @@ function ApprovalWorkflow({
1460
1601
  children: /* @__PURE__ */ jsx(CircularProgress, { size: 36, color: "primary" })
1461
1602
  }
1462
1603
  ) : /* @__PURE__ */ jsx(
1463
- CustomTimelineWithStatus,
1604
+ ConnectedTimeline,
1464
1605
  {
1465
1606
  events: expandedDetails == null ? void 0 : expandedDetails.map((item) => {
1466
1607
  var _a3, _b3, _c3, _d3;
@@ -1495,19 +1636,12 @@ function ApprovalWorkflow({
1495
1636
  px: 2,
1496
1637
  pb: 3
1497
1638
  },
1498
- children: filteredPendingRequestArray == null ? void 0 : filteredPendingRequestArray.map((info, index) => {
1499
- var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h, _i, _j, _k, _l;
1639
+ children: visiblePendingRequests == null ? void 0 : visiblePendingRequests.map((info, index) => {
1640
+ var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h, _i, _j, _k;
1500
1641
  const currentLevel = (_a2 = info == null ? void 0 : info.levels) == null ? void 0 : _a2.find(
1501
1642
  (level_) => level_.id === (info == null ? void 0 : info.current_level)
1502
1643
  );
1503
1644
  const statusList = currentLevel ? currentLevel.status_list : [];
1504
- (statusList || []).reduce(
1505
- (acc, s) => {
1506
- if ((s == null ? void 0 : s.status) != null) acc[s.status] = s;
1507
- return acc;
1508
- },
1509
- {}
1510
- );
1511
1645
  const redir = buildRedirectionUrl(info);
1512
1646
  const currentStatus = ((_d2 = (_c2 = (_b2 = info == null ? void 0 : info.levels) == null ? void 0 : _b2.find(
1513
1647
  (lvl) => lvl.id === (info == null ? void 0 : info.current_level)
@@ -1515,9 +1649,10 @@ function ApprovalWorkflow({
1515
1649
  (lvl) => lvl.id === (info == null ? void 0 : info.current_level)
1516
1650
  )) == null ? void 0 : _f2.selected_status) == null ? void 0 : _g2.status_id) === 3 ? "rejected" : "pending";
1517
1651
  const statusData = getStatus2(currentStatus);
1518
- return /* @__PURE__ */ jsxs(
1652
+ return /* @__PURE__ */ jsx(
1519
1653
  Card,
1520
1654
  {
1655
+ ref: index === visiblePendingRequests.length - 1 ? lastCardRef : null,
1521
1656
  sx: {
1522
1657
  mb: 3,
1523
1658
  borderRadius: "14px",
@@ -1525,191 +1660,192 @@ function ApprovalWorkflow({
1525
1660
  px: 3,
1526
1661
  py: 2
1527
1662
  },
1528
- children: [
1529
- /* @__PURE__ */ jsxs(
1530
- CardContent,
1531
- {
1532
- sx: {
1533
- display: "flex",
1534
- justifyContent: "space-between",
1535
- alignItems: "center",
1536
- flexWrap: { xs: "wrap", md: "nowrap" },
1537
- gap: 2
1538
- },
1539
- children: [
1540
- /* @__PURE__ */ jsxs(Box, { sx: { flexBasis: "22%", minWidth: 220 }, children: [
1541
- /* @__PURE__ */ jsx(Tooltip, { title: info.activityInstruction, children: /* @__PURE__ */ jsx(
1542
- Typography,
1543
- {
1544
- variant: "h6",
1545
- fontWeight: 600,
1546
- noWrap: true,
1547
- color: "text.primary",
1548
- children: info.activity_name
1549
- }
1550
- ) }),
1551
- /* @__PURE__ */ jsx(Tooltip, { title: info.description_data, children: /* @__PURE__ */ jsx(
1552
- Typography,
1553
- {
1554
- variant: "body2",
1555
- color: "text.secondary",
1556
- noWrap: true,
1557
- sx: { mt: 0.5 },
1558
- children: info.description_data
1559
- }
1560
- ) })
1561
- ] }),
1562
- /* @__PURE__ */ jsxs(Box, { sx: { flexBasis: "20%", minWidth: 180 }, children: [
1563
- /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "text.secondary", children: "Links" }),
1564
- /* @__PURE__ */ jsx(Tooltip, { title: redir, children: /* @__PURE__ */ jsx(
1565
- Typography,
1566
- {
1567
- component: "a",
1568
- href: redir,
1569
- target: "_blank",
1570
- rel: "noreferrer",
1571
- sx: {
1572
- display: "block",
1663
+ children: /* @__PURE__ */ jsxs(
1664
+ CardContent,
1665
+ {
1666
+ sx: {
1667
+ display: "flex",
1668
+ justifyContent: "space-between",
1669
+ alignItems: "center",
1670
+ flexWrap: { xs: "wrap", md: "nowrap" },
1671
+ gap: 2
1672
+ },
1673
+ children: [
1674
+ /* @__PURE__ */ jsxs(Box, { sx: { flexBasis: "20%", minWidth: 220 }, children: [
1675
+ /* @__PURE__ */ jsx(Tooltip, { title: info.activityInstruction, children: /* @__PURE__ */ jsx(Typography, { variant: "h6", fontWeight: 600, noWrap: true, children: info.activity_name }) }),
1676
+ /* @__PURE__ */ jsx(Tooltip, { title: info.description_data, children: /* @__PURE__ */ jsx(
1677
+ Typography,
1678
+ {
1679
+ variant: "body2",
1680
+ color: "text.secondary",
1681
+ noWrap: true,
1682
+ sx: { mt: 0.5 },
1683
+ children: info.description_data
1684
+ }
1685
+ ) })
1686
+ ] }),
1687
+ /* @__PURE__ */ jsxs(Box, { sx: { flexBasis: "18%", minWidth: 180 }, children: [
1688
+ /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "text.secondary", children: "Links" }),
1689
+ /* @__PURE__ */ jsx(Tooltip, { title: redir, children: /* @__PURE__ */ jsx(
1690
+ "a",
1691
+ {
1692
+ href: redir,
1693
+ target: "_blank",
1694
+ rel: "noreferrer",
1695
+ style: {
1696
+ cursor: "pointer",
1697
+ textDecoration: "none"
1698
+ },
1699
+ children: /* @__PURE__ */ jsx(
1700
+ Typography,
1701
+ {
1702
+ variant: "subtitle2",
1573
1703
  color: "primary.dark",
1574
- fontWeight: 500,
1575
- textDecoration: "none",
1576
- overflow: "hidden",
1577
- textOverflow: "ellipsis",
1578
- whiteSpace: "nowrap",
1579
- mt: 0.8
1580
- },
1581
- children: redir
1582
- }
1583
- ) })
1584
- ] }),
1585
- /* @__PURE__ */ jsxs(
1586
- Box,
1704
+ sx: {
1705
+ mt: 0.8,
1706
+ lineHeight: "15.4px",
1707
+ overflow: "hidden",
1708
+ textOverflow: "ellipsis",
1709
+ whiteSpace: "nowrap"
1710
+ },
1711
+ children: redir
1712
+ }
1713
+ )
1714
+ }
1715
+ ) })
1716
+ ] }),
1717
+ /* @__PURE__ */ jsxs(Box, { sx: { flexBasis: "12%", minWidth: 120 }, children: [
1718
+ /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "text.secondary", children: "Attachments" }),
1719
+ /* @__PURE__ */ jsx(
1720
+ Typography,
1587
1721
  {
1722
+ variant: "body2",
1723
+ noWrap: true,
1588
1724
  sx: {
1589
- flexBasis: "18%",
1590
- minWidth: 200,
1591
- display: "flex",
1592
- alignItems: "center",
1593
- justifyContent: "flex-end",
1594
- gap: 1.5
1725
+ mt: 0.8,
1726
+ color: ((_h = info == null ? void 0 : info.attachment_links) == null ? void 0 : _h.length) ? "primary.dark" : "text.disabled"
1595
1727
  },
1596
- children: [
1597
- (info == null ? void 0 : info.current_status) !== "completed" && ((_i = (_h = info == null ? void 0 : info.levels) == null ? void 0 : _h.find(
1598
- (lvl) => lvl.id === (info == null ? void 0 : info.current_level)
1599
- )) == null ? void 0 : _i.order) <= ((_k = (_j = info == null ? void 0 : info.levels) == null ? void 0 : _j.find(
1600
- (lvl) => {
1728
+ children: ((_i = info == null ? void 0 : info.attachment_links) == null ? void 0 : _i.length) ? `${info.attachment_links.length} file(s)` : "N/A"
1729
+ }
1730
+ )
1731
+ ] }),
1732
+ /* @__PURE__ */ jsxs(Box, { sx: { flexBasis: "14%", minWidth: 130 }, children: [
1733
+ /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "text.secondary", children: "TAT" }),
1734
+ /* @__PURE__ */ jsx(
1735
+ Typography,
1736
+ {
1737
+ variant: "body2",
1738
+ sx: {
1739
+ mt: 0.8,
1740
+ fontWeight: 500,
1741
+ color: "text.primary"
1742
+ },
1743
+ children: (currentLevel == null ? void 0 : currentLevel.tat_expiry) ? moment(currentLevel.tat_expiry).utcOffset("UTC+05:30").format("DD/MM/YYYY hh:mm A") : "N/A"
1744
+ }
1745
+ )
1746
+ ] }),
1747
+ /* @__PURE__ */ jsxs(
1748
+ Box,
1749
+ {
1750
+ sx: {
1751
+ flexBasis: "8%",
1752
+ minWidth: 80,
1753
+ textAlign: "center"
1754
+ },
1755
+ children: [
1756
+ /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "text.secondary", children: "Current Level" }),
1757
+ /* @__PURE__ */ jsx(Typography, { variant: "body2", sx: { mt: 0.8 }, children: (info == null ? void 0 : info.isLevelZero) ? "L0" : "L" + (((_k = (_j = info == null ? void 0 : info.levels) == null ? void 0 : _j.findIndex(
1758
+ (lvl) => lvl.id === (info == null ? void 0 : info.current_level)
1759
+ )) != null ? _k : -1) + 1 || "") })
1760
+ ]
1761
+ }
1762
+ ),
1763
+ /* @__PURE__ */ jsxs(
1764
+ Box,
1765
+ {
1766
+ sx: {
1767
+ flexBasis: "18%",
1768
+ minWidth: 200,
1769
+ display: "flex",
1770
+ alignItems: "center",
1771
+ justifyContent: "flex-end",
1772
+ gap: 1.5
1773
+ },
1774
+ children: [
1775
+ (info == null ? void 0 : info.current_status) !== "completed" ? /* @__PURE__ */ jsx(
1776
+ Statusselector_default,
1777
+ {
1778
+ onSendBack: () => handleSendBack(info == null ? void 0 : info._id),
1779
+ onApprove: () => {
1601
1780
  var _a3;
1602
- return Number(lvl.assign_to[0]) === ((_a3 = userInfo == null ? void 0 : userInfo.userInfo) == null ? void 0 : _a3.id);
1603
- }
1604
- )) == null ? void 0 : _k.order) ? /* @__PURE__ */ jsx(
1605
- Statusselector_default,
1606
- {
1607
- onSendBack: () => handleSendBack(info == null ? void 0 : info._id),
1608
- onApprove: () => {
1609
- var _a3;
1610
- return handleApprove(
1611
- `${info == null ? void 0 : info._id}|${(_a3 = statusList.find((i) => i.status == 1)) == null ? void 0 : _a3.id}`
1612
- );
1613
- },
1614
- onReject: () => {
1615
- var _a3;
1616
- return handleReject(
1617
- `${info == null ? void 0 : info._id}|${(_a3 = statusList.find((i) => i.status == 3)) == null ? void 0 : _a3.id}|${info == null ? void 0 : info.reasons}`
1618
- );
1619
- },
1620
- onHold: () => {
1621
- var _a3;
1622
- return handleOnHold(
1623
- `${info == null ? void 0 : info._id}|${(_a3 = statusList.find((i) => i.status == 2)) == null ? void 0 : _a3.id}`
1624
- );
1625
- },
1626
- statusList: (info == null ? void 0 : info.isLevelZero) && (info == null ? void 0 : info.created_by) === ((_l = userInfo == null ? void 0 : userInfo.userInfo) == null ? void 0 : _l.id) ? statusList == null ? void 0 : statusList.filter(
1627
- (app) => app.status == 1
1628
- ) : statusList
1629
- }
1630
- ) : /* @__PURE__ */ jsx(
1631
- Chip,
1632
- {
1633
- variant: "filled",
1634
- sx: {
1635
- backgroundColor: getStatus2(currentStatus).color,
1636
- color: getStatus2(currentStatus).labelColor,
1637
- height: "40px",
1638
- px: 2,
1639
- borderRadius: "100px !important",
1640
- "& .MuiChip-label": {
1641
- fontSize: "14px",
1642
- lineHeight: "15.4px",
1643
- fontWeight: "500",
1644
- textTransform: "capitalize"
1645
- }
1646
- },
1647
- label: statusData.title
1648
- }
1649
- ),
1650
- /* @__PURE__ */ jsx(
1651
- Divider,
1652
- {
1653
- orientation: "vertical",
1654
- flexItem: true,
1655
- sx: {
1656
- borderColor: "#E0E0E0",
1657
- height: "40px"
1781
+ return handleApprove(
1782
+ `${info == null ? void 0 : info._id}|${(_a3 = statusList.find((i) => i.status == 1)) == null ? void 0 : _a3.id}`
1783
+ );
1784
+ },
1785
+ onReject: () => {
1786
+ var _a3;
1787
+ return handleReject(
1788
+ `${info == null ? void 0 : info._id}|${(_a3 = statusList.find((i) => i.status == 3)) == null ? void 0 : _a3.id}|${info == null ? void 0 : info.reasons}`
1789
+ );
1790
+ },
1791
+ onHold: () => {
1792
+ var _a3;
1793
+ return handleOnHold(
1794
+ `${info == null ? void 0 : info._id}|${(_a3 = statusList.find((i) => i.status == 2)) == null ? void 0 : _a3.id}`
1795
+ );
1796
+ },
1797
+ statusList
1798
+ }
1799
+ ) : /* @__PURE__ */ jsx(
1800
+ Chip,
1801
+ {
1802
+ variant: "filled",
1803
+ sx: {
1804
+ backgroundColor: statusData.color,
1805
+ color: statusData.labelColor,
1806
+ height: "40px",
1807
+ px: 2,
1808
+ borderRadius: "100px !important",
1809
+ "& .MuiChip-label": {
1810
+ fontSize: "14px",
1811
+ lineHeight: "15.4px",
1812
+ fontWeight: "500",
1813
+ textTransform: "capitalize"
1658
1814
  }
1815
+ },
1816
+ label: statusData.title
1817
+ }
1818
+ ),
1819
+ /* @__PURE__ */ jsx(
1820
+ Divider,
1821
+ {
1822
+ orientation: "vertical",
1823
+ flexItem: true,
1824
+ sx: {
1825
+ borderColor: "#E0E0E0",
1826
+ height: "40px"
1659
1827
  }
1660
- ),
1661
- /* @__PURE__ */ jsx(
1662
- IconButton,
1663
- {
1664
- disableFocusRipple: true,
1665
- disableRipple: true,
1666
- color: "primary",
1667
- sx: {
1668
- background: "rgba(25,118,210,0.08)",
1669
- boxShadow: "2px 2px 10px 0px #4C4E6426",
1670
- "& span": { color: "primary.dark" }
1671
- },
1672
- onClick: () => handleExpandClick(info._id),
1673
- children: expandedId === info._id ? /* @__PURE__ */ jsx("span", { className: "icon-arrow-down-1" }) : /* @__PURE__ */ jsx("span", { className: "icon-arrow-right-3" })
1674
- }
1675
- )
1676
- ]
1677
- }
1678
- )
1679
- ]
1680
- }
1681
- ),
1682
- expandedId === info._id && /* @__PURE__ */ jsx(Box, { sx: { mt: 2, ml: 2 }, children: !(expandedDetails == null ? void 0 : expandedDetails.length) ? /* @__PURE__ */ jsx(
1683
- Box,
1684
- {
1685
- sx: {
1686
- height: 150,
1687
- display: "flex",
1688
- justifyContent: "center",
1689
- alignItems: "center"
1690
- },
1691
- children: /* @__PURE__ */ jsx(CircularProgress, { size: 36, color: "primary" })
1692
- }
1693
- ) : /* @__PURE__ */ jsx(
1694
- CustomTimelineWithStatus,
1695
- {
1696
- events: expandedDetails == null ? void 0 : expandedDetails.map((item) => {
1697
- var _a3, _b3, _c3, _d3;
1698
- return {
1699
- date: moment(item == null ? void 0 : item.created_at).format(
1700
- "DD-MM-YYYY"
1701
- ),
1702
- time: moment(item == null ? void 0 : item.created_at).format("HH:mm"),
1703
- title: (item == null ? void 0 : item.type) === "create" ? `Raised by - ${(_a3 = item == null ? void 0 : item.created_by_user) == null ? void 0 : _a3.full_name}` : ((_b3 = item == null ? void 0 : item.created_by_user) == null ? void 0 : _b3.full_name) || "N/A",
1704
- subTitle: ((_c3 = item == null ? void 0 : item.comment_reasons) == null ? void 0 : _c3.comment) || "No Comments",
1705
- attachment: ((_d3 = item == null ? void 0 : item.comment_reasons) == null ? void 0 : _d3.file) || null,
1706
- count: (item == null ? void 0 : item.current_level) == "L0" ? "L0" : item == null ? void 0 : item.current_level_count,
1707
- cardType: "card"
1708
- };
1709
- })
1710
- }
1711
- ) })
1712
- ]
1828
+ }
1829
+ ),
1830
+ /* @__PURE__ */ jsx(
1831
+ IconButton,
1832
+ {
1833
+ color: "primary",
1834
+ sx: {
1835
+ background: "rgba(25,118,210,0.08)",
1836
+ boxShadow: "2px 2px 10px 0px #4C4E6426",
1837
+ "& span": { color: "primary.dark" }
1838
+ },
1839
+ onClick: () => handleExpandClick(info._id),
1840
+ children: expandedId === info._id ? /* @__PURE__ */ jsx("span", { className: "icon-arrow-down-1" }) : /* @__PURE__ */ jsx("span", { className: "icon-arrow-right-3" })
1841
+ }
1842
+ )
1843
+ ]
1844
+ }
1845
+ )
1846
+ ]
1847
+ }
1848
+ )
1713
1849
  },
1714
1850
  index
1715
1851
  );
@@ -1803,12 +1939,44 @@ function DialogOpener({
1803
1939
  ) });
1804
1940
  }
1805
1941
  function DialogOpener2(props) {
1806
- const { api, urlBuilder, loadingComponent, userInfoData, ...rest } = props;
1807
- return /* @__PURE__ */ jsx(WorkflowProvider, { value: { api, urlBuilder, userInfo: userInfoData, loadingComponent }, children: /* @__PURE__ */ jsx(DialogOpener, { ...rest, userInfoData }) });
1942
+ const {
1943
+ api,
1944
+ urlBuilder,
1945
+ loadingComponent,
1946
+ userInfoData,
1947
+ ENV_VARIABLES,
1948
+ ...rest
1949
+ } = props;
1950
+ return /* @__PURE__ */ jsx(
1951
+ WorkflowProvider,
1952
+ {
1953
+ value: {
1954
+ api,
1955
+ urlBuilder,
1956
+ userInfo: userInfoData,
1957
+ loadingComponent,
1958
+ ENV_VARIABLES
1959
+ },
1960
+ children: /* @__PURE__ */ jsx(DialogOpener, { ...rest, userInfoData })
1961
+ }
1962
+ );
1808
1963
  }
1809
1964
  function ApprovalWorkflow2(props) {
1810
- const { api, urlBuilder, loadingComponent, userInfo, ...rest } = props;
1811
- return /* @__PURE__ */ jsx(WorkflowProvider, { value: { api, urlBuilder, userInfo, loadingComponent }, children: /* @__PURE__ */ jsx(ApprovalWorkflow, { userInfo, ...rest }) });
1965
+ const {
1966
+ api,
1967
+ urlBuilder,
1968
+ loadingComponent,
1969
+ userInfo,
1970
+ ENV_VARIABLES,
1971
+ ...rest
1972
+ } = props;
1973
+ return /* @__PURE__ */ jsx(
1974
+ WorkflowProvider,
1975
+ {
1976
+ value: { api, urlBuilder, userInfo, loadingComponent, ENV_VARIABLES },
1977
+ children: /* @__PURE__ */ jsx(ApprovalWorkflow, { userInfo, ...rest })
1978
+ }
1979
+ );
1812
1980
  }
1813
1981
 
1814
1982
  export { ApprovalWorkflow2 as ApprovalWorkflow, DialogOpener2 as DialogOpener };