@paro.io/expert-shared-components 1.11.4 → 1.11.6

package/lib/components/FileUploader/index.d.ts

@@ -0,0 +1,12 @@
+interface UploadFileParams {
+    file: File;
+    documentName: string;
+    disputeId?: number;
+    projectId: number;
+    documentUploadUrl: string;
+    updateClientInvoiceDisputeMutation: any;
+    previousFiles: string[];
+    isExpert: boolean;
+}
+export declare const fileUploader: ({ file, projectId, documentUploadUrl, updateClientInvoiceDisputeMutation, disputeId, previousFiles, isExpert, }: UploadFileParams) => Promise<boolean>;
+export {};

package/lib/components/FileUploader/index.js

@@ -0,0 +1,55 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.fileUploader = void 0;
+const UploadClient_1 = __importDefault(require("../shared/UploadClient"));
+const utils_1 = require("../shared/utils");
+const fileUploader = (_a) => __awaiter(void 0, [_a], void 0, function* ({ file, projectId, documentUploadUrl, updateClientInvoiceDisputeMutation, disputeId, previousFiles, isExpert, }) {
+    try {
+        (0, utils_1.showToast)('success', 'Starting Document Upload');
+        const uploadClient = new UploadClient_1.default({
+            fileSelected: file,
+            fileName: file.name,
+            projectId,
+            documentUploadUrl,
+            bucketName: 'expert-client-dispute-files',
+        });
+        yield uploadClient.triggerMultipartUpload().then((res) => {
+            const resParsed = JSON.parse(res);
+            const documentLink = resParsed === null || resParsed === void 0 ? void 0 : resParsed.Location;
+            updateClientInvoiceDisputeMutation({
+                variables: {
+                    input: {
+                        disputeId: disputeId,
+                        projectDisputes: [
+                            Object.assign({ projectId: projectId }, (isExpert ? {
+                                expertDocumentLinks: [...previousFiles, documentLink].join(',')
+                            } : {
+                                clientDocumentLinks: [...previousFiles, documentLink].join(',')
+                            }))
+                        ]
+                    },
+                },
+            });
+            console.log(`Multipart File uploaded successfully with ${res}`);
+            (0, utils_1.showToast)('success', 'Document Upload Successful');
+        });
+        return true;
+    }
+    catch (error) {
+        (0, utils_1.showToast)('warning', 'Error uploading file. Please try again.');
+        return false;
+    }
+});
+exports.fileUploader = fileUploader;

package/lib/components/Invoices/DecisionSection.d.ts

@@ -1,7 +1,6 @@
 interface DecisionSectionProps {
     dispute: any;
     onUpdateDispute: (variables: any) => Promise<any>;
-    onRefetch: () => Promise<void>;
 }
 export declare const DecisionSection: ({ dispute, onUpdateDispute, }: DecisionSectionProps) => JSX.Element;
 export {};

package/lib/components/Invoices/DecisionSection.js

@@ -40,9 +40,9 @@ const react_1 = __importStar(require("react"));
 const base_ui_1 = require("@paro.io/base-ui");
 const react_hot_toast_1 = __importDefault(require("react-hot-toast"));
 const RESOLUTION_OPTIONS = [
-    { value: 'Resolved', label: 'Approve Dispute' },
-    { value: 'Resolved', label: 'Decline Dispute' },
-    { value: 'Resolved', label: 'Partial Approval' },
+    { value: 'APPROVED', label: 'Approve Dispute' },
+    { value: 'DECLINED', label: 'Decline Dispute' },
+    { value: 'PARTIAL', label: 'Partial Approval' },
 ];
 const DecisionSection = ({ dispute, onUpdateDispute, }) => {
     const [resolution, setResolution] = (0, react_1.useState)('');
@@ -57,7 +57,7 @@ const DecisionSection = ({ dispute, onUpdateDispute, }) => {
                 variables: {
                     input: {
                         disputeId: dispute.disputeId,
-                        status: resolution,
+                        status: "Resolved",
                         approvedAmount: amount ? parseFloat(amount) : undefined,
                     },
                 },

package/lib/components/Invoices/DiscussionSection.d.ts

@@ -14,6 +14,7 @@ interface DiscussionSectionProps {
     currentUser: any;
     messages: Message[];
     onCreateMessage: (variables: any) => Promise<any>;
+    isInternal?: boolean;
 }
-export declare const DiscussionSection: ({ disputeId, currentUser, messages, onCreateMessage, }: DiscussionSectionProps) => JSX.Element;
+export declare const DiscussionSection: ({ disputeId, currentUser, messages, onCreateMessage, isInternal }: DiscussionSectionProps) => JSX.Element;
 export {};

package/lib/components/Invoices/DiscussionSection.js

@@ -39,11 +39,11 @@ exports.DiscussionSection = void 0;
 const react_1 = __importStar(require("react"));
 const base_ui_1 = require("@paro.io/base-ui");
 const dayjs_1 = __importDefault(require("dayjs"));
-const DiscussionSection = ({ disputeId, currentUser, messages, onCreateMessage, }) => {
-    var _a;
+const DiscussionSection = ({ disputeId, currentUser, messages, onCreateMessage, isInternal }) => {
     const [newMessage, setNewMessage] = (0, react_1.useState)('');
     const [visibility, setVisibility] = (0, react_1.useState)('ALL');
     const [isLoading, setIsLoading] = (0, react_1.useState)(false);
+    const threadsEndRef = (0, react_1.useRef)(null);
     // Get the sequence of unique userTypeIds to determine alignment
     const userSequence = (0, react_1.useMemo)(() => {
         const uniqueUsers = Array.from(new Set(messages.map(m => m.sender.userTypeId)));
@@ -82,11 +82,11 @@ const DiscussionSection = ({ disputeId, currentUser, messages, onCreateMessage,
     const getSenderTextColor = (userTypeId) => {
         switch (userTypeId) {
             case 1:
-                return '#195C5C';
+                return '#643E0C';
             case 2:
                 return '#2196F3';
             case 3:
-                return '#643E0C';
+                return '#195C5C';
             default:
                 return '#333333';
         }
@@ -94,11 +94,11 @@ const DiscussionSection = ({ disputeId, currentUser, messages, onCreateMessage,
     const getSenderBackgroundColor = (userTypeId) => {
         switch (userTypeId) {
             case 1:
-                return '#D9EFEF';
+                return '#FDD7A5';
             case 2:
                 return '#E4F0FF';
             case 3:
-                return '#FDD7A5';
+                return '#D9EFEF';
             default:
                 return '#F8F9FA';
         }
@@ -138,12 +138,13 @@ const DiscussionSection = ({ disputeId, currentUser, messages, onCreateMessage,
                             react_1.default.createElement("span", { className: "text-xs text-[#666666]" }, (0, dayjs_1.default)(message.createdAt).format('MMM D, YYYY • h:mm A'))),
                         react_1.default.createElement("div", { style: { backgroundColor: getSenderBackgroundColor(message.sender.userTypeId) }, className: "mt-1 p-3 rounded-lg" },
                             react_1.default.createElement("p", { className: `text-sm ${getHeaderAlignment(message.sender.userTypeId)}`, style: { color: getSenderTextColor(message.sender.userTypeId) } }, message.messageText)))))))),
+            react_1.default.createElement("div", { ref: threadsEndRef }),
             react_1.default.createElement("div", { className: "space-y-4 p-6 space-y-6 rounded mt-4", style: { backgroundColor: '#F5F7F9' } },
                 react_1.default.createElement("div", null,
                     react_1.default.createElement("div", { className: "font-bold text-[#333333] mb-2" }, "Add Comment"),
                     react_1.default.createElement("textarea", { value: newMessage, onChange: (e) => setNewMessage(e.target.value), placeholder: "Type your comment here...", className: "w-full h-24 p-3 border border-[#CCCCCC] rounded-lg text-sm resize-none focus:outline-none focus:ring-2 focus:ring-[#248384]" })),
                 react_1.default.createElement("div", { className: "flex items-center justify-between" },
-                    react_1.default.createElement("div", { className: "flex items-center space-x-4" }, ((_a = currentUser === null || currentUser === void 0 ? void 0 : currentUser.app_metadata) === null || _a === void 0 ? void 0 : _a.userTypeId) === 1 && (react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement("div", { className: "flex items-center space-x-4" }, isInternal && (react_1.default.createElement(react_1.default.Fragment, null,
                         react_1.default.createElement("span", { className: "text-sm text-[#666666]" }, "Visible to:"),
                         react_1.default.createElement("div", { className: "flex items-center space-x-2" },
                             react_1.default.createElement("label", { className: "flex items-center space-x-2 cursor-pointer" },

package/lib/components/Invoices/DisputeSection.d.ts

@@ -1,7 +1,7 @@
 interface DisputeSectionProps {
     dispute: any;
-    onUpdateDispute: (variables: any) => Promise<any>;
-    onRefetch: () => Promise<void>;
+    documentUploadUrl: string;
+    updateClientInvoiceDisputeMutation: (variables: any) => Promise<any>;
 }
-export declare const DisputeSection: ({ dispute, onUpdateDispute, onRefetch, }: DisputeSectionProps) => JSX.Element;
+export declare const DisputeSection: ({ dispute, documentUploadUrl, updateClientInvoiceDisputeMutation, }: DisputeSectionProps) => JSX.Element;
 export {};

package/lib/components/Invoices/DisputeSection.js

@@ -22,11 +22,22 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DisputeSection = void 0;
 const react_1 = __importStar(require("react"));
 const base_ui_1 = require("@paro.io/base-ui");
 const base_icons_1 = require("@paro.io/base-icons");
+const FileUploader_1 = require("../FileUploader");
+const core_1 = require("@material-ui/core");
 const ACCEPTED_FILE_TYPES = [
     'application/pdf',
     'application/msword',
@@ -35,31 +46,50 @@ const ACCEPTED_FILE_TYPES = [
     'image/png',
     'text/csv',
 ];
-const DisputeSection = ({ dispute, onUpdateDispute, onRefetch, }) => {
+const DisputeSection = ({ dispute, documentUploadUrl, updateClientInvoiceDisputeMutation, }) => {
     var _a, _b, _c;
-    const [files, setFiles] = (0, react_1.useState)((dispute === null || dispute === void 0 ? void 0 : dispute.clientDocumentLinks) || []);
     const fileInputRef = (0, react_1.useRef)(null);
+    const disputeProject = (_a = dispute === null || dispute === void 0 ? void 0 : dispute.disputeProjects) === null || _a === void 0 ? void 0 : _a[0];
+    const clientDocumentLinks = (_b = disputeProject === null || disputeProject === void 0 ? void 0 : disputeProject.clientDocumentLinks) === null || _b === void 0 ? void 0 : _b.split(',');
+    const expertDocumentLinks = (_c = disputeProject === null || disputeProject === void 0 ? void 0 : disputeProject.expertDocumentLinks) === null || _c === void 0 ? void 0 : _c.split(',');
     const validateFileUpload = (file) => {
         return ACCEPTED_FILE_TYPES.includes(file.type);
     };
-    const handleUpload = (event) => {
+    const handleUpload = (event, isExpert) => {
         const selectedFiles = event.target.files;
         if (!selectedFiles)
             return;
-        const validFiles = Array.from(selectedFiles)
-            .filter(file => validateFileUpload(file))
-            .map(file => file.name);
-        if (validFiles.length === 0)
-            return;
-        setFiles(prev => [...prev, ...validFiles]);
+        const getFileNames = selectedFiles && Array.from(selectedFiles).map((file) => {
+            if (!validateFileUpload(file)) {
+                return null;
+            }
+            if (file) {
+                return file.name;
+            }
+        }).filter((name) => name !== null);
+        if (getFileNames && getFileNames.length > 0) {
+            Array.from(selectedFiles).forEach((selectedFile) => {
+                const reader = new FileReader();
+                reader.onloadend = () => __awaiter(void 0, void 0, void 0, function* () {
+                    var _a, _b;
+                    yield (0, FileUploader_1.fileUploader)({
+                        file: selectedFile,
+                        documentName: selectedFile.name,
+                        projectId: Number((_b = (_a = dispute === null || dispute === void 0 ? void 0 : dispute.disputeProjects) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.projectId),
+                        documentUploadUrl: documentUploadUrl,
+                        updateClientInvoiceDisputeMutation: updateClientInvoiceDisputeMutation,
+                        disputeId: dispute === null || dispute === void 0 ? void 0 : dispute.disputeId,
+                        previousFiles: isExpert ? expertDocumentLinks : clientDocumentLinks,
+                        isExpert: isExpert,
+                    });
+                });
+                reader.readAsDataURL(selectedFile);
+            });
+        }
         if (fileInputRef.current) {
             fileInputRef.current.value = '';
         }
     };
-    const handleRemoveFile = (fileName) => {
-        setFiles(prev => prev.filter(f => f !== fileName));
-    };
-    const disputeProject = (_a = dispute === null || dispute === void 0 ? void 0 : dispute.disputeProjects) === null || _a === void 0 ? void 0 : _a[0];
     return (react_1.default.createElement("div", { className: "grid grid-cols-2 gap-6" },
         react_1.default.createElement("div", { className: "space-y-4" },
             react_1.default.createElement("div", { className: "flex items-center justify-between" },
@@ -74,9 +104,17 @@ const DisputeSection = ({ dispute, onUpdateDispute, onRefetch, }) => {
                 react_1.default.createElement("div", null,
                     react_1.default.createElement("div", { className: "text-sm font-bold text-[#333333] mb-2" }, "Supporting Documents:"),
                     react_1.default.createElement("div", { className: "flex flex-wrap gap-2" },
-                        react_1.default.createElement("input", { ref: fileInputRef, type: "file", multiple: true, accept: ACCEPTED_FILE_TYPES.join(','), className: "hidden", onChange: handleUpload }),
-                        react_1.default.createElement(base_ui_1.Button, { label: "Add File", iconLeft: react_1.default.createElement(base_icons_1.IconPlus, { size: "sm" }), onClick: () => { var _a; return (_a = fileInputRef.current) === null || _a === void 0 ? void 0 : _a.click(); }, size: "sm", color: "info", className: "bg-white border border-[#248384] text-[#248384]" }), (_b = disputeProject === null || disputeProject === void 0 ? void 0 : disputeProject.clientDocumentLinks) === null || _b === void 0 ? void 0 :
-                        _b.map((file, index) => (react_1.default.createElement(base_ui_1.Tag, { key: index, label: file, variant: "subtle", color: "success", iconRight: react_1.default.createElement(base_icons_1.IconXCircle, null), onClick: () => handleRemoveFile(file) }))))))),
+                        react_1.default.createElement("input", { ref: fileInputRef, type: "file", multiple: true, accept: ACCEPTED_FILE_TYPES.join(','), className: "hidden", onChange: (e) => handleUpload(e, false) }),
+                        react_1.default.createElement("div", { className: "flex flex-wrap gap-2" }, expertDocumentLinks === null || expertDocumentLinks === void 0 ? void 0 : expertDocumentLinks.map((file, index) => (
+                        // @ts-ignore
+                        react_1.default.createElement(core_1.Chip, { key: index, label: file.split('%2F').pop(), variant: "outlined", onClick: () => { window.open(file, '_blank'); }, sx: {
+                                '&:hover': {
+                                    cursor: 'pointer',
+                                    backgroundColor: 'rgba(76, 175, 80, 0.1)'
+                                }
+                            } })))),
+                        react_1.default.createElement("div", { className: "w-full mt-2" },
+                            react_1.default.createElement(base_ui_1.Button, { label: "Add File", iconLeft: react_1.default.createElement(base_icons_1.IconPlus, { size: "sm" }), onClick: () => { var _a; return (_a = fileInputRef.current) === null || _a === void 0 ? void 0 : _a.click(); }, size: "sm", color: "info", className: "bg-white border border-[#248384] text-[#248384]" })))))),
         react_1.default.createElement("div", { className: "space-y-4" },
             react_1.default.createElement("div", { className: "flex items-center justify-between" },
                 react_1.default.createElement("div", { className: "text-lg font-bold text-[#333333]" }, "Expert Rebuttal")),
@@ -87,8 +125,16 @@ const DisputeSection = ({ dispute, onUpdateDispute, onRefetch, }) => {
                 react_1.default.createElement("div", null,
                     react_1.default.createElement("div", { className: "text-sm font-bold text-[#333333] mb-2" }, "Supporting Documents:"),
                     react_1.default.createElement("div", { className: "flex flex-wrap gap-2" },
-                        react_1.default.createElement("input", { ref: fileInputRef, type: "file", multiple: true, accept: ACCEPTED_FILE_TYPES.join(','), className: "hidden", onChange: handleUpload }),
-                        react_1.default.createElement(base_ui_1.Button, { label: "Add File", iconLeft: react_1.default.createElement(base_icons_1.IconPlus, { size: "sm" }), onClick: () => { var _a; return (_a = fileInputRef.current) === null || _a === void 0 ? void 0 : _a.click(); }, size: "sm", color: "info", className: "bg-white border border-[#248384] text-[#248384]" }), (_c = disputeProject === null || disputeProject === void 0 ? void 0 : disputeProject.expertDocumentLinks) === null || _c === void 0 ? void 0 :
-                        _c.map((file, index) => (react_1.default.createElement(base_ui_1.Tag, { key: index, label: file, variant: "subtle", color: "success", iconRight: react_1.default.createElement(base_icons_1.IconXCircle, null), onClick: () => handleRemoveFile(file) })))))))));
+                        react_1.default.createElement("input", { ref: fileInputRef, type: "file", multiple: true, accept: ACCEPTED_FILE_TYPES.join(','), className: "hidden", onChange: (e) => handleUpload(e, true) }),
+                        react_1.default.createElement("div", { className: "flex flex-wrap gap-2" }, clientDocumentLinks === null || clientDocumentLinks === void 0 ? void 0 : clientDocumentLinks.map((file, index) => (
+                        // @ts-ignore
+                        react_1.default.createElement(core_1.Chip, { key: index, label: file.split('%2F').pop(), variant: "outlined", onClick: () => { window.open(file, '_blank'); }, sx: {
+                                '&:hover': {
+                                    cursor: 'pointer',
+                                    backgroundColor: 'rgba(76, 175, 80, 0.1)'
+                                }
+                            } })))),
+                        react_1.default.createElement("div", { className: "w-full mt-2" },
+                            react_1.default.createElement(base_ui_1.Button, { label: "Add File", iconLeft: react_1.default.createElement(base_icons_1.IconPlus, { size: "sm" }), onClick: () => { var _a; return (_a = fileInputRef.current) === null || _a === void 0 ? void 0 : _a.click(); }, size: "sm", color: "info", className: "bg-white border border-[#248384] text-[#248384]" }))))))));
 };
 exports.DisputeSection = DisputeSection;

package/lib/components/Invoices/InvoiceCard.d.ts

@@ -3,8 +3,9 @@ interface InvoiceCardProps {
     createDisputeChatMessage: any;
     user: any;
     chatMessages: any[];
-    updateClientInvoiceMutation: any;
-    refetchInvoiceDisputes: any;
+    updateClientInvoiceDisputeMutation: any;
+    documentUploadUrl: string;
+    isInternal?: boolean;
 }
-export declare const InvoiceCard: ({ clientInvoice, createDisputeChatMessage, user, chatMessages, updateClientInvoiceMutation, refetchInvoiceDisputes, }: InvoiceCardProps) => JSX.Element;
+export declare const InvoiceCard: ({ clientInvoice, createDisputeChatMessage, user, chatMessages, updateClientInvoiceDisputeMutation, documentUploadUrl, isInternal }: InvoiceCardProps) => JSX.Element;
 export {};

package/lib/components/Invoices/InvoiceCard.js

@@ -11,15 +11,15 @@ const InvoiceDetails_1 = require("./InvoiceDetails");
 const DisputeSection_1 = require("./DisputeSection");
 const DiscussionSection_1 = require("./DiscussionSection");
 const DecisionSection_1 = require("./DecisionSection");
-const InvoiceCard = ({ clientInvoice, createDisputeChatMessage, user, chatMessages, updateClientInvoiceMutation, refetchInvoiceDisputes, }) => {
-    var _a, _b, _c;
+const InvoiceCard = ({ clientInvoice, createDisputeChatMessage, user, chatMessages, updateClientInvoiceDisputeMutation, documentUploadUrl, isInternal }) => {
+    var _a, _b;
     return (react_1.default.createElement(base_ui_1.Card, { className: "w-full bg-white rounded-lg shadow-sm overflow-hidden" },
         react_1.default.createElement(InvoiceHeader_1.InvoiceHeader, { invoice: clientInvoice }),
         react_1.default.createElement("div", { className: "p-6 space-y-6" },
             react_1.default.createElement(InvoiceDetails_1.InvoiceDetails, { invoice: clientInvoice }),
-            react_1.default.createElement(DisputeSection_1.DisputeSection, { dispute: clientInvoice, onUpdateDispute: updateClientInvoiceMutation, onRefetch: refetchInvoiceDisputes }),
-            (clientInvoice === null || clientInvoice === void 0 ? void 0 : clientInvoice.chatEnabled) && (react_1.default.createElement(DiscussionSection_1.DiscussionSection, { disputeId: (_b = (_a = clientInvoice === null || clientInvoice === void 0 ? void 0 : clientInvoice.disputeProjects) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.id, currentUser: user, messages: chatMessages, onCreateMessage: createDisputeChatMessage })),
-            ((_c = user === null || user === void 0 ? void 0 : user.app_metadata) === null || _c === void 0 ? void 0 : _c.userTypeId) === 2 &&
-                react_1.default.createElement(DecisionSection_1.DecisionSection, { dispute: clientInvoice, onUpdateDispute: updateClientInvoiceMutation, onRefetch: refetchInvoiceDisputes }))));
+            react_1.default.createElement(DisputeSection_1.DisputeSection, { dispute: clientInvoice, documentUploadUrl: documentUploadUrl, updateClientInvoiceDisputeMutation: updateClientInvoiceDisputeMutation }),
+            (clientInvoice === null || clientInvoice === void 0 ? void 0 : clientInvoice.chatEnabled) && (react_1.default.createElement(DiscussionSection_1.DiscussionSection, { disputeId: (_b = (_a = clientInvoice === null || clientInvoice === void 0 ? void 0 : clientInvoice.disputeProjects) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.id, currentUser: user, messages: chatMessages, onCreateMessage: createDisputeChatMessage, isInternal: isInternal })),
+            isInternal &&
+                react_1.default.createElement(DecisionSection_1.DecisionSection, { dispute: clientInvoice, onUpdateDispute: updateClientInvoiceDisputeMutation }))));
 };
 exports.InvoiceCard = InvoiceCard;

package/lib/components/Invoices/InvoiceDetails.js

@@ -5,29 +5,31 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.InvoiceDetails = void 0;
 const react_1 = __importDefault(require("react"));
-const base_ui_1 = require("@paro.io/base-ui");
 const dayjs_1 = __importDefault(require("dayjs"));
 const DisputeProjectCard_1 = require("./DisputeProjectCard");
+const core_1 = require("@material-ui/core");
 const InvoiceDetails = ({ invoice }) => {
     var _a;
     const getStatusColor = (status) => {
         switch (status) {
             case 'InProgress':
-                return 'warning';
+                return 'primary';
             case 'UnderReview':
-                return 'info';
+                return 'primary';
             case 'Resolved':
                 return 'success';
             default:
-                return 'default';
+                return 'primary';
         }
     };
     return (react_1.default.createElement("div", { className: "space-y-6" },
         react_1.default.createElement("div", { className: "flex items-center space-x-4" },
-            react_1.default.createElement(base_ui_1.Tag, { label: invoice === null || invoice === void 0 ? void 0 : invoice.status, variant: "subtle", color: getStatusColor(invoice === null || invoice === void 0 ? void 0 : invoice.status) }),
+            react_1.default.createElement(core_1.Chip, { label: invoice === null || invoice === void 0 ? void 0 : invoice.status, size: "small", variant: "outlined", 
+                // @ts-ignore
+                color: getStatusColor(invoice === null || invoice === void 0 ? void 0 : invoice.status) }),
             react_1.default.createElement("span", { className: "text-xs text-[#666666]" },
                 "Last updated: ",
-                (0, dayjs_1.default)(invoice === null || invoice === void 0 ? void 0 : invoice.disputeUpdatedDate).format('YYYY-MM-DD'))),
+                (0, dayjs_1.default)(invoice === null || invoice === void 0 ? void 0 : invoice.disputeUpdatedDate).format('MMM D, YYYY'))),
         ((_a = invoice === null || invoice === void 0 ? void 0 : invoice.disputeProjects) === null || _a === void 0 ? void 0 : _a.length) > 0 && (react_1.default.createElement("div", { className: "space-y-4" },
             react_1.default.createElement("div", { className: "grid grid-cols-1 gap-4" }, invoice.disputeProjects.map((project) => (react_1.default.createElement(DisputeProjectCard_1.DisputeProjectCard, { key: project.id, project: project, client: invoice === null || invoice === void 0 ? void 0 : invoice.client, disputeDate: invoice === null || invoice === void 0 ? void 0 : invoice.disputeDate, disputeUpdatedDate: invoice === null || invoice === void 0 ? void 0 : invoice.disputeUpdatedDate }))))))));
 };

package/lib/components/shared/UploadClient.d.ts

@@ -5,6 +5,7 @@ export default class UploadClient {
         fileName: string;
         documentUploadUrl: string;
         projectId: number;
+        bucketName: string;
     };
     constructor(props: any);
     generateS3Key(projectId: number, fileName: string): string;

package/lib/components/shared/UploadClient.js

@@ -17,6 +17,7 @@ class UploadClient {
             fileName: props.fileName,
             documentUploadUrl: props.documentUploadUrl,
             projectId: props.projectId,
+            bucketName: props.bucketName,
         };
     }
     generateS3Key(projectId, fileName) {
@@ -34,6 +35,7 @@ class UploadClient {
                 const params = {
                     fileName: this.state.fileName,
                     fileType: this.state.fileSelected.type,
+                    bucketName: this.state.bucketName,
                     method: 'start-upload',
                 };
                 const response = yield fetch(`${this.state.documentUploadUrl}`, {
@@ -67,7 +69,7 @@ class UploadClient {
                     // Get presigned URL for each part from backend lambda
                     let presignedUrlResponse = yield fetch(`${this.state.documentUploadUrl}`, {
                         method: 'POST',
-                        body: JSON.stringify({ fileName: this.state.fileName, uploadId: this.state.uploadId, partNumber: index, method: 'get-presigned-url' }),
+                        body: JSON.stringify({ fileName: this.state.fileName, uploadId: this.state.uploadId, partNumber: index, method: 'get-presigned-url', bucketName: this.state.bucketName }),
                     });
                     const { responseData } = yield presignedUrlResponse.json();
                     // Add each upload part to promise array using presigned URL
@@ -100,11 +102,11 @@ class UploadClient {
                     headers: {
                         'Content-Type': 'application/json',
                     },
-                    body: JSON.stringify({ fileName: this.state.fileName, uploadId: this.state.uploadId, parts: partsArray, method: 'complete-upload' }),
+                    body: JSON.stringify({ fileName: this.state.fileName, uploadId: this.state.uploadId, parts: partsArray, method: 'complete-upload', bucketName: this.state.bucketName }),
                 });
                 const { responseData } = yield response.json();
                 console.log('Upload Complete', responseData);
-                return `Upload Complete ${JSON.stringify(responseData)}`;
+                return `${JSON.stringify(responseData)}`;
             }
             catch (error) {
                 console.log(`Error Completing Multipart Upload ${error}`);

package/lib/index.d.ts

@@ -12,3 +12,4 @@ export { sharedUtils } from './components/shared/utils';
 export { ActiveProjectCard } from './components/ProjectCard/ActiveProjectCard';
 export { InvoiceCard } from './components/Invoices/InvoiceCard';
 export { DiscussionThread } from './components/DiscussionThread';
+export { fileUploader } from './components/FileUploader';

package/lib/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.DiscussionThread = exports.InvoiceCard = exports.ActiveProjectCard = exports.sharedUtils = exports.ServiceLinesTemplate = exports.HeaderNavBar = exports.DocumentCenter = exports.ProfileCompletedPercentage = exports.ExpertProfileHeader = exports.OrganizationChart = exports.FirmEmployeeSection = exports.ClientReferenceSection = exports.Reviews = exports.ReviewsTab = void 0;
+exports.fileUploader = exports.DiscussionThread = exports.InvoiceCard = exports.ActiveProjectCard = exports.sharedUtils = exports.ServiceLinesTemplate = exports.HeaderNavBar = exports.DocumentCenter = exports.ProfileCompletedPercentage = exports.ExpertProfileHeader = exports.OrganizationChart = exports.FirmEmployeeSection = exports.ClientReferenceSection = exports.Reviews = exports.ReviewsTab = void 0;
 var ReviewsTab_1 = require("./components/ReviewsTab");
 Object.defineProperty(exports, "ReviewsTab", { enumerable: true, get: function () { return ReviewsTab_1.ReviewsTab; } });
 var Reviews_1 = require("./components/Reviews");
@@ -29,3 +29,5 @@ var InvoiceCard_1 = require("./components/Invoices/InvoiceCard");
 Object.defineProperty(exports, "InvoiceCard", { enumerable: true, get: function () { return InvoiceCard_1.InvoiceCard; } });
 var DiscussionThread_1 = require("./components/DiscussionThread");
 Object.defineProperty(exports, "DiscussionThread", { enumerable: true, get: function () { return DiscussionThread_1.DiscussionThread; } });
+var FileUploader_1 = require("./components/FileUploader");
+Object.defineProperty(exports, "fileUploader", { enumerable: true, get: function () { return FileUploader_1.fileUploader; } });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@paro.io/expert-shared-components",
-  "version": "1.11.4",
+  "version": "1.11.6",
   "description": "",
   "main": "lib/index.js",
   "scripts": {