npm - @paro.io/expert-shared-components - Versions diffs - 1.14.16 → 1.14.17 - Mend

@paro.io/expert-shared-components 1.14.16 → 1.14.17

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 (6) hide show

package/lib/components/DiscussionThread/DiscussionThread.d.ts +25 -25
package/lib/components/DiscussionThread/DiscussionThread.js +137 -137
package/lib/components/DiscussionThread/index.d.ts +1 -1
package/lib/components/DiscussionThread/index.js +5 -5
package/lib/components/Invoices/DiscussionSection.js +13 -0
package/package.json +1 -1

package/lib/components/DiscussionThread/DiscussionThread.d.ts CHANGED Viewed

@@ -1,25 +1,25 @@
-import React from "react";
-interface ChatMessages {
-    messageId: number;
-    disputeId: number;
-    sender: {
-        id: number;
-        email: string;
-        firstName: string;
-        lastName: string;
-        userTypeId: number;
-    };
-    messageText: string;
-    visibility: "ALL" | "INTERNAL_ONLY" | "CLIENT_INTERNAL_ONLY" | "EXPERT_INTERNAL_ONLY";
-    createdAt: string;
-    updatedAt: string;
-    isDeleted: boolean;
-}
-interface DiscussionThreadProps {
-    currentUser: any;
-    initialThreads: ChatMessages[] | [];
-    createDisputeChatMessage: any;
-    disputeId: number;
-}
-export declare const DiscussionThread: ({ currentUser, initialThreads, createDisputeChatMessage, disputeId, }: DiscussionThreadProps) => React.JSX.Element;
-export {};
+import React from "react";
+interface ChatMessages {
+    messageId: number;
+    disputeId: number;
+    sender: {
+        id: number;
+        email: string;
+        firstName: string;
+        lastName: string;
+        userTypeId: number;
+    };
+    messageText: string;
+    visibility: "ALL" | "INTERNAL_ONLY" | "CLIENT_INTERNAL_ONLY" | "EXPERT_INTERNAL_ONLY";
+    createdAt: string;
+    updatedAt: string;
+    isDeleted: boolean;
+}
+interface DiscussionThreadProps {
+    currentUser: any;
+    initialThreads: ChatMessages[] | [];
+    createDisputeChatMessage: any;
+    disputeId: number;
+}
+export declare const DiscussionThread: ({ currentUser, initialThreads, createDisputeChatMessage, disputeId, }: DiscussionThreadProps) => React.JSX.Element;
+export {};

package/lib/components/DiscussionThread/DiscussionThread.js CHANGED Viewed

@@ -1,137 +1,137 @@
-"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 __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.DiscussionThread = void 0;
-const react_1 = __importStar(require("react"));
-const base_ui_1 = require("@paro.io/base-ui");
-const DiscussionThread = ({ currentUser, initialThreads, createDisputeChatMessage, disputeId, }) => {
-    const [messages, setMessages] = (0, react_1.useState)(initialThreads);
-    const [sending, setSending] = (0, react_1.useState)(false);
-    const [comment, setComment] = (0, react_1.useState)("");
-    const threadsEndRef = (0, react_1.useRef)(null);
-    const didMountRef = (0, react_1.useRef)(false);
-    // Auto scroll to bottom when messages change
-    (0, react_1.useEffect)(() => {
-        if (didMountRef.current) {
-            if (threadsEndRef.current) {
-                threadsEndRef.current.scrollIntoView({ behavior: "smooth" });
-            }
-        }
-        else {
-            didMountRef.current = true;
-        }
-    }, [messages]);
-    const handleSend = () => __awaiter(void 0, void 0, void 0, function* () {
-        setSending(true);
-        try {
-            if (comment) {
-                const chatInput = {
-                    disputeId: disputeId,
-                    messageText: comment,
-                    senderId: currentUser === null || currentUser === void 0 ? void 0 : currentUser.userId,
-                    visibility: "ALL"
-                };
-                yield createDisputeChatMessage({
-                    variables: {
-                        input: chatInput
-                    }
-                }).then((res) => {
-                    const newMsg = {
-                        messageId: res.data.createDisputeChatMessage.messageId,
-                        disputeId: res.data.createDisputeChatMessage.disputeId,
-                        sender: res.data.createDisputeChatMessage.sender,
-                        messageText: res.data.createDisputeChatMessage.messageText,
-                        visibility: res.data.createDisputeChatMessage.visibility,
-                        createdAt: res.data.createDisputeChatMessage.createdAt,
-                        updatedAt: res.data.createDisputeChatMessage.updatedAt,
-                        isDeleted: res.data.createDisputeChatMessage.isDeleted,
-                    };
-                    setMessages([...messages, newMsg]);
-                    setComment("");
-                }).catch((error) => {
-                    console.error("Error creating dispute chat message:", error);
-                });
-            }
-        }
-        catch (error) {
-            console.error("Error sending message:", error);
-        }
-        finally {
-            setSending(false);
-        }
-    });
-    const handleKeyPress = (e) => {
-        if (e.key === "Enter" && !e.shiftKey) {
-            e.preventDefault();
-            handleSend();
-        }
-    };
-    const formatTime = (timestamp) => {
-        const date = new Date(timestamp);
-        return date.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' }) +
-            ' · ' + date.toLocaleDateString([], { month: 'short', day: 'numeric', year: 'numeric' });
-    };
-    const getInitials = (name) => {
-        return name
-            .split(' ')
-            .map(word => word[0])
-            .join('')
-            .toUpperCase()
-            .substring(0, 2);
-    };
-    return (react_1.default.createElement("div", { className: "flex flex-col w-full rounded-lg bg-white h-auto" },
-        react_1.default.createElement("div", { className: `py-3 flex items-center` },
-            react_1.default.createElement("div", { className: "font-semibold text-gray-800 capitalize" }, "Discussion Thread")),
-        messages.length ? react_1.default.createElement("div", { className: "flex-1 max-h-[30vh] overflow-y-auto border rounded-md p-2" },
-            messages.map((message) => {
-                const isCurrentUser = currentUser.userId === message.sender.id;
-                const userName = message.sender.firstName + message.sender.lastName;
-                const timestamp = message.updatedAt ? message.updatedAt : message.createdAt;
-                return (react_1.default.createElement("div", { key: message.messageId, className: `flex mb-4 ${isCurrentUser ? 'justify-end' : 'justify-start'}` },
-                    !isCurrentUser && (react_1.default.createElement("div", { className: "flex-shrink-0 mr-2" },
-                        react_1.default.createElement("div", { className: "h-8 w-8 rounded-full bg-gray-400 flex items-center justify-center text-white text-xs font-medium bg-[#5f4508]" }, getInitials(userName || 'User')))),
-                    react_1.default.createElement("div", { className: `ml-1 min-w-min max-w-[75%] break-words` },
-                        !isCurrentUser && (react_1.default.createElement("div", { className: "text-xs text-gray-500 font-medium mb-1" }, userName || 'Unknown User')),
-                        react_1.default.createElement("div", { className: `px-4 py-2 rounded-lg ${isCurrentUser
-                                ? 'bg-[#dbefef] rounded-br-none'
-                                : 'bg-[#f9d8a7] border rounded-bl-none'}` }, message.messageText),
-                        react_1.default.createElement("div", { className: "text-xs text-gray-500 mt-1" }, formatTime(timestamp)))));
-            }),
-            react_1.default.createElement("div", { ref: threadsEndRef })) : react_1.default.createElement(react_1.default.Fragment, null),
-        react_1.default.createElement("div", { className: "py-3" },
-            react_1.default.createElement("div", { className: "flex items-center" },
-                react_1.default.createElement("textarea", { value: comment, onChange: (e) => setComment(e.target.value), onKeyDown: handleKeyPress, placeholder: "Type your message here...", className: "flex-1 border rounded-lg px-3 py-2 resize-none focus:outline-none focus:ring-2 focus:ring-blue-500", rows: 1 }),
-                react_1.default.createElement(base_ui_1.Button, { label: "Send", onClick: handleSend, disabled: !comment.trim(), isLoading: sending, color: "primary", className: "ml-2 px-4 py-2" })))));
-};
-exports.DiscussionThread = DiscussionThread;
+"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 __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.DiscussionThread = void 0;
+const react_1 = __importStar(require("react"));
+const base_ui_1 = require("@paro.io/base-ui");
+const DiscussionThread = ({ currentUser, initialThreads, createDisputeChatMessage, disputeId, }) => {
+    const [messages, setMessages] = (0, react_1.useState)(initialThreads);
+    const [sending, setSending] = (0, react_1.useState)(false);
+    const [comment, setComment] = (0, react_1.useState)("");
+    const threadsEndRef = (0, react_1.useRef)(null);
+    const didMountRef = (0, react_1.useRef)(false);
+    // Auto scroll to bottom when messages change
+    (0, react_1.useEffect)(() => {
+        if (didMountRef.current) {
+            if (threadsEndRef.current) {
+                threadsEndRef.current.scrollIntoView({ behavior: "smooth" });
+            }
+        }
+        else {
+            didMountRef.current = true;
+        }
+    }, [messages]);
+    const handleSend = () => __awaiter(void 0, void 0, void 0, function* () {
+        setSending(true);
+        try {
+            if (comment) {
+                const chatInput = {
+                    disputeId: disputeId,
+                    messageText: comment,
+                    senderId: currentUser === null || currentUser === void 0 ? void 0 : currentUser.userId,
+                    visibility: "ALL"
+                };
+                yield createDisputeChatMessage({
+                    variables: {
+                        input: chatInput
+                    }
+                }).then((res) => {
+                    const newMsg = {
+                        messageId: res.data.createDisputeChatMessage.messageId,
+                        disputeId: res.data.createDisputeChatMessage.disputeId,
+                        sender: res.data.createDisputeChatMessage.sender,
+                        messageText: res.data.createDisputeChatMessage.messageText,
+                        visibility: res.data.createDisputeChatMessage.visibility,
+                        createdAt: res.data.createDisputeChatMessage.createdAt,
+                        updatedAt: res.data.createDisputeChatMessage.updatedAt,
+                        isDeleted: res.data.createDisputeChatMessage.isDeleted,
+                    };
+                    setMessages([...messages, newMsg]);
+                    setComment("");
+                }).catch((error) => {
+                    console.error("Error creating dispute chat message:", error);
+                });
+            }
+        }
+        catch (error) {
+            console.error("Error sending message:", error);
+        }
+        finally {
+            setSending(false);
+        }
+    });
+    const handleKeyPress = (e) => {
+        if (e.key === "Enter" && !e.shiftKey) {
+            e.preventDefault();
+            handleSend();
+        }
+    };
+    const formatTime = (timestamp) => {
+        const date = new Date(timestamp);
+        return date.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' }) +
+            ' · ' + date.toLocaleDateString([], { month: 'short', day: 'numeric', year: 'numeric' });
+    };
+    const getInitials = (name) => {
+        return name
+            .split(' ')
+            .map(word => word[0])
+            .join('')
+            .toUpperCase()
+            .substring(0, 2);
+    };
+    return (react_1.default.createElement("div", { className: "flex flex-col w-full rounded-lg bg-white h-auto" },
+        react_1.default.createElement("div", { className: `py-3 flex items-center` },
+            react_1.default.createElement("div", { className: "font-semibold text-gray-800 capitalize" }, "Discussion Thread")),
+        messages.length ? react_1.default.createElement("div", { className: "flex-1 max-h-[30vh] overflow-y-auto border rounded-md p-2" },
+            messages.map((message) => {
+                const isCurrentUser = currentUser.userId === message.sender.id;
+                const userName = message.sender.firstName + message.sender.lastName;
+                const timestamp = message.updatedAt ? message.updatedAt : message.createdAt;
+                return (react_1.default.createElement("div", { key: message.messageId, className: `flex mb-4 ${isCurrentUser ? 'justify-end' : 'justify-start'}` },
+                    !isCurrentUser && (react_1.default.createElement("div", { className: "flex-shrink-0 mr-2" },
+                        react_1.default.createElement("div", { className: "h-8 w-8 rounded-full bg-gray-400 flex items-center justify-center text-white text-xs font-medium bg-[#5f4508]" }, getInitials(userName || 'User')))),
+                    react_1.default.createElement("div", { className: `ml-1 min-w-min max-w-[75%] break-words` },
+                        !isCurrentUser && (react_1.default.createElement("div", { className: "text-xs text-gray-500 font-medium mb-1" }, userName || 'Unknown User')),
+                        react_1.default.createElement("div", { className: `px-4 py-2 rounded-lg ${isCurrentUser
+                                ? 'bg-[#dbefef] rounded-br-none'
+                                : 'bg-[#f9d8a7] border rounded-bl-none'}` }, message.messageText),
+                        react_1.default.createElement("div", { className: "text-xs text-gray-500 mt-1" }, formatTime(timestamp)))));
+            }),
+            react_1.default.createElement("div", { ref: threadsEndRef })) : react_1.default.createElement(react_1.default.Fragment, null),
+        react_1.default.createElement("div", { className: "py-3" },
+            react_1.default.createElement("div", { className: "flex items-center" },
+                react_1.default.createElement("textarea", { value: comment, onChange: (e) => setComment(e.target.value), onKeyDown: handleKeyPress, placeholder: "Type your message here...", className: "flex-1 border rounded-lg px-3 py-2 resize-none focus:outline-none focus:ring-2 focus:ring-blue-500", rows: 1 }),
+                react_1.default.createElement(base_ui_1.Button, { label: "Send", onClick: handleSend, disabled: !comment.trim(), isLoading: sending, color: "primary", className: "ml-2 px-4 py-2" })))));
+};
+exports.DiscussionThread = DiscussionThread;

package/lib/components/DiscussionThread/index.d.ts CHANGED Viewed

	@@ -1 +1 @@
1	- export { DiscussionThread } from './DiscussionThread';
1	+ export { DiscussionThread } from './DiscussionThread';

package/lib/components/DiscussionThread/index.js CHANGED Viewed

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

package/lib/components/Invoices/DiscussionSection.js CHANGED Viewed

@@ -187,6 +187,19 @@ const DiscussionSection = ({ disputeId, escalationNumber, currentUser, messages,
                                     react_1.default.createElement("input", { type: "radio", checked: true, readOnly: true, className: "form-radio text-[#248384]" }),
                                     react_1.default.createElement("span", { className: "text-sm text-[#333333]" }, "Client Only"))),
                                 internalEscalationTo === 'both' && (react_1.default.createElement(react_1.default.Fragment, null,
+                                    react_1.default.createElement("label", { className: "flex items-center space-x-2 cursor-pointer" },
+                                        react_1.default.createElement("input", { type: "radio", checked: visibility === 'EXPERT_INTERNAL_ONLY', onChange: () => setVisibility('EXPERT_INTERNAL_ONLY'), className: "form-radio text-[#248384]" }),
+                                        react_1.default.createElement("span", { className: "text-sm text-[#333333]" }, "Expert Only")),
+                                    react_1.default.createElement("label", { className: "flex items-center space-x-2 cursor-pointer" },
+                                        react_1.default.createElement("input", { type: "radio", checked: visibility === 'CLIENT_INTERNAL_ONLY', onChange: () => setVisibility('CLIENT_INTERNAL_ONLY'), className: "form-radio text-[#248384]" }),
+                                        react_1.default.createElement("span", { className: "text-sm text-[#333333]" }, "Client Only")),
+                                    react_1.default.createElement("label", { className: "flex items-center space-x-2 cursor-pointer" },
+                                        react_1.default.createElement("input", { type: "radio", checked: visibility === 'INTERNAL_ONLY', onChange: () => setVisibility('INTERNAL_ONLY'), className: "form-radio text-[#248384]" }),
+                                        react_1.default.createElement("span", { className: "text-sm text-[#333333]" }, "Internal Only")),
+                                    react_1.default.createElement("label", { className: "flex items-center space-x-2 cursor-pointer" },
+                                        react_1.default.createElement("input", { type: "radio", checked: visibility === 'ALL', onChange: () => setVisibility('ALL'), className: "form-radio text-[#248384]" }),
+                                        react_1.default.createElement("span", { className: "text-sm text-[#333333]" }, "All")))),
+                                !internalEscalationTo && !clientEscalationTo && (react_1.default.createElement(react_1.default.Fragment, null,
                                     react_1.default.createElement("label", { className: "flex items-center space-x-2 cursor-pointer" },
                                         react_1.default.createElement("input", { type: "radio", checked: visibility === 'EXPERT_INTERNAL_ONLY', onChange: () => setVisibility('EXPERT_INTERNAL_ONLY'), className: "form-radio text-[#248384]" }),
                                         react_1.default.createElement("span", { className: "text-sm text-[#333333]" }, "Expert Only")),

package/package.json CHANGED Viewed

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