@paro.io/expert-shared-components 1.14.42 → 1.14.44

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 (2) hide show
  1. package/lib/components/DocumentCenter/MultiFileUploadSection.js +236 -170
  2. package/package.json +1 -1
package/lib/components/DocumentCenter/MultiFileUploadSection.js CHANGED
@@ -38,6 +38,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
38
38
  exports.MultiFileUploadSection = void 0;
39
39
  const react_1 = __importStar(require("react"));
40
40
  const core_1 = require("@material-ui/core");
41
+ const CheckCircle_1 = __importDefault(require("@material-ui/icons/CheckCircle"));
41
42
  const ExpandMore_1 = __importDefault(require("@material-ui/icons/ExpandMore"));
42
43
  const ExpandLess_1 = __importDefault(require("@material-ui/icons/ExpandLess"));
43
44
  const date_fns_1 = require("date-fns");
@@ -70,15 +71,13 @@ const generateOptions = (array, clientOptions, isClientPortal) => {
70
71
  ? `${item === null || item === void 0 ? void 0 : item.id}_${index}`
71
72
  : item === null || item === void 0 ? void 0 : item.split(" ").join("_").concat(index);
72
73
  if (clientOptions) {
73
- if (name && projectName) {
74
- newText = `${name} - ${projectName}`;
74
+ // Show only project name for project dropdown
75
+ if (projectName) {
76
+ newText = projectName;
75
77
  }
76
78
  else if (name) {
77
79
  newText = name;
78
80
  }
79
- else if (projectName) {
80
- newText = projectName;
81
- }
82
81
  else {
83
82
  newText = "N/A";
84
83
  }
@@ -94,7 +93,6 @@ const generateOptions = (array, clientOptions, isClientPortal) => {
94
93
  });
95
94
  };
96
95
  const MultiFileUploadSection = ({ paroDocuments, clientAndProjectsList, uploadExpertClientFiles, uploadInternalFile, foldername, refetchFiles, legacyFreelancerId, freelancerName, freelancerEmail, isClientPortal = false, documentUploadUrl, showAsPage, }) => {
97
- var _a;
98
96
  const [uploadItems, setUploadItems] = (0, react_1.useState)([]);
99
97
  const [isUploading, setIsUploading] = (0, react_1.useState)(false);
100
98
  const [showUploadSection, setShowUploadSection] = (0, react_1.useState)(true);
@@ -122,7 +120,9 @@ const MultiFileUploadSection = ({ paroDocuments, clientAndProjectsList, uploadEx
122
120
  const excludedStatuses = ["complete", "completed", "doa", "churned"];
123
121
  const isValidProject = projectStatus &&
124
122
  !excludedStatuses.includes(projectStatus.toLowerCase());
125
- if (id && name) {
123
+ // Filter out "System Fee" expert on client side
124
+ const isSystemFee = isClientPortal && (name === null || name === void 0 ? void 0 : name.toLowerCase()) === "system fee";
125
+ if (id && name && !isSystemFee) {
126
126
  if (!groups.has(id)) {
127
127
  groups.set(id, {
128
128
  expert: { id, name },
@@ -188,12 +188,42 @@ const MultiFileUploadSection = ({ paroDocuments, clientAndProjectsList, uploadEx
188
188
  }, [selectedExpert, clientOptions, isClientPortal]);
189
189
  const hasMultipleProjects = selectedExpertProjects.length > 1;
190
190
  const hasSingleProject = selectedExpertProjects.length === 1;
191
+ // Filtered project options for the selected expert/client
192
+ const filteredProjectOptions = react_1.default.useMemo(() => {
193
+ if (!selectedExpert)
194
+ return [];
195
+ return clientOptions.filter((opt) => {
196
+ var _a, _b, _c, _d;
197
+ const isMatch = isClientPortal
198
+ ? ((_a = opt.freelancer) === null || _a === void 0 ? void 0 : _a.id) === selectedExpert.id
199
+ : ((_b = opt.client) === null || _b === void 0 ? void 0 : _b.id) === selectedExpert.id;
200
+ const projectStatus = opt.status || opt.projectStatus;
201
+ const excludedStatuses = ["complete", "completed", "doa", "churned"];
202
+ const isValidProject = projectStatus &&
203
+ !excludedStatuses.includes(projectStatus.toLowerCase());
204
+ // Filter out System Fee projects on client side
205
+ const expertName = isClientPortal
206
+ ? (_c = opt.freelancer) === null || _c === void 0 ? void 0 : _c.name
207
+ : (_d = opt.client) === null || _d === void 0 ? void 0 : _d.name;
208
+ const isSystemFee = isClientPortal && (expertName === null || expertName === void 0 ? void 0 : expertName.toLowerCase()) === "system fee";
209
+ return isMatch && isValidProject && !isSystemFee;
210
+ });
211
+ }, [selectedExpert, clientOptions, isClientPortal]);
191
212
  // Check if all files have projects assigned (for multi-project experts/clients)
192
213
  const allFilesHaveProjects = react_1.default.useMemo(() => {
193
214
  if (!hasMultipleProjects)
194
215
  return true;
195
216
  return uploadItems.every((item) => { var _a; return (_a = item.clientAndProject) === null || _a === void 0 ? void 0 : _a.value; });
196
217
  }, [uploadItems, hasMultipleProjects]);
218
+ // Count files that need projects
219
+ const filesNeedingProjects = react_1.default.useMemo(() => {
220
+ if (!selectedExpert)
221
+ return 0;
222
+ return uploadItems.filter((item) => { var _a; return !((_a = item.clientAndProject) === null || _a === void 0 ? void 0 : _a.value) && item.status !== "success"; }).length;
223
+ }, [uploadItems, selectedExpert]);
224
+ // Determine step states
225
+ const step1Complete = selectedExpert !== null;
226
+ const step2Complete = step1Complete && uploadItems.length > 0 && allFilesHaveProjects;
197
227
  const handleFilesSelected = (files) => {
198
228
  const newItems = files.map((file) => ({
199
229
  id: `${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
@@ -395,78 +425,198 @@ const MultiFileUploadSection = ({ paroDocuments, clientAndProjectsList, uploadEx
395
425
  ".jpg",
396
426
  ".png",
397
427
  ], disabled: isUploading })),
398
- uploadItems.length > 0 &&
399
- !paroDocuments &&
400
- expertGroups.length > 0 && (react_1.default.createElement(core_1.Box, { mb: 3, p: 2, style: { backgroundColor: "#F7FAFC", borderRadius: "8px" } },
401
- react_1.default.createElement(core_1.Box, { display: "flex", alignItems: "center", mb: 2 },
428
+ uploadItems.length > 0 && (react_1.default.createElement(core_1.Box, { mb: 3 },
429
+ react_1.default.createElement(core_1.Typography, { variant: "h5", style: {
430
+ fontWeight: 700,
431
+ color: "#1a1a2e",
432
+ marginBottom: "4px",
433
+ } }, !paroDocuments
434
+ ? isClientPortal
435
+ ? "Send Files to Expert"
436
+ : "Send Files to Client"
437
+ : "Upload Documents"),
438
+ react_1.default.createElement(core_1.Typography, { variant: "body2", style: { color: "#8b8fa3" } }, "Choose a recipient, assign each file to a project, then upload."))),
439
+ !paroDocuments &&
440
+ expertGroups.length > 0 &&
441
+ uploadItems.length > 0 && (react_1.default.createElement(core_1.Paper, { elevation: 0, style: {
442
+ marginBottom: "24px",
443
+ borderRadius: "12px",
444
+ border: step1Complete
445
+ ? "2px solid #248384"
446
+ : "2px solid #a8a8a8",
447
+ backgroundColor: step1Complete ? "#FDFEFD" : "#fafafa",
448
+ overflow: "hidden",
449
+ } },
450
+ react_1.default.createElement(core_1.Box, { p: 2, style: {
451
+ backgroundColor: step1Complete ? "#F0FAF0" : "#f7f7f9",
452
+ borderBottom: "1px solid #f0f0f5",
453
+ display: "flex",
454
+ alignItems: "center",
455
+ gap: "12px",
456
+ } },
402
457
  react_1.default.createElement(core_1.Box, { style: {
403
- width: "32px",
404
- height: "32px",
458
+ width: "24px",
459
+ height: "24px",
405
460
  borderRadius: "50%",
406
- backgroundColor: "#48BB78",
407
- color: "white",
461
+ backgroundColor: step1Complete ? "white" : "gray",
462
+ color: step1Complete ? "#248384" : "white",
408
463
  display: "flex",
409
464
  alignItems: "center",
410
465
  justifyContent: "center",
411
- fontWeight: "bold",
412
- marginRight: "12px",
413
- } }, "1"),
414
- react_1.default.createElement(core_1.Typography, { variant: "subtitle1", style: { fontWeight: 600 } }, isClientPortal
415
- ? "SEND TO EXPERT — select who these files are for"
416
- : "SEND TO CLIENT — select which client these files are for")),
417
- react_1.default.createElement(core_1.Box, { display: "flex", flexWrap: "wrap", style: { gap: "8px" } }, expertGroups.map((group) => (react_1.default.createElement(core_1.Chip, { key: group.expert.id, label: react_1.default.createElement(core_1.Box, null,
418
- react_1.default.createElement("strong", null, group.expert.name),
419
- react_1.default.createElement(core_1.Box, { component: "span", ml: 1, style: { color: "#718096" } },
420
- group.projects.length,
421
- " ",
422
- group.projects.length === 1
423
- ? "project"
424
- : "projects")), onClick: () => handleExpertSelection(group.expert), clickable: true, disabled: group.projects.length === 0, color: "default", style: {
425
- padding: "8px 12px",
426
- height: "auto",
427
- borderRadius: "20px",
428
- border: (selectedExpert === null || selectedExpert === void 0 ? void 0 : selectedExpert.id) === group.expert.id
429
- ? "2px solid #3182CE"
430
- : "1px solid #CBD5E0",
431
- backgroundColor: (selectedExpert === null || selectedExpert === void 0 ? void 0 : selectedExpert.id) === group.expert.id
432
- ? "#EBF8FF"
433
- : "white",
434
- opacity: group.projects.length === 0 ? 0.5 : 1,
435
- cursor: group.projects.length === 0
436
- ? "not-allowed"
437
- : "pointer",
438
- } })))),
439
- selectedExpert && hasSingleProject && (react_1.default.createElement(core_1.Box, { mt: 2 },
440
- react_1.default.createElement(core_1.Chip, { label: "AUTO-ASSIGNED", size: "small", style: {
441
- backgroundColor: "#C6F6D5",
442
- color: "#22543D",
443
- fontWeight: 600,
444
- } }),
445
- react_1.default.createElement(core_1.Typography, { variant: "caption", style: { marginLeft: "8px", color: "#718096" } },
446
- ((_a = selectedExpertProjects[0]) === null || _a === void 0 ? void 0 : _a.name) || "Project",
447
- " \u2014 only project with ",
448
- selectedExpert.name))),
449
- selectedExpert && hasMultipleProjects && (react_1.default.createElement(core_1.Box, { mt: 2 },
450
- react_1.default.createElement(core_1.Chip, { label: `${selectedExpertProjects.length} PROJECTS`, size: "small", style: {
451
- backgroundColor: "#FEF5E7",
452
- color: "#D97706",
466
+ fontSize: "13px",
467
+ fontWeight: 700,
468
+ flexShrink: 0,
469
+ } }, step1Complete ? (react_1.default.createElement(CheckCircle_1.default, { style: { fontSize: "28px" } })) : ("1")),
470
+ react_1.default.createElement(core_1.Box, null,
471
+ react_1.default.createElement(core_1.Typography, { variant: "subtitle1", style: {
472
+ fontSize: "14px",
473
+ fontWeight: 600,
474
+ color: "#1a1a2e",
475
+ } }, "Select recipient"),
476
+ react_1.default.createElement(core_1.Typography, { variant: "caption", style: { fontSize: "12px", color: "#8b8fa3" } }, "Who should receive these files?"))),
477
+ react_1.default.createElement(core_1.Box, { p: 2 },
478
+ react_1.default.createElement(core_1.Box, { display: "flex", flexWrap: "wrap", style: { gap: "10px" } }, expertGroups.map((group) => (react_1.default.createElement(core_1.Chip, { key: group.expert.id, label: react_1.default.createElement(core_1.Box, { display: "flex", alignItems: "center", style: { gap: "6px" } },
479
+ (selectedExpert === null || selectedExpert === void 0 ? void 0 : selectedExpert.id) === group.expert.id && (react_1.default.createElement(CheckCircle_1.default, { style: { fontSize: "20px" } })),
480
+ react_1.default.createElement("span", { style: { fontWeight: 600 } }, group.expert.name),
481
+ react_1.default.createElement("span", { style: {
482
+ fontSize: "11px",
483
+ fontWeight: 500,
484
+ padding: "2px 7px",
485
+ borderRadius: "10px",
486
+ backgroundColor: (selectedExpert === null || selectedExpert === void 0 ? void 0 : selectedExpert.id) === group.expert.id
487
+ ? "#e2e8f0"
488
+ : "#f0f1f4",
489
+ color: (selectedExpert === null || selectedExpert === void 0 ? void 0 : selectedExpert.id) === group.expert.id
490
+ ? "#248384"
491
+ : "#8b8fa3",
492
+ } },
493
+ group.projects.length,
494
+ " ",
495
+ group.projects.length === 1
496
+ ? "project"
497
+ : "projects")), onClick: () => handleExpertSelection(group.expert), clickable: true, disabled: group.projects.length === 0, style: {
498
+ padding: "10px 18px",
499
+ height: "auto",
500
+ borderRadius: "8px",
501
+ border: (selectedExpert === null || selectedExpert === void 0 ? void 0 : selectedExpert.id) === group.expert.id
502
+ ? "2px solid #248384"
503
+ : "2px solid #e2e4ea",
504
+ backgroundColor: "#fff",
505
+ color: (selectedExpert === null || selectedExpert === void 0 ? void 0 : selectedExpert.id) === group.expert.id
506
+ ? "#248384"
507
+ : "#3d3f4a",
508
+ opacity: group.projects.length === 0 ? 0.5 : 1,
509
+ cursor: group.projects.length === 0
510
+ ? "not-allowed"
511
+ : "pointer",
512
+ } }))))))),
513
+ uploadItems.length > 0 && (react_1.default.createElement(core_1.Paper, { elevation: 0, style: {
514
+ marginBottom: "24px",
515
+ borderRadius: "12px",
516
+ border: step2Complete
517
+ ? "2px solid #248384"
518
+ : !paroDocuments && !step1Complete
519
+ ? "2px solid #e2e4ea"
520
+ : "2px solid #006cff",
521
+ backgroundColor: step2Complete
522
+ ? "#FDFEFD"
523
+ : !paroDocuments && !step1Complete
524
+ ? "#fafafa"
525
+ : "#ffffff",
526
+ overflow: "hidden",
527
+ opacity: !paroDocuments && !step1Complete ? 0.5 : 1,
528
+ pointerEvents: !paroDocuments && !step1Complete ? "none" : "auto",
529
+ } },
530
+ react_1.default.createElement(core_1.Box, { p: 2, style: {
531
+ backgroundColor: step2Complete
532
+ ? "#F0FAF0"
533
+ : !paroDocuments && !step1Complete
534
+ ? "#f7f7f9"
535
+ : "#f2f2f25e",
536
+ borderBottom: "1px solid #f0f0f5",
537
+ display: "flex",
538
+ alignItems: "center",
539
+ gap: "12px",
540
+ } },
541
+ react_1.default.createElement(core_1.Box, { style: {
542
+ width: "24px",
543
+ height: "24px",
544
+ borderRadius: "50%",
545
+ backgroundColor: step2Complete
546
+ ? "white"
547
+ : !paroDocuments && !step1Complete
548
+ ? "#ccc"
549
+ : "#006cff",
550
+ color: step2Complete ? "#248384" : "white",
551
+ display: "flex",
552
+ alignItems: "center",
553
+ justifyContent: "center",
554
+ fontSize: "13px",
555
+ fontWeight: 700,
556
+ flexShrink: 0,
557
+ } }, step2Complete ? (react_1.default.createElement(CheckCircle_1.default, { style: { fontSize: "28px" } })) : paroDocuments ? ("1") : ("2")),
558
+ react_1.default.createElement(core_1.Box, { flex: 1 },
559
+ react_1.default.createElement(core_1.Typography, { variant: "subtitle1", style: {
560
+ fontSize: "14px",
561
+ fontWeight: 600,
562
+ color: "#1a1a2e",
563
+ } }, "Assign files to projects"),
564
+ react_1.default.createElement(core_1.Typography, { variant: "caption", style: { fontSize: "12px", color: "#8b8fa3" } }, "Categorize each file and select its project")),
565
+ !paroDocuments && filesNeedingProjects > 0 && (react_1.default.createElement(core_1.Chip, { label: `${filesNeedingProjects} need${filesNeedingProjects === 1 ? "s" : ""} a project`, size: "small", style: {
566
+ fontSize: "11px",
453
567
  fontWeight: 600,
454
- }, icon: react_1.default.createElement(base_icons_1.IconExclamation, { stroke: "#D97706" }) }),
455
- react_1.default.createElement(core_1.Typography, { variant: "caption", style: { marginLeft: "8px", color: "#718096" } }, "Select which project each file is for below"))))),
456
- uploadItems.length > 0 && (react_1.default.createElement(core_1.Box, null,
457
- react_1.default.createElement(core_1.Box, null,
568
+ padding: "4px 10px",
569
+ backgroundColor: "#FFF3E0",
570
+ color: "#E65100",
571
+ } }))),
572
+ react_1.default.createElement(core_1.Box, { p: 2 },
458
573
  react_1.default.createElement(core_1.Grid, { container: true, spacing: 2 }, uploadItems.map((item, index) => {
459
- var _a;
574
+ var _a, _b, _c;
575
+ const needsProject = !paroDocuments && !((_a = item.clientAndProject) === null || _a === void 0 ? void 0 : _a.value);
460
576
  return (react_1.default.createElement(core_1.Grid, { item: true, xs: 12, key: item.id },
461
577
  react_1.default.createElement(core_1.Paper, { elevation: 1, style: {
462
578
  padding: "12px 16px",
463
- backgroundColor: "white",
464
- border: "1px solid #E2E8F0",
465
- borderRadius: "4px",
579
+ backgroundColor: needsProject ? "#FFFBF5" : "white",
580
+ border: needsProject
581
+ ? "2px solid #FFE0B2"
582
+ : "1.5px solid #f0f1f4",
583
+ borderRadius: "10px",
466
584
  } },
467
585
  react_1.default.createElement(core_1.Grid, { container: true, spacing: 2 },
468
- react_1.default.createElement(core_1.Grid, { item: true, xs: 12, sm: "auto", style: { display: "flex", alignItems: "center" } },
469
- react_1.default.createElement(base_icons_1.IconDocument, { size: "lg" })),
586
+ react_1.default.createElement(core_1.Grid, { item: true, xs: 12, sm: "auto", style: {
587
+ display: "flex",
588
+ alignItems: "center",
589
+ } },
590
+ react_1.default.createElement(core_1.Box, { style: {
591
+ width: "36px",
592
+ height: "42px",
593
+ borderRadius: "4px",
594
+ display: "flex",
595
+ alignItems: "flex-end",
596
+ justifyContent: "center",
597
+ paddingBottom: "4px",
598
+ fontSize: "10px",
599
+ fontWeight: 700,
600
+ letterSpacing: "0.5px",
601
+ textTransform: "uppercase",
602
+ backgroundColor: item.file.name.endsWith(".csv")
603
+ ? "#E8F5E9"
604
+ : item.file.name.endsWith(".pdf")
605
+ ? "#FFF3E0"
606
+ : "#E3F2FD",
607
+ border: item.file.name.endsWith(".csv")
608
+ ? "1.5px solid #A5D6A7"
609
+ : item.file.name.endsWith(".pdf")
610
+ ? "1.5px solid #FFCC80"
611
+ : "1.5px solid #90CAF9",
612
+ color: item.file.name.endsWith(".csv")
613
+ ? "#248384"
614
+ : item.file.name.endsWith(".pdf")
615
+ ? "#E65100"
616
+ : "#1976D2",
617
+ } }, ((_b = item.file.name
618
+ .split(".")
619
+ .pop()) === null || _b === void 0 ? void 0 : _b.toUpperCase()) || "FILE")),
470
620
  react_1.default.createElement(core_1.Grid, { item: true, xs: 12, sm: true },
471
621
  react_1.default.createElement(base_ui_1.Input, { type: "text", value: item.documentName, onChange: (e) => updateItem(item.id, {
472
622
  documentName: e.target.value,
@@ -495,7 +645,8 @@ const MultiFileUploadSection = ({ paroDocuments, clientAndProjectsList, uploadEx
495
645
  }
496
646
  }, options: documentTypeOptions, disabled: item.status === "uploading" ||
497
647
  item.status === "success", required: false })),
498
- paroDocuments && item.docType === "EO Insurance" && (react_1.default.createElement(core_1.Grid, { item: true, xs: 12, sm: 3, style: { marginTop: "5px" } },
648
+ paroDocuments &&
649
+ item.docType === "EO Insurance" && (react_1.default.createElement(core_1.Grid, { item: true, xs: 12, sm: 3, style: { marginTop: "5px" } },
499
650
  react_1.default.createElement(core_1.TextField, { type: "date", label: "Expiration Date", value: item.expiryDate
500
651
  ? new Date(item.expiryDate)
501
652
  .toISOString()
@@ -530,7 +681,7 @@ const MultiFileUploadSection = ({ paroDocuments, clientAndProjectsList, uploadEx
530
681
  }, disabled: item.status === "uploading" ||
531
682
  item.status === "success", fullWidth: true, variant: "outlined", size: "small", required: true, error: !!item.dateError, helperText: item.dateError }))),
532
683
  !paroDocuments && !hasSingleProject && (react_1.default.createElement(core_1.Grid, { item: true, xs: 12, sm: 3 },
533
- react_1.default.createElement(base_ui_1.Select, { value: ((_a = item.clientAndProject) === null || _a === void 0 ? void 0 : _a.value) || "", onChange: (e) => {
684
+ react_1.default.createElement(base_ui_1.Select, { value: ((_c = item.clientAndProject) === null || _c === void 0 ? void 0 : _c.value) || "", onChange: (e) => {
534
685
  // Handle empty selection
535
686
  if (e.target.value === "") {
536
687
  updateItem(item.id, {
@@ -538,27 +689,7 @@ const MultiFileUploadSection = ({ paroDocuments, clientAndProjectsList, uploadEx
538
689
  });
539
690
  return;
540
691
  }
541
- const filteredOptions = selectedExpert
542
- ? clientOptions.filter((opt) => {
543
- var _a, _b;
544
- const isMatch = isClientPortal
545
- ? ((_a = opt.freelancer) === null || _a === void 0 ? void 0 : _a.id) ===
546
- selectedExpert.id
547
- : ((_b = opt.client) === null || _b === void 0 ? void 0 : _b.id) ===
548
- selectedExpert.id;
549
- const projectStatus = opt.status || opt.projectStatus;
550
- const excludedStatuses = [
551
- "complete",
552
- "completed",
553
- "doa",
554
- "churned",
555
- ];
556
- const isValidProject = projectStatus &&
557
- !excludedStatuses.includes(projectStatus.toLowerCase());
558
- return isMatch && isValidProject;
559
- })
560
- : clientOptions;
561
- const selected = filteredOptions.find((opt) => opt.value === e.target.value);
692
+ const selected = filteredProjectOptions.find((opt) => opt.value === e.target.value);
562
693
  updateItem(item.id, {
563
694
  clientAndProject: selected,
564
695
  });
@@ -566,38 +697,9 @@ const MultiFileUploadSection = ({ paroDocuments, clientAndProjectsList, uploadEx
566
697
  {
567
698
  id: "placeholder",
568
699
  value: "",
569
- label: "Which project?",
700
+ label: "Select project",
570
701
  },
571
- ...(selectedExpert
572
- ? clientOptions.filter((opt) => {
573
- var _a, _b;
574
- const isMatch = isClientPortal
575
- ? ((_a = opt.freelancer) === null || _a === void 0 ? void 0 : _a.id) ===
576
- selectedExpert.id
577
- : ((_b = opt.client) === null || _b === void 0 ? void 0 : _b.id) ===
578
- selectedExpert.id;
579
- const projectStatus = opt.status || opt.projectStatus;
580
- const excludedStatuses = [
581
- "complete",
582
- "completed",
583
- "doa",
584
- "churned",
585
- ];
586
- const isValidProject = projectStatus &&
587
- !excludedStatuses.includes(projectStatus.toLowerCase());
588
- return isMatch && isValidProject;
589
- })
590
- : clientOptions.filter((opt) => {
591
- const projectStatus = opt.status || opt.projectStatus;
592
- const excludedStatuses = [
593
- "complete",
594
- "completed",
595
- "doa",
596
- "churned",
597
- ];
598
- return (projectStatus &&
599
- !excludedStatuses.includes(projectStatus.toLowerCase()));
600
- })),
702
+ ...filteredProjectOptions,
601
703
  ], disabled: item.status === "uploading" ||
602
704
  item.status === "success" ||
603
705
  !selectedExpert, required: false }))),
@@ -618,55 +720,19 @@ const MultiFileUploadSection = ({ paroDocuments, clientAndProjectsList, uploadEx
618
720
  react_1.default.createElement(core_1.Typography, { variant: "caption", style: { color: "#38A169" } }, "\u2713 Upload successful"))),
619
721
  item.status === "error" && (react_1.default.createElement(core_1.Box, { mt: 1, ml: { xs: 0, sm: 6 } },
620
722
  react_1.default.createElement(core_1.Typography, { variant: "caption", style: { color: "#E53E3E" } }, "\u2717 Upload failed"))))));
621
- }))),
622
- react_1.default.createElement(core_1.Divider, { style: { marginTop: "24px" } }),
623
- react_1.default.createElement(core_1.Box, { display: "flex", justifyContent: "space-between", alignItems: "center", mb: 2, mt: 2 },
624
- react_1.default.createElement(core_1.Box, null,
625
- react_1.default.createElement(core_1.Typography, { variant: "body2", style: { color: "#718096" } }, paroDocuments ? (react_1.default.createElement(react_1.default.Fragment, null,
626
- react_1.default.createElement("span", { style: { fontWeight: "bold" } }, uploadItems.filter((i) => i.status !== "success")
627
- .length),
628
- " ",
629
- uploadItems.filter((i) => i.status !== "success")
630
- .length === 1
631
- ? "file"
632
- : "files")) : (react_1.default.createElement(react_1.default.Fragment, null,
633
- react_1.default.createElement("span", { style: { fontWeight: "bold" } }, uploadItems.filter((i) => i.status !== "success")
634
- .length),
635
- " ",
636
- "files \u2022",
637
- " ",
638
- react_1.default.createElement("span", { style: { color: "#718096" } },
639
- react_1.default.createElement("span", { style: { fontWeight: "bold" } }, uploadItems.filter((i) => {
640
- var _a;
641
- return ((_a = i.clientAndProject) === null || _a === void 0 ? void 0 : _a.value) &&
642
- i.status !== "success";
643
- }).length),
644
- " ",
645
- "project-assigned"),
646
- " ",
647
- "\u2022",
648
- " ",
649
- react_1.default.createElement("span", { style: { color: "#D97706" } },
650
- react_1.default.createElement("span", { style: { fontWeight: "bold" } }, uploadItems.filter((i) => {
651
- var _a;
652
- return !((_a = i.clientAndProject) === null || _a === void 0 ? void 0 : _a.value) &&
653
- i.status !== "success";
654
- }).length),
655
- " ",
656
- "need project"))))),
657
- react_1.default.createElement(core_1.Box, null,
658
- react_1.default.createElement(core_1.Box, { component: "span", ml: 1 },
659
- react_1.default.createElement(base_ui_1.Button, { label: isUploading
660
- ? "Uploading..."
661
- : `Upload ${uploadItems.filter((i) => i.status !== "success").length} Files`, onClick: handleUploadAll, disabled: uploadItems.length === 0 ||
662
- isUploading ||
663
- uploadItems.every((i) => i.status === "success") ||
664
- (!paroDocuments && !selectedExpert) ||
665
- (hasMultipleProjects && !allFilesHaveProjects) ||
666
- uploadItems.some((i) => paroDocuments &&
667
- i.docType === "EO Insurance" &&
668
- (!i.expiryDate || !!i.dateError) &&
669
- i.status !== "success"), color: "primary", isLoading: isUploading }))))))))));
723
+ }))))),
724
+ uploadItems.length > 0 && (react_1.default.createElement(core_1.Box, { display: "flex", justifyContent: "flex-end" },
725
+ react_1.default.createElement(base_ui_1.Button, { label: isUploading
726
+ ? "Uploading..."
727
+ : `Upload ${uploadItems.filter((i) => i.status !== "success").length} File${uploadItems.filter((i) => i.status !== "success").length !== 1 ? "s" : ""}`, onClick: handleUploadAll, disabled: uploadItems.length === 0 ||
728
+ isUploading ||
729
+ uploadItems.every((i) => i.status === "success") ||
730
+ (!paroDocuments && !selectedExpert) ||
731
+ (hasMultipleProjects && !allFilesHaveProjects) ||
732
+ uploadItems.some((i) => paroDocuments &&
733
+ i.docType === "EO Insurance" &&
734
+ (!i.expiryDate || !!i.dateError) &&
735
+ i.status !== "success"), color: "primary", isLoading: isUploading })))))));
670
736
  };
671
737
  exports.MultiFileUploadSection = MultiFileUploadSection;
672
738
  exports.default = exports.MultiFileUploadSection;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@paro.io/expert-shared-components",
3
- "version": "1.14.42",
3
+ "version": "1.14.44",
4
4
  "description": "",
5
5
  "main": "lib/index.js",
6
6
  "scripts": {