amp-workflow-ui 0.1.0

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 (8) hide show
  1. package/README.md +63 -0
  2. package/dist/index.d.mts +41 -0
  3. package/dist/index.d.ts +41 -0
  4. package/dist/index.js +695 -0
  5. package/dist/index.js.map +1 -0
  6. package/dist/index.mjs +681 -0
  7. package/dist/index.mjs.map +1 -0
  8. package/package.json +43 -0
package/dist/index.mjs ADDED
@@ -0,0 +1,681 @@
1
+ import React2, { createContext, useState, useEffect, useContext } from 'react';
2
+ import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
3
+ import Button2 from '@mui/material/Button';
4
+ import Dialog from '@mui/material/Dialog';
5
+ import { useTheme } from '@mui/material/styles';
6
+ import useMediaQuery from '@mui/material/useMediaQuery';
7
+ import DialogActions from '@mui/material/DialogActions';
8
+ import DialogContent from '@mui/material/DialogContent';
9
+ import { styled, Chip, Typography, IconButton, useTheme as useTheme$1, Tooltip, Card, CardContent, Divider, Grid, CircularProgress } from '@mui/material';
10
+ import HighlightOffIcon from '@mui/icons-material/HighlightOff';
11
+ import { Box } from '@mui/system';
12
+ import moment from 'moment';
13
+
14
+ // src/context.tsx
15
+ var WorkflowContext = createContext(null);
16
+ function WorkflowProvider({
17
+ value,
18
+ children
19
+ }) {
20
+ return /* @__PURE__ */ jsx(WorkflowContext.Provider, { value, children });
21
+ }
22
+ function useWorkflowContext() {
23
+ const ctx = useContext(WorkflowContext);
24
+ if (!ctx) {
25
+ throw new Error("useWorkflowContext must be used within WorkflowProvider");
26
+ }
27
+ return ctx;
28
+ }
29
+ var StyledChipProps = styled(Chip)(({ theme }) => {
30
+ var _a, _b, _c, _d, _e, _f, _g;
31
+ return {
32
+ "&.MuiChip-colorPrimary": {
33
+ border: `1px solid ${theme.palette.primary.dark}`,
34
+ borderRadius: "8px",
35
+ height: "36px",
36
+ padding: "6px 4px",
37
+ background: `${(_b = (_a = theme.palette.customColors) == null ? void 0 : _a.customChipBackgroundColor) != null ? _b : "rgba(25,118,210,0.1)"}`,
38
+ color: `${(_d = (_c = theme.palette.customColors) == null ? void 0 : _c.customChipColor) != null ? _d : theme.palette.primary.dark}`,
39
+ width: "170px",
40
+ overflow: "hidden",
41
+ whiteSpace: "nowrap",
42
+ textOverflow: "ellipsis"
43
+ },
44
+ "&.MuiChip-colorDefault": {
45
+ border: `1px solid ${theme.palette.grey[300]} !important`,
46
+ borderRadius: "8px",
47
+ height: "36px",
48
+ padding: "6px 4px",
49
+ background: "none !important",
50
+ color: `${(_g = (_f = (_e = theme.palette) == null ? void 0 : _e.customColors) == null ? void 0 : _f.mainText) != null ? _g : theme.palette.text.primary} `,
51
+ width: "170px",
52
+ overflow: "hidden",
53
+ whiteSpace: "nowrap",
54
+ textOverflow: "ellipsis"
55
+ }
56
+ };
57
+ });
58
+ var TruncatedTypography = styled(Typography)(({ theme }) => ({
59
+ overflow: "hidden",
60
+ textOverflow: "ellipsis",
61
+ whiteSpace: "nowrap",
62
+ width: "200px",
63
+ [theme.breakpoints.down("sm")]: {
64
+ width: "80px"
65
+ }
66
+ }));
67
+ function ApprovalWorkflow({
68
+ selectedWorkflowsList = [],
69
+ userInfo
70
+ }) {
71
+ const theme = useTheme$1();
72
+ const { api, urlBuilder, loadingComponent } = useWorkflowContext();
73
+ const [selectedApprovalOtions, setSelectedApprovalOtions] = useState(
74
+ selectedWorkflowsList.length ? "selected" : "Action Required"
75
+ );
76
+ const [expandedId, setExpandedId] = useState(null);
77
+ const [sendDialog, setSendDialog] = React2.useState(null);
78
+ const [approveDialog, setApproveDialog] = React2.useState(null);
79
+ const [rejectDialog, setRejectDialog] = React2.useState(null);
80
+ const [onHoldDialog, setOnHoldDialog] = React2.useState(null);
81
+ const [expandedDetails, setExpandedDetails] = useState([]);
82
+ const [statusCount, setStatusCount] = useState({});
83
+ const [urlConfig, setUrlConfig] = useState({});
84
+ const [allRequestArray, setAllRequestArray] = useState([]);
85
+ const [pendingRequestArray, setPendingRequestArray] = useState([]);
86
+ const [selectedRequestArray, setSelectedRequestArray] = useState([]);
87
+ const [isLoading, setIsLoading] = useState(false);
88
+ const handleProfileToggle = (option) => {
89
+ setSelectedApprovalOtions(option);
90
+ if (option === "Action Required") fetchPendingActivities();
91
+ if (option === "All Requests") fetchAllActivites();
92
+ if (option === "selected") fetchSelectedActivites();
93
+ };
94
+ const handleExpandClick = (id) => {
95
+ setExpandedId((prevId) => prevId === id ? null : id);
96
+ fetchExpandedActivityLogs(id);
97
+ };
98
+ const getStatus = (status) => {
99
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o;
100
+ switch (status) {
101
+ case "approved":
102
+ return {
103
+ title: "Approved",
104
+ color: theme.palette.success.light,
105
+ labelColor: theme.palette.success.main
106
+ };
107
+ case "rejected":
108
+ return {
109
+ title: "Rejected",
110
+ color: (_c = (_b = (_a = theme.palette) == null ? void 0 : _a.customColors) == null ? void 0 : _b.chipWarningContainer) != null ? _c : theme.palette.error.light,
111
+ labelColor: theme.palette.error.main
112
+ };
113
+ case "onhold":
114
+ return {
115
+ title: "On Hold",
116
+ color: (_f = (_e = (_d = theme.palette) == null ? void 0 : _d.customColors) == null ? void 0 : _e.chipPendingContainer) != null ? _f : theme.palette.warning.light,
117
+ labelColor: (_i = (_h = (_g = theme.palette) == null ? void 0 : _g.customColors) == null ? void 0 : _h.chipPendingText) != null ? _i : theme.palette.warning.main
118
+ };
119
+ case "pending":
120
+ default:
121
+ return {
122
+ title: "Pending",
123
+ color: (_l = (_k = (_j = theme.palette) == null ? void 0 : _j.customColors) == null ? void 0 : _k.approvalPrimaryChipBG) != null ? _l : theme.palette.info.light,
124
+ labelColor: (_o = (_n = (_m = theme.palette) == null ? void 0 : _m.customColors) == null ? void 0 : _n.approvalPrimaryChipText) != null ? _o : theme.palette.info.main
125
+ };
126
+ }
127
+ };
128
+ const approvalChipLabel = [
129
+ { label: "Action Required", icon: /* @__PURE__ */ jsx("span", { className: "icon-document-forward" }), count: (statusCount == null ? void 0 : statusCount.pending_activities_count) || "" },
130
+ { label: "All Requests", icon: /* @__PURE__ */ jsx("span", { className: "icon-document-copy" }), count: (statusCount == null ? void 0 : statusCount.total_activities_count) || "" }
131
+ ];
132
+ const fetchExpandedActivityLogs = (workflowLogId) => {
133
+ setExpandedDetails([]);
134
+ api.get({ url: `/workflow/workflow-activity-logs/${workflowLogId}`, serviceURL: "api" }).then((res) => setExpandedDetails(res == null ? void 0 : res.data));
135
+ };
136
+ const fetchPendingActivities = () => {
137
+ var _a;
138
+ setIsLoading(true);
139
+ api.get({ url: `/workflow/activity-workflow/${(_a = userInfo == null ? void 0 : userInfo.userInfo) == null ? void 0 : _a.id}?paginate=false&type=pending`, serviceURL: "api" }).then((res) => {
140
+ var _a2;
141
+ return setPendingRequestArray((_a2 = res == null ? void 0 : res.data) == null ? void 0 : _a2.activities);
142
+ }).finally(() => setIsLoading(false));
143
+ };
144
+ const fetchAllActivites = () => {
145
+ var _a;
146
+ setIsLoading(true);
147
+ api.get({ url: `/workflow/activity-workflow/${(_a = userInfo == null ? void 0 : userInfo.userInfo) == null ? void 0 : _a.id}?paginate=false`, serviceURL: "api" }).then((res) => {
148
+ var _a2;
149
+ return setAllRequestArray((_a2 = res == null ? void 0 : res.data) == null ? void 0 : _a2.activities);
150
+ }).finally(() => setIsLoading(false));
151
+ };
152
+ const fetchSelectedActivites = () => {
153
+ setIsLoading(true);
154
+ api.post({ url: `/workflow/bulk-details`, serviceURL: "api", data: { workflowIds: selectedWorkflowsList } }).then((res) => setSelectedRequestArray(res == null ? void 0 : res.data)).finally(() => setIsLoading(false));
155
+ };
156
+ const fetchStatusCount = () => {
157
+ var _a;
158
+ api.get({ url: `/workflow/status-count/${(_a = userInfo == null ? void 0 : userInfo.userInfo) == null ? void 0 : _a.id}`, serviceURL: "api" }).then((res) => {
159
+ var _a2;
160
+ setStatusCount((_a2 = res == null ? void 0 : res.data) == null ? void 0 : _a2[0]);
161
+ });
162
+ };
163
+ useEffect(() => {
164
+ if (!sendDialog && !approveDialog && !onHoldDialog && !rejectDialog) {
165
+ fetchAllActivites();
166
+ fetchStatusCount();
167
+ fetchPendingActivities();
168
+ setExpandedDetails([]);
169
+ setExpandedId(null);
170
+ }
171
+ }, [sendDialog, approveDialog, onHoldDialog, rejectDialog, userInfo]);
172
+ useEffect(() => {
173
+ api.get({ url: `/workflow/url-config`, serviceURL: "api" }).then((res) => {
174
+ const data = (res == null ? void 0 : res.data) || [];
175
+ const map = data.reduce((acc, { module_name, ...details }) => {
176
+ acc[module_name] = details;
177
+ return acc;
178
+ }, {});
179
+ setUrlConfig(map);
180
+ });
181
+ }, []);
182
+ useEffect(() => {
183
+ if (selectedWorkflowsList.length && !selectedRequestArray.length) {
184
+ fetchSelectedActivites();
185
+ }
186
+ }, [selectedWorkflowsList]);
187
+ const buildRedirectionUrl = (info) => {
188
+ if (info == null ? void 0 : info.redirection_link) return info.redirection_link;
189
+ if (urlBuilder) return urlBuilder(info == null ? void 0 : info.module_name, info == null ? void 0 : info.module_id, urlConfig, info == null ? void 0 : info.reference_id);
190
+ const ref = urlConfig == null ? void 0 : urlConfig[info == null ? void 0 : info.module_name];
191
+ if ((ref == null ? void 0 : ref.base_url) && (ref == null ? void 0 : ref.sub_url)) {
192
+ const qs = new URLSearchParams();
193
+ if (info == null ? void 0 : info.reference_id) qs.set("reference_id", String(info == null ? void 0 : info.reference_id));
194
+ if (info == null ? void 0 : info.module_name) qs.set("module_name", String(info == null ? void 0 : info.module_name));
195
+ return `${ref.base_url}${ref.sub_url}${qs.toString() ? `?${qs.toString()}` : ""}`;
196
+ }
197
+ return "#";
198
+ };
199
+ if (isLoading && loadingComponent) return /* @__PURE__ */ jsx(Fragment, { children: loadingComponent });
200
+ return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(Box, { sx: { display: "flex", justifyContent: "center", flexWrap: "nowrap" }, children: /* @__PURE__ */ jsxs(Box, { sx: { width: "100%", height: "100%" }, children: [
201
+ /* @__PURE__ */ jsx(Box, { sx: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: /* @__PURE__ */ jsxs(Box, { sx: { mt: 2, mb: 2 }, children: [
202
+ (selectedWorkflowsList == null ? void 0 : selectedWorkflowsList.length) ? /* @__PURE__ */ jsx(Tooltip, { title: "Selected Workflows", children: /* @__PURE__ */ jsx(
203
+ StyledChipProps,
204
+ {
205
+ label: "Selected",
206
+ icon: /* @__PURE__ */ jsx("span", { className: "icon-eye" }),
207
+ color: (selectedApprovalOtions == null ? void 0 : selectedApprovalOtions.includes("selected")) ? "primary" : "default",
208
+ variant: "filled",
209
+ sx: { mr: 4, mb: 4, "& .MuiChip-icon": { fontSize: "18px !important" } },
210
+ onClick: () => handleProfileToggle("selected")
211
+ }
212
+ ) }) : "",
213
+ approvalChipLabel.map(({ label, icon, count }, index) => /* @__PURE__ */ jsx(Tooltip, { title: `${count} ${label}`, children: /* @__PURE__ */ jsx(
214
+ StyledChipProps,
215
+ {
216
+ label: `${count} ${label}`,
217
+ icon,
218
+ color: (selectedApprovalOtions == null ? void 0 : selectedApprovalOtions.includes(label)) ? "primary" : "default",
219
+ variant: "filled",
220
+ sx: { mr: 4, mb: 4, "& .MuiChip-icon": { fontSize: "18px !important" } },
221
+ onClick: () => handleProfileToggle(label)
222
+ }
223
+ ) }, index))
224
+ ] }) }),
225
+ selectedApprovalOtions === "selected" && /* @__PURE__ */ jsx(Box, { className: "fixedModal", sx: { overflowY: "auto", height: "calc(100vh - 180px)" }, children: selectedRequestArray && selectedRequestArray.map((info, index) => {
226
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H;
227
+ const currentLevel = info == null ? void 0 : info.levels.find((level_) => level_.id === (info == null ? void 0 : info.current_level));
228
+ currentLevel ? currentLevel.status_list : [];
229
+ const redir = buildRedirectionUrl(info);
230
+ return /* @__PURE__ */ jsxs(React2.Fragment, { children: [
231
+ /* @__PURE__ */ jsx(
232
+ Card,
233
+ {
234
+ sx: {
235
+ mb: 8,
236
+ "&.MuiCard-root.MuiPaper-elevation": {
237
+ boxShadow: "2px 2px 10px 0px #4C4E6426",
238
+ padding: "20px",
239
+ borderRadius: "10px"
240
+ }
241
+ },
242
+ children: /* @__PURE__ */ jsxs(CardContent, { sx: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
243
+ /* @__PURE__ */ jsxs(Box, { children: [
244
+ /* @__PURE__ */ jsx(Tooltip, { title: info.activityInstruction, children: /* @__PURE__ */ jsx(TruncatedTypography, { variant: "h6", color: "text.primary", sx: { textTransform: "capitalize", lineHeight: "22px" }, children: info.activity_name }) }),
245
+ /* @__PURE__ */ jsx(Tooltip, { title: info.description_data, children: /* @__PURE__ */ jsx(
246
+ TruncatedTypography,
247
+ {
248
+ variant: "body2",
249
+ color: "customColors.mainText",
250
+ sx: { mt: "13px", textTransform: "capitalize", lineHeight: "15.4px" },
251
+ children: info.description_data
252
+ }
253
+ ) })
254
+ ] }),
255
+ /* @__PURE__ */ jsxs(Box, { children: [
256
+ /* @__PURE__ */ jsx(Tooltip, { title: "Links", children: /* @__PURE__ */ jsx(
257
+ TruncatedTypography,
258
+ {
259
+ variant: "caption",
260
+ color: "customColors.text3",
261
+ sx: { textTransform: "capitalize", lineHeight: "13.2px" },
262
+ children: "Links"
263
+ }
264
+ ) }),
265
+ /* @__PURE__ */ jsx(Tooltip, { title: redir, children: /* @__PURE__ */ jsx("a", { href: redir, style: { cursor: "pointer", textDecoration: "none" }, target: "_blank", rel: "noreferrer", children: /* @__PURE__ */ jsx(
266
+ TruncatedTypography,
267
+ {
268
+ variant: "subtitle2",
269
+ color: "primary.dark",
270
+ sx: { mt: "13px", lineHeight: "15.4px" },
271
+ children: redir
272
+ }
273
+ ) }) })
274
+ ] }),
275
+ /* @__PURE__ */ jsxs(Box, { children: [
276
+ /* @__PURE__ */ jsx(Tooltip, { title: "Attachments", children: /* @__PURE__ */ jsx(
277
+ TruncatedTypography,
278
+ {
279
+ variant: "caption",
280
+ color: "customColors.text3",
281
+ sx: { textTransform: "capitalize", lineHeight: "13.2px" },
282
+ children: "Attachments"
283
+ }
284
+ ) }),
285
+ ((_a = info == null ? void 0 : info.attachment_links) == null ? void 0 : _a.length) ? info == null ? void 0 : info.attachment_links.map((link, idx) => /* @__PURE__ */ jsx(Tooltip, { title: `Attachment ${idx + 1}`, children: /* @__PURE__ */ jsx("a", { href: link, style: { cursor: "pointer", textDecoration: "none" }, target: "_blank", rel: "noreferrer", children: /* @__PURE__ */ jsx(
286
+ TruncatedTypography,
287
+ {
288
+ variant: "subtitle2",
289
+ color: "primary.dark",
290
+ sx: { mt: "13px", textTransform: "capitalize", lineHeight: "15.4px" },
291
+ children: link || "N/A"
292
+ }
293
+ ) }) }, idx)) : /* @__PURE__ */ jsx(Box, { sx: { display: "flex", mt: 2, justifyContent: "center", alignItems: "center", lineHeight: "15.4px" }, children: "N/A" })
294
+ ] }),
295
+ /* @__PURE__ */ jsxs(Box, { children: [
296
+ /* @__PURE__ */ jsx(Tooltip, { title: "Date and Time", children: /* @__PURE__ */ jsx(
297
+ TruncatedTypography,
298
+ {
299
+ variant: "caption",
300
+ color: "customColors.text3",
301
+ sx: { textTransform: "capitalize", lineHeight: "13.2px" },
302
+ children: "TAT"
303
+ }
304
+ ) }),
305
+ /* @__PURE__ */ jsx(Tooltip, { title: info.dateTime, children: /* @__PURE__ */ jsx(
306
+ TruncatedTypography,
307
+ {
308
+ variant: "subtitle2",
309
+ color: "customColors.mainText",
310
+ sx: { mt: "13px", textTransform: "capitalize", lineHeight: "15.4px" },
311
+ children: ((_c = (_b = info == null ? void 0 : info.levels) == null ? void 0 : _b.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _c.tat_expiry) ? moment((_e = (_d = info == null ? void 0 : info.levels) == null ? void 0 : _d.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _e.tat_expiry).utcOffset("UTC+05:30").format("DD/MM/YYYY HH:MM A") : "N/A"
312
+ }
313
+ ) })
314
+ ] }),
315
+ /* @__PURE__ */ jsxs(Box, { children: [
316
+ /* @__PURE__ */ jsx(Tooltip, { title: "Current active level of Workflow", children: /* @__PURE__ */ jsx(
317
+ TruncatedTypography,
318
+ {
319
+ variant: "caption",
320
+ color: "customColors.text3",
321
+ sx: { textTransform: "capitalize", lineHeight: "13.2px" },
322
+ children: "Current Level"
323
+ }
324
+ ) }),
325
+ /* @__PURE__ */ jsx(Box, { sx: { display: "flex", mt: 2, justifyContent: "center", alignItems: "center" }, children: (info == null ? void 0 : info.isLevelZero) ? "L0" : "L" + (((_g = (_f = info == null ? void 0 : info.levels) == null ? void 0 : _f.findIndex((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) != null ? _g : -1) + 1 || "") })
326
+ ] }),
327
+ /* @__PURE__ */ jsxs(Box, { sx: { mt: 2, display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
328
+ /* @__PURE__ */ jsx(
329
+ Chip,
330
+ {
331
+ variant: "filled",
332
+ sx: {
333
+ backgroundColor: `${(_n = getStatus(
334
+ ((_j = (_i = (_h = info == null ? void 0 : info.levels) == null ? void 0 : _h.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _i.selected_status) == null ? void 0 : _j.status_id) === 1 ? "approved" : ((_m = (_l = (_k = info == null ? void 0 : info.levels) == null ? void 0 : _k.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _l.selected_status) == null ? void 0 : _m.status_id) === 3 ? "rejected" : "pending"
335
+ )) == null ? void 0 : _n.color} !important`,
336
+ color: `${(_u = getStatus(
337
+ ((_q = (_p = (_o = info == null ? void 0 : info.levels) == null ? void 0 : _o.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _p.selected_status) == null ? void 0 : _q.status_id) === 1 ? "approved" : ((_t = (_s = (_r = info == null ? void 0 : info.levels) == null ? void 0 : _r.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _s.selected_status) == null ? void 0 : _t.status_id) === 3 ? "rejected" : "pending"
338
+ )) == null ? void 0 : _u.labelColor} !important`,
339
+ height: "40px",
340
+ padding: "8px",
341
+ borderRadius: "100px !important",
342
+ border: "0px !important",
343
+ "& .MuiChip-label": {
344
+ fontSize: "14px",
345
+ lineHeight: "15.4px",
346
+ fontWeight: "500",
347
+ textTransform: "capitalize"
348
+ }
349
+ },
350
+ label: `${((_x = (_w = (_v = info == null ? void 0 : info.levels) == null ? void 0 : _v.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _w.selected_status) == null ? void 0 : _x.status_id) === 2 || (info == null ? void 0 : info.isLevelZero) || !((_z = (_y = info == null ? void 0 : info.levels) == null ? void 0 : _y.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _z.selected_status) ? "pending" : (_C = (_B = (_A = info == null ? void 0 : info.levels) == null ? void 0 : _A.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _B.selected_status) == null ? void 0 : _C.name}`
351
+ }
352
+ ),
353
+ /* @__PURE__ */ jsx(Divider, { orientation: "vertical", sx: { ml: 5, borderColor: (_E = (_D = theme.palette) == null ? void 0 : _D.customColors) == null ? void 0 : _E.text4, height: "50px" } }),
354
+ /* @__PURE__ */ jsx(
355
+ IconButton,
356
+ {
357
+ disableFocusRipple: true,
358
+ disableRipple: true,
359
+ color: "primary",
360
+ sx: {
361
+ ml: 5,
362
+ background: (_H = (_G = (_F = theme.palette) == null ? void 0 : _F.customColors) == null ? void 0 : _G.primaryLightest) != null ? _H : "rgba(25,118,210,0.08)",
363
+ boxShadow: "2px 2px 10px 0px #4C4E6426",
364
+ "& span": { color: theme.palette.primary.dark }
365
+ },
366
+ onClick: () => handleExpandClick(info._id),
367
+ children: expandedId === info._id ? /* @__PURE__ */ jsx("span", { className: "icon-arrow-down-1" }) : /* @__PURE__ */ jsx("span", { className: "icon-arrow-right-3" })
368
+ }
369
+ )
370
+ ] })
371
+ ] })
372
+ }
373
+ ),
374
+ expandedId === info._id && /* @__PURE__ */ jsx(Grid, { container: true, xs: 12, spacing: 5, children: /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, sx: { transform: "translateX(3.9%)" }, children: !(expandedDetails == null ? void 0 : expandedDetails.length) ? /* @__PURE__ */ jsx(Box, { sx: { height: "200px", display: "flex", justifyContent: "center", alignItems: "center" }, children: /* @__PURE__ */ jsx(CircularProgress, { size: 40, sx: { color: theme.palette.primary.dark } }) }) : /* @__PURE__ */ jsx(Box, { sx: { pl: 2 }, children: expandedDetails == null ? void 0 : expandedDetails.map((item, idx) => {
375
+ var _a2;
376
+ return /* @__PURE__ */ jsxs(Box, { sx: { mb: 2 }, children: [
377
+ /* @__PURE__ */ jsx(Typography, { variant: "caption", sx: { mr: 2 }, children: moment(item == null ? void 0 : item.created_at).format("DD-MM-YYYY HH:mm") }),
378
+ /* @__PURE__ */ jsxs(Typography, { variant: "body2", component: "span", children: [
379
+ item == null ? void 0 : item.type,
380
+ " - ",
381
+ ((_a2 = item == null ? void 0 : item.comment_reasons) == null ? void 0 : _a2.comment) || "No Comments"
382
+ ] })
383
+ ] }, idx);
384
+ }) }) }) })
385
+ ] }, index);
386
+ }) }),
387
+ selectedApprovalOtions === "All Requests" && /* @__PURE__ */ jsx(Box, { className: "fixedModal", sx: { overflowY: "auto", height: "calc(100vh - 180px)" }, children: allRequestArray && allRequestArray.map((info, index) => {
388
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B;
389
+ const currentLevel = info == null ? void 0 : info.levels.find((level_) => level_.id === (info == null ? void 0 : info.current_level));
390
+ currentLevel ? currentLevel.status_list : [];
391
+ const redir = buildRedirectionUrl(info);
392
+ return /* @__PURE__ */ jsxs(React2.Fragment, { children: [
393
+ /* @__PURE__ */ jsx(
394
+ Card,
395
+ {
396
+ sx: {
397
+ mb: 8,
398
+ "&.MuiCard-root.MuiPaper-elevation": {
399
+ boxShadow: "2px 2px 10px 0px #4C4E6426",
400
+ padding: "20px",
401
+ borderRadius: "10px"
402
+ }
403
+ },
404
+ children: /* @__PURE__ */ jsxs(CardContent, { sx: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
405
+ /* @__PURE__ */ jsxs(Box, { children: [
406
+ /* @__PURE__ */ jsx(Tooltip, { title: info.activityInstruction, children: /* @__PURE__ */ jsx(TruncatedTypography, { variant: "h6", color: "text.primary", sx: { textTransform: "capitalize", lineHeight: "22px" }, children: info.activity_name }) }),
407
+ /* @__PURE__ */ jsx(Tooltip, { title: info.description_data, children: /* @__PURE__ */ jsx(
408
+ TruncatedTypography,
409
+ {
410
+ variant: "body2",
411
+ color: "customColors.mainText",
412
+ sx: { mt: "13px", textTransform: "capitalize", lineHeight: "15.4px" },
413
+ children: info.description_data
414
+ }
415
+ ) })
416
+ ] }),
417
+ /* @__PURE__ */ jsxs(Box, { children: [
418
+ /* @__PURE__ */ jsx(Tooltip, { title: "Links", children: /* @__PURE__ */ jsx(
419
+ TruncatedTypography,
420
+ {
421
+ variant: "caption",
422
+ color: "customColors.text3",
423
+ sx: { textTransform: "capitalize", lineHeight: "13.2px" },
424
+ children: "Links"
425
+ }
426
+ ) }),
427
+ /* @__PURE__ */ jsx(Tooltip, { title: redir, children: /* @__PURE__ */ jsx("a", { href: redir, style: { cursor: "pointer", textDecoration: "none" }, target: "_blank", rel: "noreferrer", children: /* @__PURE__ */ jsx(
428
+ TruncatedTypography,
429
+ {
430
+ variant: "subtitle2",
431
+ color: "primary.dark",
432
+ sx: { mt: "13px", lineHeight: "15.4px" },
433
+ children: redir
434
+ }
435
+ ) }) })
436
+ ] }),
437
+ /* @__PURE__ */ jsxs(Box, { children: [
438
+ /* @__PURE__ */ jsx(Tooltip, { title: "Attachments", children: /* @__PURE__ */ jsx(
439
+ TruncatedTypography,
440
+ {
441
+ variant: "caption",
442
+ color: "customColors.text3",
443
+ sx: { textTransform: "capitalize", lineHeight: "13.2px" },
444
+ children: "Attachments"
445
+ }
446
+ ) }),
447
+ ((_a = info == null ? void 0 : info.attachment_links) == null ? void 0 : _a.length) ? info == null ? void 0 : info.attachment_links.map((link, idx) => /* @__PURE__ */ jsx(Tooltip, { title: `Attachment ${idx + 1}`, children: /* @__PURE__ */ jsx("a", { href: link, style: { cursor: "pointer", textDecoration: "none" }, target: "_blank", rel: "noreferrer", children: /* @__PURE__ */ jsx(
448
+ TruncatedTypography,
449
+ {
450
+ variant: "subtitle2",
451
+ color: "primary.dark",
452
+ sx: { mt: "13px", textTransform: "capitalize", lineHeight: "15.4px" },
453
+ children: link || "N/A"
454
+ }
455
+ ) }) }, idx)) : /* @__PURE__ */ jsx(Box, { sx: { display: "flex", mt: 2, justifyContent: "center", alignItems: "center", lineHeight: "15.4px" }, children: "N/A" })
456
+ ] }),
457
+ /* @__PURE__ */ jsxs(Box, { sx: { mt: 2, display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
458
+ /* @__PURE__ */ jsx(
459
+ Chip,
460
+ {
461
+ variant: "filled",
462
+ sx: {
463
+ backgroundColor: `${(_h = getStatus(
464
+ ((_d = (_c = (_b = info == null ? void 0 : info.levels) == null ? void 0 : _b.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _c.selected_status) == null ? void 0 : _d.status_id) === 1 ? "approved" : ((_g = (_f = (_e = info == null ? void 0 : info.levels) == null ? void 0 : _e.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _f.selected_status) == null ? void 0 : _g.status_id) === 3 ? "rejected" : "pending"
465
+ )) == null ? void 0 : _h.color} !important`,
466
+ color: `${(_o = getStatus(
467
+ ((_k = (_j = (_i = info == null ? void 0 : info.levels) == null ? void 0 : _i.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _j.selected_status) == null ? void 0 : _k.status_id) === 1 ? "approved" : ((_n = (_m = (_l = info == null ? void 0 : info.levels) == null ? void 0 : _l.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _m.selected_status) == null ? void 0 : _n.status_id) === 3 ? "rejected" : "pending"
468
+ )) == null ? void 0 : _o.labelColor} !important`,
469
+ height: "40px",
470
+ padding: "8px",
471
+ borderRadius: "100px !important",
472
+ border: "0px !important",
473
+ "& .MuiChip-label": {
474
+ fontSize: "14px",
475
+ lineHeight: "15.4px",
476
+ fontWeight: "500",
477
+ textTransform: "capitalize"
478
+ }
479
+ },
480
+ label: `${((_r = (_q = (_p = info == null ? void 0 : info.levels) == null ? void 0 : _p.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _q.selected_status) == null ? void 0 : _r.status_id) === 2 || (info == null ? void 0 : info.isLevelZero) || !((_t = (_s = info == null ? void 0 : info.levels) == null ? void 0 : _s.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _t.selected_status) ? "pending" : (_w = (_v = (_u = info == null ? void 0 : info.levels) == null ? void 0 : _u.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _v.selected_status) == null ? void 0 : _w.name}`
481
+ }
482
+ ),
483
+ /* @__PURE__ */ jsx(Divider, { orientation: "vertical", sx: { ml: 5, borderColor: (_y = (_x = theme.palette) == null ? void 0 : _x.customColors) == null ? void 0 : _y.text4, height: "50px" } }),
484
+ /* @__PURE__ */ jsx(
485
+ IconButton,
486
+ {
487
+ disableFocusRipple: true,
488
+ disableRipple: true,
489
+ color: "primary",
490
+ sx: {
491
+ ml: 5,
492
+ background: (_B = (_A = (_z = theme.palette) == null ? void 0 : _z.customColors) == null ? void 0 : _A.primaryLightest) != null ? _B : "rgba(25,118,210,0.08)",
493
+ boxShadow: "2px 2px 10px 0px #4C4E6426",
494
+ "& span": { color: theme.palette.primary.dark }
495
+ },
496
+ onClick: () => handleExpandClick(info._id),
497
+ children: expandedId === info._id ? /* @__PURE__ */ jsx("span", { className: "icon-arrow-down-1" }) : /* @__PURE__ */ jsx("span", { className: "icon-arrow-right-3" })
498
+ }
499
+ )
500
+ ] })
501
+ ] })
502
+ }
503
+ ),
504
+ expandedId === info._id && /* @__PURE__ */ jsx(Grid, { container: true, xs: 12, spacing: 5, children: /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, sx: { transform: "translateX(3.9%)" }, children: !(expandedDetails == null ? void 0 : expandedDetails.length) ? /* @__PURE__ */ jsx(Box, { sx: { height: "200px", display: "flex", justifyContent: "center", alignItems: "center" }, children: /* @__PURE__ */ jsx(CircularProgress, { size: 40, sx: { color: theme.palette.primary.dark } }) }) : /* @__PURE__ */ jsx(Box, { sx: { pl: 2 }, children: expandedDetails == null ? void 0 : expandedDetails.map((item, idx) => {
505
+ var _a2;
506
+ return /* @__PURE__ */ jsxs(Box, { sx: { mb: 2 }, children: [
507
+ /* @__PURE__ */ jsx(Typography, { variant: "caption", sx: { mr: 2 }, children: moment(item == null ? void 0 : item.created_at).format("DD-MM-YYYY HH:mm") }),
508
+ /* @__PURE__ */ jsxs(Typography, { variant: "body2", component: "span", children: [
509
+ item == null ? void 0 : item.type,
510
+ " - ",
511
+ ((_a2 = item == null ? void 0 : item.comment_reasons) == null ? void 0 : _a2.comment) || "No Comments"
512
+ ] })
513
+ ] }, idx);
514
+ }) }) }) })
515
+ ] }, index);
516
+ }) }),
517
+ selectedApprovalOtions === "Action Required" && /* @__PURE__ */ jsx(Box, { className: "fixedModal", sx: { overflowY: "auto", height: "calc(100vh - 180px)" }, children: pendingRequestArray && pendingRequestArray.map((info, index) => {
518
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B;
519
+ const currentLevel = (_a = info == null ? void 0 : info.levels) == null ? void 0 : _a.find((level_) => level_.id === (info == null ? void 0 : info.current_level));
520
+ currentLevel ? currentLevel.status_list : [];
521
+ const redir = buildRedirectionUrl(info);
522
+ return /* @__PURE__ */ jsxs(React2.Fragment, { children: [
523
+ /* @__PURE__ */ jsx(
524
+ Card,
525
+ {
526
+ sx: {
527
+ mb: 8,
528
+ "&.MuiCard-root.MuiPaper-elevation": {
529
+ boxShadow: "2px 2px 10px 0px #4C4E6426",
530
+ padding: "20px",
531
+ borderRadius: "10px"
532
+ }
533
+ },
534
+ children: /* @__PURE__ */ jsxs(CardContent, { sx: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
535
+ /* @__PURE__ */ jsxs(Box, { children: [
536
+ /* @__PURE__ */ jsx(Tooltip, { title: info.title, children: /* @__PURE__ */ jsx(TruncatedTypography, { variant: "h6", color: "text.primary", sx: { textTransform: "capitalize", lineHeight: "22px" }, children: info.activity_name }) }),
537
+ /* @__PURE__ */ jsx(Tooltip, { title: info.description_data, children: /* @__PURE__ */ jsx(
538
+ TruncatedTypography,
539
+ {
540
+ variant: "body2",
541
+ color: "customColors.mainText",
542
+ sx: { mt: "13px", textTransform: "capitalize", lineHeight: "15.4px" },
543
+ children: info.description_data
544
+ }
545
+ ) })
546
+ ] }),
547
+ /* @__PURE__ */ jsxs(Box, { children: [
548
+ /* @__PURE__ */ jsx(Tooltip, { title: "Links", children: /* @__PURE__ */ jsx(
549
+ TruncatedTypography,
550
+ {
551
+ variant: "caption",
552
+ color: "customColors.text3",
553
+ sx: { textTransform: "capitalize", lineHeight: "13.2px" },
554
+ children: "Links"
555
+ }
556
+ ) }),
557
+ /* @__PURE__ */ jsx(Tooltip, { title: redir, children: /* @__PURE__ */ jsx("a", { href: redir, style: { cursor: "pointer", textDecoration: "none" }, target: "_blank", rel: "noreferrer", children: /* @__PURE__ */ jsx(
558
+ TruncatedTypography,
559
+ {
560
+ variant: "subtitle2",
561
+ color: "primary.dark",
562
+ sx: { mt: "13px", lineHeight: "15.4px" },
563
+ children: redir
564
+ }
565
+ ) }) })
566
+ ] }),
567
+ /* @__PURE__ */ jsxs(Box, { sx: { mt: 2, display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
568
+ /* @__PURE__ */ jsx(
569
+ Chip,
570
+ {
571
+ variant: "filled",
572
+ sx: {
573
+ backgroundColor: `${(_h = getStatus(
574
+ ((_d = (_c = (_b = info == null ? void 0 : info.levels) == null ? void 0 : _b.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _c.selected_status) == null ? void 0 : _d.status_id) === 1 ? "approved" : ((_g = (_f = (_e = info == null ? void 0 : info.levels) == null ? void 0 : _e.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _f.selected_status) == null ? void 0 : _g.status_id) === 3 ? "rejected" : "pending"
575
+ )) == null ? void 0 : _h.color} !important`,
576
+ color: `${(_o = getStatus(
577
+ ((_k = (_j = (_i = info == null ? void 0 : info.levels) == null ? void 0 : _i.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _j.selected_status) == null ? void 0 : _k.status_id) === 1 ? "approved" : ((_n = (_m = (_l = info == null ? void 0 : info.levels) == null ? void 0 : _l.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _m.selected_status) == null ? void 0 : _n.status_id) === 3 ? "rejected" : "pending"
578
+ )) == null ? void 0 : _o.labelColor} !important`,
579
+ height: "40px",
580
+ padding: "8px",
581
+ borderRadius: "100px !important",
582
+ border: "0px !important",
583
+ "& .MuiChip-label": {
584
+ fontSize: "14px",
585
+ lineHeight: "15.4px",
586
+ fontWeight: "500",
587
+ textTransform: "capitalize"
588
+ }
589
+ },
590
+ label: `${((_r = (_q = (_p = info == null ? void 0 : info.levels) == null ? void 0 : _p.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _q.selected_status) == null ? void 0 : _r.status_id) === 2 || (info == null ? void 0 : info.isLevelZero) || !((_t = (_s = info == null ? void 0 : info.levels) == null ? void 0 : _s.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _t.selected_status) ? "pending" : (_w = (_v = (_u = info == null ? void 0 : info.levels) == null ? void 0 : _u.find((lvl) => lvl.id === (info == null ? void 0 : info.current_level))) == null ? void 0 : _v.selected_status) == null ? void 0 : _w.name}`
591
+ }
592
+ ),
593
+ /* @__PURE__ */ jsx(Divider, { orientation: "vertical", sx: { ml: 5, borderColor: (_y = (_x = theme.palette) == null ? void 0 : _x.customColors) == null ? void 0 : _y.text4, height: "50px" } }),
594
+ /* @__PURE__ */ jsx(
595
+ IconButton,
596
+ {
597
+ disableFocusRipple: true,
598
+ disableRipple: true,
599
+ color: "primary",
600
+ sx: {
601
+ ml: 5,
602
+ background: (_B = (_A = (_z = theme.palette) == null ? void 0 : _z.customColors) == null ? void 0 : _A.primaryLightest) != null ? _B : "rgba(25,118,210,0.08)",
603
+ boxShadow: "2px 2px 10px 0px #4C4E6426",
604
+ "& span": { color: theme.palette.primary.dark }
605
+ },
606
+ onClick: () => handleExpandClick(info._id),
607
+ children: expandedId === info._id ? /* @__PURE__ */ jsx("span", { className: "icon-arrow-down-1" }) : /* @__PURE__ */ jsx("span", { className: "icon-arrow-right-3" })
608
+ }
609
+ )
610
+ ] })
611
+ ] })
612
+ }
613
+ ),
614
+ expandedId === info._id && /* @__PURE__ */ jsx(Grid, { container: true, xs: 12, spacing: 5, children: /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, sx: { transform: "translateX(3.9%)" }, children: !(expandedDetails == null ? void 0 : expandedDetails.length) ? /* @__PURE__ */ jsx(Box, { sx: { height: "200px", display: "flex", justifyContent: "center", alignItems: "center" }, children: /* @__PURE__ */ jsx(CircularProgress, { size: 40, sx: { color: theme.palette.primary.dark } }) }) : /* @__PURE__ */ jsx(Box, { sx: { pl: 2 }, children: expandedDetails == null ? void 0 : expandedDetails.map((item, idx) => {
615
+ var _a2;
616
+ return /* @__PURE__ */ jsxs(Box, { sx: { mb: 2 }, children: [
617
+ /* @__PURE__ */ jsx(Typography, { variant: "caption", sx: { mr: 2 }, children: moment(item == null ? void 0 : item.created_at).format("DD-MM-YYYY HH:mm") }),
618
+ /* @__PURE__ */ jsxs(Typography, { variant: "body2", component: "span", children: [
619
+ item == null ? void 0 : item.type,
620
+ " - ",
621
+ ((_a2 = item == null ? void 0 : item.comment_reasons) == null ? void 0 : _a2.comment) || "No Comments"
622
+ ] })
623
+ ] }, idx);
624
+ }) }) }) })
625
+ ] }, index);
626
+ }) })
627
+ ] }) }) });
628
+ }
629
+ function DialogOpener({
630
+ openDialog,
631
+ handleClose,
632
+ userInfoData,
633
+ selectedWorkflowsList = []
634
+ }) {
635
+ const theme = useTheme();
636
+ useMediaQuery(theme.breakpoints.down("lg"));
637
+ const [screenWidth, setScreenWidth] = useState(typeof window !== "undefined" ? window.innerWidth : 0);
638
+ useEffect(() => {
639
+ const updateScreenWidth = () => setScreenWidth(window.innerWidth);
640
+ window.addEventListener("resize", updateScreenWidth);
641
+ return () => window.removeEventListener("resize", updateScreenWidth);
642
+ }, []);
643
+ return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(
644
+ Dialog,
645
+ {
646
+ fullScreen: true,
647
+ open: openDialog,
648
+ onClose: () => handleClose && handleClose(),
649
+ "aria-labelledby": "responsive-dialog-title",
650
+ sx: { zIndex: 123 },
651
+ children: [
652
+ /* @__PURE__ */ jsxs(DialogContent, { children: [
653
+ /* @__PURE__ */ jsx(IconButton, { onClick: handleClose, disableFocusRipple: true, disableRipple: true, sx: { float: "right" }, children: /* @__PURE__ */ jsx(HighlightOffIcon, { style: { color: "#666666" } }) }),
654
+ /* @__PURE__ */ jsx(ApprovalWorkflow, { userInfo: userInfoData, selectedWorkflowsList })
655
+ ] }),
656
+ /* @__PURE__ */ jsx(DialogActions, { children: /* @__PURE__ */ jsx(
657
+ Button2,
658
+ {
659
+ variant: "contained",
660
+ color: "primary",
661
+ sx: { display: "flex", justifyContent: "flex-end", alignItems: "center" },
662
+ onClick: handleClose,
663
+ children: "Close"
664
+ }
665
+ ) })
666
+ ]
667
+ }
668
+ ) });
669
+ }
670
+ function DialogOpener2(props) {
671
+ const { api, urlBuilder, loadingComponent, userInfoData, ...rest } = props;
672
+ return /* @__PURE__ */ jsx(WorkflowProvider, { value: { api, urlBuilder, userInfo: userInfoData, loadingComponent }, children: /* @__PURE__ */ jsx(DialogOpener, { ...rest, userInfoData }) });
673
+ }
674
+ function ApprovalWorkflow2(props) {
675
+ const { api, urlBuilder, loadingComponent, userInfo, ...rest } = props;
676
+ return /* @__PURE__ */ jsx(WorkflowProvider, { value: { api, urlBuilder, userInfo, loadingComponent }, children: /* @__PURE__ */ jsx(ApprovalWorkflow, { userInfo, ...rest }) });
677
+ }
678
+
679
+ export { ApprovalWorkflow2 as ApprovalWorkflow, DialogOpener2 as DialogOpener };
680
+ //# sourceMappingURL=index.mjs.map
681
+ //# sourceMappingURL=index.mjs.map