@paro.io/expert-shared-components 1.12.36 → 1.12.37

package/lib/components/Escalations/EscalationTabsContent.d.ts

@@ -0,0 +1,17 @@
+type EscalationChatDetails = {
+    title: string;
+    project: string;
+    caseId: string;
+    status: string;
+};
+interface EscalationTabProps {
+    activeTab: string;
+    openEscalationChat: (details: EscalationChatDetails) => void;
+    setSelectedIssue: (issue: string) => void;
+    activeIssues: any[];
+    inProgressIssues: any[];
+    resolvedIssues: any[];
+    isExpert: boolean;
+}
+declare const EscalationTabsContent: ({ activeTab, openEscalationChat, setSelectedIssue, activeIssues, inProgressIssues, resolvedIssues, isExpert, }: EscalationTabProps) => JSX.Element;
+export default EscalationTabsContent;

package/lib/components/Escalations/EscalationTabsContent.js

@@ -0,0 +1,123 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const base_ui_1 = require("@paro.io/base-ui");
+const react_1 = __importDefault(require("react"));
+;
+const getBackgroundColor = (type) => {
+    switch (type) {
+        case 'Critical':
+            return 'danger';
+        case 'High':
+            return 'warning';
+        case 'Medium':
+            return 'info';
+        case 'Low':
+            return 'default';
+        default:
+            return 'default';
+    }
+};
+const EscalationTabsContent = ({ activeTab, openEscalationChat, setSelectedIssue, activeIssues, inProgressIssues, resolvedIssues, isExpert, }) => {
+    if (activeTab === 'action-required') {
+        return (react_1.default.createElement("div", null,
+            react_1.default.createElement("div", { className: "flex items-center justify-between mb-4" },
+                react_1.default.createElement("h3", { className: "text-lg font-semibold text-gray-900" }, "Issues Requiring Your Response"),
+                react_1.default.createElement("div", { className: "text-sm text-gray-500" }, "Ordered by urgency")),
+            activeIssues.length > 0 ? react_1.default.createElement("div", { className: "space-y-4" }, activeIssues.map((issue) => (react_1.default.createElement("div", { key: issue.caseId, className: "border border-gray-200 rounded-lg bg-white p-4" },
+                react_1.default.createElement("div", { className: "flex items-center" },
+                    react_1.default.createElement(base_ui_1.Tag, { label: issue.tag, color: getBackgroundColor(issue.tag) }),
+                    react_1.default.createElement("div", { className: "flex-1 ml-2" },
+                        react_1.default.createElement("div", { className: "font-bold" }, issue.title),
+                        react_1.default.createElement("div", { className: "text-xs text-gray-500" },
+                            issue.project,
+                            " \u2022 Case #",
+                            issue.caseId))),
+                react_1.default.createElement("div", { className: "bg-gray-50 rounded-md p-3 mb-4 border" },
+                    react_1.default.createElement("div", { className: "flex items-center justify-between mb-2" },
+                        react_1.default.createElement("div", { className: "text-xs text-gray-500" }, issue.submitted)),
+                    react_1.default.createElement("div", { className: "text-sm text-gray-600 italic" }, issue.message)),
+                react_1.default.createElement("div", { className: "flex flex-wrap gap-2" },
+                    react_1.default.createElement(base_ui_1.Button, { label: "Chat", onClick: () => openEscalationChat({
+                            title: issue.title,
+                            project: issue.project,
+                            caseId: issue.caseId,
+                            status: issue.status
+                        }), color: "primary" }),
+                    react_1.default.createElement(base_ui_1.Button, { label: "Respond to Escalation", onClick: () => setSelectedIssue(issue.respondKey), color: 'info', className: "bg-info hover:bg-white text-white hover:text-info-dark" }))))))
+                :
+                    react_1.default.createElement("div", null, "No Active issues.")));
+    }
+    if (activeTab === 'in-progress') {
+        return (react_1.default.createElement("div", null,
+            react_1.default.createElement("div", { className: "flex items-center justify-between mb-4" },
+                react_1.default.createElement("h3", { className: "text-lg font-semibold text-gray-900" }, "Issues In Progress"),
+                react_1.default.createElement("div", { className: "text-sm text-gray-500" }, "Being handled by our team")),
+            inProgressIssues.length > 0 ? react_1.default.createElement("div", { className: "space-y-4" }, inProgressIssues.map((issue) => (react_1.default.createElement("div", { key: issue.caseId, className: "border border-gray-200 rounded-lg bg-white p-4" },
+                react_1.default.createElement("div", { className: "flex items-start justify-between mb-3" },
+                    react_1.default.createElement("div", { className: "flex items-center" },
+                        react_1.default.createElement(base_ui_1.Tag, { label: issue.tag, color: getBackgroundColor(issue.tag) }),
+                        react_1.default.createElement("div", { className: "flex-1 ml-2" },
+                            react_1.default.createElement("div", { className: "font-bold" }, issue.title),
+                            react_1.default.createElement("div", { className: "text-xs text-gray-500" },
+                                issue.project,
+                                " \u2022 Case #",
+                                issue.caseId),
+                            issue.extra))),
+                react_1.default.createElement("div", { className: "bg-gray-50 rounded-md p-3 mb-4 border" },
+                    react_1.default.createElement("div", { className: "flex items-center justify-between mb-2" },
+                        react_1.default.createElement("span", { className: "text-sm font-medium" }, issue.updateLabel),
+                        react_1.default.createElement("div", { className: "text-xs text-gray-500" }, issue.updateTime)),
+                    react_1.default.createElement("div", { className: "text-sm text-gray-600 italic mb-3" }, issue.message)),
+                react_1.default.createElement("div", { className: "flex flex-wrap gap-2" },
+                    react_1.default.createElement(base_ui_1.Button, { onClick: () => openEscalationChat({
+                            title: issue.title,
+                            project: issue.project,
+                            caseId: issue.caseId,
+                            status: issue.status
+                        }), label: "Chat", color: "primary" }),
+                    !isExpert && react_1.default.createElement(base_ui_1.Button, { onClick: issue.markResolved, label: "Mark as Resolved", color: "info", className: "bg-info hover:bg-none text-white hover:text-info-dark" })))))) :
+                react_1.default.createElement("div", null, "No inProgress issues.")));
+    }
+    if (activeTab === 'resolved') {
+        return (react_1.default.createElement("div", null,
+            react_1.default.createElement("div", { className: "flex items-center justify-between mb-4" },
+                react_1.default.createElement("h3", { className: "text-lg font-semibold text-gray-900" }, "Recently Resolved Issues"),
+                react_1.default.createElement("button", { className: "text-sm text-gray-500 hover:text-gray-700 flex items-center" },
+                    react_1.default.createElement("span", null, "View All History"))),
+            resolvedIssues.length > 0 ? react_1.default.createElement("div", { className: "space-y-3" }, resolvedIssues.map((issue) => (react_1.default.createElement("div", { key: issue.caseId, className: "border border-green-200 rounded-lg bg-green-50 p-4" },
+                react_1.default.createElement("div", { className: "flex items-start justify-between" },
+                    react_1.default.createElement("div", { className: "flex items-start" },
+                        react_1.default.createElement("div", null,
+                            react_1.default.createElement("h4", { className: "font-medium text-gray-900 mb-1" }, issue.title),
+                            react_1.default.createElement("div", { className: "flex items-center text-sm text-gray-600 mb-2" },
+                                react_1.default.createElement("span", null, issue.person),
+                                react_1.default.createElement("span", { className: "mx-2" }, "\u2022"),
+                                react_1.default.createElement("span", null, issue.project),
+                                react_1.default.createElement("span", { className: "mx-2" }, "\u2022"),
+                                react_1.default.createElement("span", null,
+                                    "Case #",
+                                    issue.caseId)),
+                            react_1.default.createElement("p", { className: "text-sm text-gray-600 mb-3" }, issue.description),
+                            react_1.default.createElement("div", { className: "flex items-center text-sm text-gray-600 mb-2" },
+                                react_1.default.createElement("span", { className: "text-xs text-gray-500" },
+                                    "Resolved ",
+                                    issue.resolvedDate),
+                                react_1.default.createElement("span", { className: "mx-2" }, "\u2022"),
+                                react_1.default.createElement("span", { className: "text-xs text-gray-500" },
+                                    "Resolved By ",
+                                    issue.resolvedBy)))),
+                    react_1.default.createElement(base_ui_1.Button, { onClick: () => openEscalationChat({
+                            title: issue.chatTitle,
+                            project: issue.project,
+                            caseId: issue.caseId,
+                            status: issue.chatStatus
+                        }), label: "Chat", color: "primary" }))))))
+                :
+                    react_1.default.createElement("div", null, "No resolved issues.")));
+    }
+    return react_1.default.createElement(react_1.default.Fragment, null);
+};
+exports.default = EscalationTabsContent;

package/lib/components/Escalations/Escalations.d.ts

@@ -0,0 +1,10 @@
+interface EscalationsProps {
+    experts: any[];
+    projects: any[];
+    isExpert: boolean;
+    activeIssues: any[];
+    inProgressIssues: any[];
+    resolvedIssues: any[];
+}
+export declare const Escalations: ({ experts, projects, isExpert, activeIssues, inProgressIssues, resolvedIssues, }: EscalationsProps) => JSX.Element;
+export {};

package/lib/components/Escalations/Escalations.js

@@ -0,0 +1,143 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Escalations = void 0;
+const react_1 = __importStar(require("react"));
+const EscalationReportBanner_1 = __importDefault(require("./EscalationReportBanner"));
+const base_ui_1 = require("@paro.io/base-ui");
+const EscalationTabs_1 = __importDefault(require("./EscalationTabs"));
+const EscalationTabsContent_1 = __importDefault(require("./EscalationTabsContent"));
+const EscalationRespondForm_1 = __importDefault(require("./EscalationRespondForm"));
+const EscalationSubmitForm_1 = __importDefault(require("./EscalationSubmitForm"));
+const EscalationChat_1 = __importDefault(require("./EscalationChat"));
+const AccountSuspensionBanner_1 = __importDefault(require("./AccountSuspensionBanner"));
+const AccountSuspensionModal_1 = __importDefault(require("./AccountSuspensionModal"));
+const base_icons_1 = require("@paro.io/base-icons");
+const Escalations = ({ experts, projects, isExpert = false, activeIssues, inProgressIssues, resolvedIssues, }) => {
+    const [activeSection, setActiveSection] = (0, react_1.useState)('support');
+    const [selectedProject, setSelectedProject] = (0, react_1.useState)(null);
+    const [selectedIssue, setSelectedIssue] = (0, react_1.useState)(null);
+    const [showEscalationChat, setShowEscalationChat] = (0, react_1.useState)(false);
+    const [activeChatIssue, setActiveChatIssue] = (0, react_1.useState)(null); // update required
+    const [activeEscalationTab, setActiveEscalationTab] = (0, react_1.useState)('action-required');
+    const [showSuspensionModal, setShowSuspensionModal] = (0, react_1.useState)(false);
+    const goBack = () => {
+        if (selectedIssue) {
+            setSelectedIssue(null);
+        }
+        else if (selectedProject) {
+            setSelectedProject(null);
+        }
+        else {
+            setActiveSection('support');
+        }
+    };
+    const goHome = () => {
+        setSelectedIssue(null);
+        setSelectedProject(null);
+        setActiveSection('support');
+    };
+    const openEscalationChat = (issue) => {
+        setActiveChatIssue(issue);
+        setShowEscalationChat(true);
+    };
+    return (react_1.default.createElement("div", { className: "bg-white w-full" },
+        react_1.default.createElement("div", { className: isExpert ? "p-6" : "mx-auto p-6 border-solid border-t-2" },
+            activeSection === 'support' && !selectedIssue && react_1.default.createElement("div", null,
+                react_1.default.createElement("div", { className: "flex justify-between items-center mb-1 mt-2" },
+                    react_1.default.createElement("h2", { className: "text-xl font-bold" }, "Support & Escalation Management"),
+                    activeIssues.length && react_1.default.createElement("div", { className: "flex items-center space-x-2" },
+                        react_1.default.createElement(base_ui_1.Tag, { label: `${activeIssues.length} Active Issues`, color: "danger" }))),
+                react_1.default.createElement("div", { className: "border-b pb-4 mb-6" },
+                    react_1.default.createElement("p", { className: "text-gray-600" }, `Manage escalations with integrated chat between you, your ${isExpert ? 'client' : 'expert'}, and Paro support. All conversations are organized by priority and status.`)),
+                react_1.default.createElement("div", { className: "bg-blue-50 border border-blue-200 rounded-lg p-4 mb-6" },
+                    react_1.default.createElement("h3", { className: "font-medium text-blue-800 mb-3" }, "How Our Escalation System Works"),
+                    react_1.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6" },
+                        react_1.default.createElement("div", null,
+                            react_1.default.createElement("h4", { className: "font-medium text-gray-900 mb-2" }, "Standard Resolution Process"),
+                            react_1.default.createElement("div", { className: "space-y-2 text-sm text-gray-600" },
+                                react_1.default.createElement("div", { className: "flex items-center" },
+                                    react_1.default.createElement("div", { className: "bg-blue-500 w-2 h-2 rounded-full mr-2" }),
+                                    react_1.default.createElement("span", null,
+                                        react_1.default.createElement("strong", null, "Step 1:"),
+                                        " ",
+                                        `Issue escalated to ${isExpert ? 'client' : 'expert'} & Paro support`)),
+                                react_1.default.createElement("div", { className: "flex items-center" },
+                                    react_1.default.createElement("div", { className: "bg-blue-500 w-2 h-2 rounded-full mr-2" }),
+                                    react_1.default.createElement("span", null,
+                                        react_1.default.createElement("strong", null, "Step 2:"),
+                                        " ",
+                                        `${isExpert ? 'Client' : 'Expert'} response with solution/timeline`)),
+                                react_1.default.createElement("div", { className: "flex items-center" },
+                                    react_1.default.createElement("div", { className: "bg-blue-500 w-2 h-2 rounded-full mr-2" }),
+                                    react_1.default.createElement("span", null,
+                                        react_1.default.createElement("strong", null, "Step 3:"),
+                                        " Implementation & resolution confirmation"))),
+                            react_1.default.createElement("div", { className: "mt-3 text-xs text-gray-600 bg-white p-2 rounded border" },
+                                react_1.default.createElement("strong", null, "Chat integration:"),
+                                " ",
+                                `All escalations include real-time chat with ${isExpert ? 'client' : 'expert'} and support team for transparent communication.`)),
+                        react_1.default.createElement("div", null,
+                            react_1.default.createElement("h4", { className: "font-medium text-gray-900 mb-2" }, "Priority Levels & Response Times"),
+                            react_1.default.createElement("div", { className: "space-y-2 text-sm" },
+                                react_1.default.createElement("div", { className: "flex items-center gap-x-2" },
+                                    react_1.default.createElement(base_ui_1.Tag, { label: "Critical", color: "danger" }),
+                                    react_1.default.createElement("span", null, "All work blocked")),
+                                react_1.default.createElement("div", { className: "flex items-center gap-x-2" },
+                                    react_1.default.createElement(base_ui_1.Tag, { label: "High", color: "warning" }),
+                                    react_1.default.createElement("span", null, "Progress blocked")),
+                                react_1.default.createElement("div", { className: "flex items-center gap-x-2" },
+                                    react_1.default.createElement(base_ui_1.Tag, { label: "Medium", color: "info" }),
+                                    react_1.default.createElement("span", null, "Timeline impacted")),
+                                react_1.default.createElement("div", { className: "flex items-center gap-x-2" },
+                                    react_1.default.createElement(base_ui_1.Tag, { label: "Low", color: "neutral" }),
+                                    react_1.default.createElement("span", null, "Minor impact")))))),
+                isExpert &&
+                    react_1.default.createElement("div", { className: "rounded-lg p-2 mb-4 shadow-lg" },
+                        react_1.default.createElement("div", { className: "flex items-center justify-between" },
+                            react_1.default.createElement("div", { className: "flex items-center" },
+                                react_1.default.createElement("div", { className: "bg-white bg-opacity-20 rounded-full p-2 mr-3" },
+                                    react_1.default.createElement(base_icons_1.IconExclamationCircle, { className: "h-6 w-6 text-black" })),
+                                react_1.default.createElement("div", null,
+                                    react_1.default.createElement("div", { className: "mr-4" },
+                                        react_1.default.createElement("h3", { className: "font-semibold text-sm mb-1" }, "Need Support with a Client?"),
+                                        react_1.default.createElement("p", { className: "text-xs" }, "Report payment, scope, or communication activeIssues")))),
+                            react_1.default.createElement(base_ui_1.Button, { label: "Report issue", onClick: () => setSelectedIssue('submit-escalation'), iconLeft: react_1.default.createElement(base_icons_1.IconExclamation, { size: "sm", className: "text-white" }), color: "info", className: "bg-info hover:bg-white text-white hover:text-info-dark" }))),
+                isExpert &&
+                    react_1.default.createElement(AccountSuspensionBanner_1.default, { setShowSuspensionModal: setShowSuspensionModal, suspended: false }),
+                !isExpert &&
+                    react_1.default.createElement(EscalationReportBanner_1.default, { onReport: () => setSelectedIssue('submit-escalation') }),
+                react_1.default.createElement(EscalationTabs_1.default, { activeTab: activeEscalationTab, setActiveTab: setActiveEscalationTab, activeIssues: activeIssues.length, inProgressIssues: inProgressIssues.length, resolvedIssues: resolvedIssues.length }),
+                react_1.default.createElement(EscalationTabsContent_1.default, { activeTab: activeEscalationTab, openEscalationChat: openEscalationChat, setSelectedIssue: setSelectedIssue, activeIssues: activeIssues, inProgressIssues: inProgressIssues, resolvedIssues: resolvedIssues, isExpert: isExpert })),
+            activeSection === 'support' && (selectedIssue === 'respond-to-issue-critical' || selectedIssue === 'respond-to-issue-medium') && (react_1.default.createElement(EscalationRespondForm_1.default, { goBack: goBack, selectedIssue: selectedIssue, goHome: goHome })),
+            activeSection === 'support' && selectedIssue === 'submit-escalation' && (react_1.default.createElement(EscalationSubmitForm_1.default, { goBack: goBack, goHome: goHome, experts: experts, projects: projects, isExpert: isExpert })),
+            showEscalationChat && activeChatIssue && (react_1.default.createElement(EscalationChat_1.default, { activeChatIssue: activeChatIssue, showEscalationChat: showEscalationChat, setShowEscalationChat: setShowEscalationChat })),
+            showSuspensionModal &&
+                react_1.default.createElement(AccountSuspensionModal_1.default, { showSuspensionModal: showSuspensionModal, onClose: () => setShowSuspensionModal(false) }))));
+};
+exports.Escalations = Escalations;

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

@@ -0,0 +1 @@
+export { Escalations } from './Escalations';

package/lib/components/Escalations/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Escalations = void 0;
+var Escalations_1 = require("./Escalations");
+Object.defineProperty(exports, "Escalations", { enumerable: true, get: function () { return Escalations_1.Escalations; } });

package/lib/components/ExpertProfileHeader/ActionButtonSection.js

@@ -11,12 +11,12 @@ const CopyToClipboardAlert_1 = __importDefault(require("../shared/CopyToClipboar
 const colors_1 = __importDefault(require("../ClientReferencesSection/constants/colors"));
 const Banner_1 = __importDefault(require("./Banner"));
 const base_icons_1 = require("@paro.io/base-icons");
-const StyledButton = (0, styled_components_1.default)(core_1.Button) `
-    margin: 0px !important;
-    padding: 26px 0 18px 0 !important;
-    span {
-        color: ${colors_1.default.buttonText} !important
-     }
+const StyledButton = (0, styled_components_1.default)(core_1.Button) `
+    margin: 0px !important;
+    padding: 26px 0 18px 0 !important;
+    span {
+        color: ${colors_1.default.buttonText} !important
+     }
 `;
 const ActionButton = ({ title, ariaLabel, onClick, icon: Icon }) => (react_1.default.createElement(core_1.Tooltip, { arrow: true, placement: "top", interactive: true, className: "whitespace-nowrap", title: title },
     react_1.default.createElement(core_1.IconButton, { "aria-label": ariaLabel, onClick: onClick },

package/lib/components/ExpertProfileHeader/ProfileSection.js

@@ -53,13 +53,13 @@ const formatPhoneNumber = (phone) => {
     return `(${numericPhone.slice(0, 3)}) ${numericPhone.slice(3, 6)} - ${numericPhone.slice(6)}`;
 };
 exports.formatPhoneNumber = formatPhoneNumber;
-exports.ProfilePhotoPreview = styled_components_1.default.img `
-  height: 86px;
-  width: 86px;
-  border: 1px solid ${colors_1.default.lightGray};
-  border-radius: 50%;
-  object-fit: cover;
-  object-position: top;
+exports.ProfilePhotoPreview = styled_components_1.default.img `
+  height: 86px;
+  width: 86px;
+  border: 1px solid ${colors_1.default.lightGray};
+  border-radius: 50%;
+  object-fit: cover;
+  object-position: top;
 `;
 const ProfileSection = ({ legacyFreelancerId, imageUrl, shouldAllowEditProfile, firstName, lastName, primaryServiceLine, editServiceLine, city, stateAbbreviation, email, phone, setOpen, paroProjectsData, getUserDocument, uploadUserPhotoMutation, loadingNewImage, imageUpdateError, isInternal, getUserByEmail, updateUserEmail, updateUserMutation, getUserByEmailLazyQuery, updateUserPassword, verifyUserPassword, getExpertRates, paroTenure, hourlyRate, }) => {
     var _a;

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

@@ -1 +1 @@
-export declare const TestDecisionSection: () => JSX.Element;
+export declare const TestDecisionSection: () => JSX.Element;

package/lib/components/Invoices/TestDecisionSection.js

@@ -1,126 +1,126 @@
-"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.TestDecisionSection = void 0;
-const react_1 = __importDefault(require("react"));
-const DecisionSection_1 = require("./DecisionSection");
-// Test data from the provided JSON
-const testDispute = {
-    "__typename": "ClientInvoiceDispute",
-    "disputeId": 35,
-    "approvedAmount": 450,
-    "chatEnabled": true,
-    "disputeDate": "2025-05-22",
-    "disputeUpdatedDate": "2025-05-23",
-    "freelancerId": 8081,
-    "freelancer": {
-        "__typename": "User",
-        "id": 8081,
-        "email": "andpande@gmail.com",
-        "firstName": "William",
-        "lastName": "Annon"
-    },
-    "status": "Resolved",
-    "finalDecisionOwnerId": 29005,
-    "invoice": {
-        "__typename": "ClientInvoice",
-        "amount": 450,
-        "balanceDue": 450,
-        "clientId": 4433,
-        "dateGenerated": "2025-04-14",
-        "id": 175325,
-        "month": "2025-04-01"
-    },
-    "disputeProjects": [
-        {
-            "__typename": "ClientInvoiceDisputeProject",
-            "id": 37,
-            "projectId": 19158,
-            "disputeAmount": 450,
-            "disputeHours": 30,
-            "disputeType": "Hourly",
-            "disputeReasonCode": "Incorrect Hours Logged",
-            "clientExplanation": "I have a dispute over this expert for the current invoice 175325",
-            "clientDocumentLinks": "https://expert-client-dispute-files.s3.amazonaws.com/project-19158%2Ftesting.pdf,https://expert-client-dispute-files.s3.amazonaws.com/project-19158%2F_Carmelita_Resume-Graduation__1_.docx",
-            "expertDocumentLinks": "https://expert-client-dispute-files.s3.amazonaws.com/project-19158%2F0eb4b31b-b6d8-4cd1-b6ac-39b807ea4577.pdf",
-            "resolutionMode": null,
-            "resolutionType": null,
-            "project": {
-                "__typename": "Project",
-                "name": "Ongoing Ad-Hoc Support",
-                "freelancerRate": null,
-                "clientRate": null,
-                "projectHours": [
-                    {
-                        "__typename": "ProjectHour",
-                        "id": 136605,
-                        "date": "2022-02-11",
-                        "description": "Ate Tacos",
-                        "hours": 8
-                    },
-                    {
-                        "__typename": "ProjectHour",
-                        "id": 136606,
-                        "date": "2022-02-12",
-                        "description": "Worked on project analysis",
-                        "hours": 6
-                    },
-                    {
-                        "__typename": "ProjectHour",
-                        "id": 136607,
-                        "date": "2022-02-13",
-                        "description": "Client meeting and documentation",
-                        "hours": 4
-                    },
-                    {
-                        "__typename": "ProjectHour",
-                        "id": 136608,
-                        "date": "2022-02-14",
-                        "description": "Code review and testing",
-                        "hours": 7
-                    },
-                    {
-                        "__typename": "ProjectHour",
-                        "id": 136609,
-                        "date": "2022-02-15",
-                        "description": "Final deliverable preparation",
-                        "hours": 5
-                    }
-                ]
-            }
-        }
-    ],
-    "lastMessageAt": "2025-05-23T10:56:53.000Z",
-    "messageCount": 5,
-    "client": {
-        "__typename": "Client",
-        "name": "Vessel Advisors"
-    }
-};
-const testUser = {
-    userId: 29005,
-    firstName: "Test",
-    lastName: "User"
-};
-const TestDecisionSection = () => {
-    const mockOnUpdateDispute = (variables) => __awaiter(void 0, void 0, void 0, function* () {
-        console.log('Mock update dispute called with:', variables);
-        return Promise.resolve({ success: true });
-    });
-    const mockUpdateInvoiceMutation = {};
-    return (react_1.default.createElement("div", { className: "p-8 max-w-4xl mx-auto" },
-        react_1.default.createElement("h1", { className: "text-2xl font-bold mb-6" }, "Test Decision Section with Hours Modal"),
-        react_1.default.createElement(DecisionSection_1.DecisionSection, { dispute: testDispute, onUpdateDispute: mockOnUpdateDispute, updateInvoiceMutation: mockUpdateInvoiceMutation, user: testUser })));
-};
-exports.TestDecisionSection = TestDecisionSection;
+"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.TestDecisionSection = void 0;
+const react_1 = __importDefault(require("react"));
+const DecisionSection_1 = require("./DecisionSection");
+// Test data from the provided JSON
+const testDispute = {
+    "__typename": "ClientInvoiceDispute",
+    "disputeId": 35,
+    "approvedAmount": 450,
+    "chatEnabled": true,
+    "disputeDate": "2025-05-22",
+    "disputeUpdatedDate": "2025-05-23",
+    "freelancerId": 8081,
+    "freelancer": {
+        "__typename": "User",
+        "id": 8081,
+        "email": "andpande@gmail.com",
+        "firstName": "William",
+        "lastName": "Annon"
+    },
+    "status": "Resolved",
+    "finalDecisionOwnerId": 29005,
+    "invoice": {
+        "__typename": "ClientInvoice",
+        "amount": 450,
+        "balanceDue": 450,
+        "clientId": 4433,
+        "dateGenerated": "2025-04-14",
+        "id": 175325,
+        "month": "2025-04-01"
+    },
+    "disputeProjects": [
+        {
+            "__typename": "ClientInvoiceDisputeProject",
+            "id": 37,
+            "projectId": 19158,
+            "disputeAmount": 450,
+            "disputeHours": 30,
+            "disputeType": "Hourly",
+            "disputeReasonCode": "Incorrect Hours Logged",
+            "clientExplanation": "I have a dispute over this expert for the current invoice 175325",
+            "clientDocumentLinks": "https://expert-client-dispute-files.s3.amazonaws.com/project-19158%2Ftesting.pdf,https://expert-client-dispute-files.s3.amazonaws.com/project-19158%2F_Carmelita_Resume-Graduation__1_.docx",
+            "expertDocumentLinks": "https://expert-client-dispute-files.s3.amazonaws.com/project-19158%2F0eb4b31b-b6d8-4cd1-b6ac-39b807ea4577.pdf",
+            "resolutionMode": null,
+            "resolutionType": null,
+            "project": {
+                "__typename": "Project",
+                "name": "Ongoing Ad-Hoc Support",
+                "freelancerRate": null,
+                "clientRate": null,
+                "projectHours": [
+                    {
+                        "__typename": "ProjectHour",
+                        "id": 136605,
+                        "date": "2022-02-11",
+                        "description": "Ate Tacos",
+                        "hours": 8
+                    },
+                    {
+                        "__typename": "ProjectHour",
+                        "id": 136606,
+                        "date": "2022-02-12",
+                        "description": "Worked on project analysis",
+                        "hours": 6
+                    },
+                    {
+                        "__typename": "ProjectHour",
+                        "id": 136607,
+                        "date": "2022-02-13",
+                        "description": "Client meeting and documentation",
+                        "hours": 4
+                    },
+                    {
+                        "__typename": "ProjectHour",
+                        "id": 136608,
+                        "date": "2022-02-14",
+                        "description": "Code review and testing",
+                        "hours": 7
+                    },
+                    {
+                        "__typename": "ProjectHour",
+                        "id": 136609,
+                        "date": "2022-02-15",
+                        "description": "Final deliverable preparation",
+                        "hours": 5
+                    }
+                ]
+            }
+        }
+    ],
+    "lastMessageAt": "2025-05-23T10:56:53.000Z",
+    "messageCount": 5,
+    "client": {
+        "__typename": "Client",
+        "name": "Vessel Advisors"
+    }
+};
+const testUser = {
+    userId: 29005,
+    firstName: "Test",
+    lastName: "User"
+};
+const TestDecisionSection = () => {
+    const mockOnUpdateDispute = (variables) => __awaiter(void 0, void 0, void 0, function* () {
+        console.log('Mock update dispute called with:', variables);
+        return Promise.resolve({ success: true });
+    });
+    const mockUpdateInvoiceMutation = {};
+    return (react_1.default.createElement("div", { className: "p-8 max-w-4xl mx-auto" },
+        react_1.default.createElement("h1", { className: "text-2xl font-bold mb-6" }, "Test Decision Section with Hours Modal"),
+        react_1.default.createElement(DecisionSection_1.DecisionSection, { dispute: testDispute, onUpdateDispute: mockOnUpdateDispute, updateInvoiceMutation: mockUpdateInvoiceMutation, user: testUser })));
+};
+exports.TestDecisionSection = TestDecisionSection;