@paro.io/expert-shared-components 1.12.25 → 1.12.27

package/lib/components/Invoices/InvoiceDetails.js

@@ -3,37 +3,52 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.InvoiceDetails = void 0;
+exports.InvoiceDetails = exports.getStatusText = exports.getStatusColor = void 0;
 const react_1 = __importDefault(require("react"));
 const dayjs_1 = __importDefault(require("dayjs"));
 const DisputeProjectCard_1 = require("./DisputeProjectCard");
-const core_1 = require("@material-ui/core");
+const base_ui_1 = require("@paro.io/base-ui");
+const getStatusColor = (status) => {
+    switch (status) {
+        case 'InProgress':
+            return 'warning';
+        case 'UnderReview':
+            return 'info';
+        case 'Resolved':
+            return 'success';
+        default:
+            return 'primary';
+    }
+};
+exports.getStatusColor = getStatusColor;
+const getStatusText = (status) => {
+    switch (status) {
+        case 'InProgress':
+            return 'In Progress';
+        case 'UnderReview':
+            return 'Under Review';
+        case 'Resolved':
+            return 'Resolved';
+        default:
+            return '';
+    }
+};
+exports.getStatusText = getStatusText;
 const InvoiceDetails = ({ invoice, isInternal = false, isClient = false, reactAppUrl = 'https://internal.parodev.io' }) => {
-    var _a, _b, _c, _d, _e, _f, _g;
-    const getStatusColor = (status) => {
-        switch (status) {
-            case 'InProgress':
-                return 'primary';
-            case 'UnderReview':
-                return 'primary';
-            case 'Resolved':
-                return 'success';
-            default:
-                return 'primary';
-        }
-    };
+    var _a, _b, _c, _d, _e, _f, _g, _h;
     const clientInvoiceUrl = `${reactAppUrl}/invoices/${(_a = invoice === null || invoice === void 0 ? void 0 : invoice.invoice) === null || _a === void 0 ? void 0 : _a.id}?month=${(_b = invoice === null || invoice === void 0 ? void 0 : invoice.invoice) === null || _b === void 0 ? void 0 : _b.month}&companyId=${(_c = invoice === null || invoice === void 0 ? void 0 : invoice.invoice) === null || _c === void 0 ? void 0 : _c.clientId}`;
     const internalInvoiceUrl = `${reactAppUrl}/client/${(_d = invoice === null || invoice === void 0 ? void 0 : invoice.invoice) === null || _d === void 0 ? void 0 : _d.clientId}/invoices/${(_e = invoice === null || invoice === void 0 ? void 0 : invoice.invoice) === null || _e === void 0 ? void 0 : _e.id}?month=${(_f = invoice === null || invoice === void 0 ? void 0 : invoice.invoice) === null || _f === void 0 ? void 0 : _f.month}`;
+    const editableDate = (0, dayjs_1.default)().date(7).format("MMM DD");
+    const daysLeft = (7 - (0, dayjs_1.default)().diff((0, dayjs_1.default)((_g = invoice === null || invoice === void 0 ? void 0 : invoice.invoice) === null || _g === void 0 ? void 0 : _g.dateGenerated), 'day')) > 0;
     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(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(base_ui_1.Tag, { color: (0, exports.getStatusColor)(invoice === null || invoice === void 0 ? void 0 : invoice.status), label: (0, exports.getStatusText)(invoice === null || invoice === void 0 ? void 0 : invoice.status), borderRadius: "full", variant: "subtle" }),
+            daysLeft && (invoice === null || invoice === void 0 ? void 0 : invoice.status) !== 'Resolved' && react_1.default.createElement(base_ui_1.Tag, { color: 'success', label: `Editable until ${editableDate}`, borderRadius: "full", variant: "subtle" }),
             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('MMM D, YYYY')),
             (isInternal || isClient) && (react_1.default.createElement("a", { href: isInternal ? internalInvoiceUrl : clientInvoiceUrl, target: "_blank", rel: "noopener noreferrer", className: "text-sm text-[#248384] hover:text-[#195C5C]" }, "View Invoice"))),
-        isInternal && ((_g = invoice === null || invoice === void 0 ? void 0 : invoice.disputeProjects) === null || _g === void 0 ? void 0 : _g.length) > 0 && (react_1.default.createElement("div", { className: "space-y-4" },
+        isInternal && ((_h = invoice === null || invoice === void 0 ? void 0 : invoice.disputeProjects) === null || _h === void 0 ? void 0 : _h.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 }))))))));
 };
 exports.InvoiceDetails = InvoiceDetails;

package/lib/components/Invoices/InvoiceHeader.js

@@ -6,10 +6,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.InvoiceHeader = void 0;
 const react_1 = __importDefault(require("react"));
 const dayjs_1 = __importDefault(require("dayjs"));
+const base_ui_1 = require("@paro.io/base-ui");
+const InvoiceDetails_1 = require("./InvoiceDetails");
 const InvoiceHeader = ({ invoice, isInternal = false, isClient = false }) => {
     var _a, _b, _c, _d, _e, _f;
     const disputeAmount = (_a = invoice === null || invoice === void 0 ? void 0 : invoice.disputeProjects) === null || _a === void 0 ? void 0 : _a.reduce((acc, project) => acc + (project === null || project === void 0 ? void 0 : project.disputeAmount), 0);
-    return (react_1.default.createElement("div", { className: "bg-[#0F172A] w-full text-white px-6 py-4 rounded-t-lg flex items-center justify-between font-arial" },
+    return (react_1.default.createElement("div", { className: "bg-white w-full text-black px-6 py-4 rounded-t-lg flex items-center justify-between font-arial" },
         react_1.default.createElement("div", { className: "flex items-center space-x-4 overflow-x-auto" },
             react_1.default.createElement("div", { className: "flex-shrink-0" },
                 react_1.default.createElement("span", { className: "text-sm font-bold" }, "Dispute #:"),
@@ -32,8 +34,8 @@ const InvoiceHeader = ({ invoice, isInternal = false, isClient = false }) => {
                 react_1.default.createElement("span", { className: "text-sm font-bold" }, "Invoice Date:"),
                 react_1.default.createElement("span", { className: "ml-1" }, (0, dayjs_1.default)((_d = invoice === null || invoice === void 0 ? void 0 : invoice.invoice) === null || _d === void 0 ? void 0 : _d.dateGenerated).format('MMM D, YYYY'))),
             react_1.default.createElement("div", null,
-                react_1.default.createElement("span", { className: "text-sm font-bold" }, "Status:"),
-                react_1.default.createElement("span", { className: "ml-1" }, (invoice === null || invoice === void 0 ? void 0 : invoice.status) === "InProgress" ? "In Progress" : invoice === null || invoice === void 0 ? void 0 : invoice.status)),
+                react_1.default.createElement("span", { className: "text-sm font-bold mr-2" }, "Status:"),
+                react_1.default.createElement(base_ui_1.Tag, { color: (0, InvoiceDetails_1.getStatusColor)(invoice === null || invoice === void 0 ? void 0 : invoice.status), label: (0, InvoiceDetails_1.getStatusText)(invoice === null || invoice === void 0 ? void 0 : invoice.status), borderRadius: "full", variant: "subtle" })),
             (invoice === null || invoice === void 0 ? void 0 : invoice.approvedAmount) >= 0 && (invoice === null || invoice === void 0 ? void 0 : invoice.status) === 'Resolved' && (react_1.default.createElement("div", null,
                 react_1.default.createElement("span", { className: "text-sm font-bold" }, "Approved Amount:"),
                 react_1.default.createElement("span", { className: "ml-1" },

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;

package/lib/components/OrganizationChart/OrganizationChart.d.ts

@@ -1,15 +1,15 @@
-interface OrgChartProps {
-    openModal: boolean;
-    setOpenModal: (openModal: boolean) => void;
-    expertFirms: any;
-    firstName: string;
-    lastName: string;
-    imageUrl?: string;
-    primaryServiceLine: string;
-    city: string;
-    stateAbbreviation: string;
-    paroTenure?: string;
-    isPublicProfile?: boolean;
-}
-export declare const OrganizationChart: ({ openModal, setOpenModal, expertFirms, firstName, lastName, imageUrl, primaryServiceLine, city, stateAbbreviation, paroTenure, isPublicProfile }: OrgChartProps) => JSX.Element;
-export {};
+interface OrgChartProps {
+    openModal: boolean;
+    setOpenModal: (openModal: boolean) => void;
+    expertFirms: any;
+    firstName: string;
+    lastName: string;
+    imageUrl?: string;
+    primaryServiceLine: string;
+    city: string;
+    stateAbbreviation: string;
+    paroTenure?: string;
+    isPublicProfile?: boolean;
+}
+export declare const OrganizationChart: ({ openModal, setOpenModal, expertFirms, firstName, lastName, imageUrl, primaryServiceLine, city, stateAbbreviation, paroTenure, isPublicProfile }: OrgChartProps) => JSX.Element;
+export {};