@myrjfa/ui 1.0.9 → 1.0.10

package/dist/chat/ChatSidebar.js

@@ -7,18 +7,17 @@ import { ScrollArea } from "../misc/scroll-area";
 import { ConversationList } from "./ConversationList";
 import { NewChatDialog } from "./dialogs/NewChatDialog";
 import { NewGroupDialog } from "./dialogs/NewGroupDialog";
-export function ChatSidebar(_a) {
-    var conversations = _a.conversations, activeConversation = _a.activeConversation, onSelect = _a.onSelect, isConnected = _a.isConnected, currentUserId = _a.currentUserId, onlineUsers = _a.onlineUsers, typingUsers = _a.typingUsers;
-    var _b = useState(false), showNewChat = _b[0], setShowNewChat = _b[1];
-    var _c = useState(""), search = _c[0], setSearch = _c[1];
-    var filteredConversations = Array.isArray(conversations)
-        ? conversations.filter(function (c) {
+export function ChatSidebar({ conversations, activeConversation, onSelect, isConnected, currentUserId, onlineUsers, typingUsers }) {
+    const [showNewChat, setShowNewChat] = useState(false);
+    const [search, setSearch] = useState("");
+    const filteredConversations = Array.isArray(conversations)
+        ? conversations.filter(c => {
             var _a;
             if (!search)
                 return true;
-            var name = c.name || ((_a = c.participants.find(function (p) { return p.userId !== currentUserId; })) === null || _a === void 0 ? void 0 : _a.userId) || "";
+            const name = c.name || ((_a = c.participants.find(p => p.userId !== currentUserId)) === null || _a === void 0 ? void 0 : _a.userId) || "";
             return name.toLowerCase().includes(search.toLowerCase());
         })
         : [];
-    return (_jsxs("div", { className: "w-full md:w-96 md:min-w-[384px] border-r border-gray-200 dark:border-gray-800 bg-white dark:bg-gray-900 flex flex-col h-full ".concat(activeConversation ? "hidden md:flex" : "flex"), children: [_jsxs("div", { className: "flex items-center justify-between p-4 border-b border-gray-200 dark:border-gray-800", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(MessageCircle, { className: "w-6 h-6 text-teal-500" }), _jsx("h1", { className: "text-xl font-bold text-gray-900 dark:text-gray-100", children: "Messages" })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "flex items-center gap-1", children: isConnected ? (_jsx(Wifi, { className: "w-4 h-4 text-green-500" })) : (_jsx(WifiOff, { className: "w-4 h-4 text-red-500" })) }), _jsx("button", { onClick: function () { return setShowNewChat(!showNewChat); }, className: "p-2 hover:bg-gray-100 dark:hover:bg-gray-800 rounded-full transition-colors text-gray-600 dark:text-gray-400 cursor-pointer", children: _jsx(Plus, { className: "w-5 h-5" }) })] })] }), _jsx("div", { className: "p-3", children: _jsx(Input, { placeholder: "Search conversations...", value: search, onChange: function (e) { return setSearch(e.target.value); }, className: "bg-gray-100 dark:bg-gray-800 border-none" }) }), showNewChat && (_jsxs("div", { className: "px-3 pb-3 flex gap-2", children: [_jsx(NewChatDialog, {}), _jsx(NewGroupDialog, {})] })), _jsx(ScrollArea, { className: "flex-1", children: _jsx(ConversationList, { conversations: filteredConversations, activeConversation: activeConversation, onSelect: onSelect, currentUserId: currentUserId, onlineUsers: onlineUsers, typingUsers: typingUsers }) })] }));
+    return (_jsxs("div", { className: `w-full md:w-96 md:min-w-[384px] border-r border-gray-200 dark:border-gray-800 bg-white dark:bg-gray-900 flex flex-col h-full ${activeConversation ? "hidden md:flex" : "flex"}`, children: [_jsxs("div", { className: "flex items-center justify-between p-4 border-b border-gray-200 dark:border-gray-800", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(MessageCircle, { className: "w-6 h-6 text-teal-500" }), _jsx("h1", { className: "text-xl font-bold text-gray-900 dark:text-gray-100", children: "Messages" })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "flex items-center gap-1", children: isConnected ? (_jsx(Wifi, { className: "w-4 h-4 text-green-500" })) : (_jsx(WifiOff, { className: "w-4 h-4 text-red-500" })) }), _jsx("button", { onClick: () => setShowNewChat(!showNewChat), className: "p-2 hover:bg-gray-100 dark:hover:bg-gray-800 rounded-full transition-colors text-gray-600 dark:text-gray-400 cursor-pointer", children: _jsx(Plus, { className: "w-5 h-5" }) })] })] }), _jsx("div", { className: "p-3", children: _jsx(Input, { placeholder: "Search conversations...", value: search, onChange: (e) => setSearch(e.target.value), className: "bg-gray-100 dark:bg-gray-800 border-none" }) }), showNewChat && (_jsxs("div", { className: "px-3 pb-3 flex gap-2", children: [_jsx(NewChatDialog, {}), _jsx(NewGroupDialog, {})] })), _jsx(ScrollArea, { className: "flex-1", children: _jsx(ConversationList, { conversations: filteredConversations, activeConversation: activeConversation, onSelect: onSelect, currentUserId: currentUserId, onlineUsers: onlineUsers, typingUsers: typingUsers }) })] }));
 }

package/dist/chat/ConversationList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConversationList.d.ts","sourceRoot":"","sources":["../../src/chat/ConversationList.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAEvE,UAAU,aAAa;IACnB,aAAa,EAAE,YAAY,EAAE,CAAC;IAC9B,kBAAkB,EAAE,YAAY,GAAG,IAAI,CAAC;IACxC,QAAQ,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAC;IACvC,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC1B,WAAW,CAAC,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,EAAE,CAAC,CAAC;CACvC;AAED,wBAAgB,gBAAgB,CAAC,EAC7B,aAAa,EACb,kBAAkB,EAClB,QAAQ,EACR,aAAa,EACb,WAAuB,EACvB,WAAuB,EAC1B,EAAE,aAAa,2CA6Gf"}
+{"version":3,"file":"ConversationList.d.ts","sourceRoot":"","sources":["../../src/chat/ConversationList.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAEvE,UAAU,aAAa;IACnB,aAAa,EAAE,YAAY,EAAE,CAAC;IAC9B,kBAAkB,EAAE,YAAY,GAAG,IAAI,CAAC;IACxC,QAAQ,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAC;IACvC,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC1B,WAAW,CAAC,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,EAAE,CAAC,CAAC;CACvC;AAED,wBAAgB,gBAAgB,CAAC,EAC7B,aAAa,EACb,kBAAkB,EAClB,QAAQ,EACR,aAAa,EACb,WAAuB,EACvB,WAAuB,EAC1B,EAAE,aAAa,2CA4Hf"}

package/dist/chat/ConversationList.js

@@ -1,14 +1,13 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Users, User, MessageCircle } from "lucide-react";
+import { Users, User, MessageCircle, ListTodo, ReceiptText, AtSign } from "lucide-react";
 import { Avatar, AvatarFallback, AvatarImage } from "../misc/avatar";
 import { cn } from "@myrjfa/state/dist/lib/utils";
-export function ConversationList(_a) {
-    var conversations = _a.conversations, activeConversation = _a.activeConversation, onSelect = _a.onSelect, currentUserId = _a.currentUserId, _b = _a.onlineUsers, onlineUsers = _b === void 0 ? new Set() : _b, _c = _a.typingUsers, typingUsers = _c === void 0 ? new Map() : _c;
+export function ConversationList({ conversations, activeConversation, onSelect, currentUserId, onlineUsers = new Set(), typingUsers = new Map() }) {
     function getDisplayName(conv) {
         if (conv.type === "group")
             return conv.name || "Group Chat";
-        var other = conv.participants.find(function (p) { return p.userId !== currentUserId; });
+        const other = conv.participants.find((p) => p.userId !== currentUserId);
         // We might want to fetch user details if name is missing? 
         // For now, assume ID or fetched data. 
         // In real app, we should populate this.
@@ -17,52 +16,55 @@ export function ConversationList(_a) {
     function getDisplayImage(conv) {
         if (conv.type === "group")
             return conv.image || "";
-        var other = conv.participants.find(function (p) { return p.userId !== currentUserId; });
+        const other = conv.participants.find((p) => p.userId !== currentUserId);
         return (other === null || other === void 0 ? void 0 : other.profilePic) || "";
     }
     // Identify the "other" user for avatar
     function getOtherParticipantId(conv) {
         if (conv.type === "group")
             return null;
-        var other = conv.participants.find(function (p) { return p.userId !== currentUserId; });
+        const other = conv.participants.find((p) => p.userId !== currentUserId);
         return other === null || other === void 0 ? void 0 : other.userId;
     }
     function isOtherOnline(conv) {
         if (conv.type !== "individual")
             return false;
-        var otherAndId = getOtherParticipantId(conv);
+        const otherAndId = getOtherParticipantId(conv);
         return otherAndId ? onlineUsers.has(otherAndId) : false;
     }
     function formatTime(dateStr) {
         if (!dateStr)
             return "";
-        var date = new Date(dateStr);
-        var now = new Date();
-        var diff = now.getTime() - date.getTime();
+        const date = new Date(dateStr);
+        const now = new Date();
+        const diff = now.getTime() - date.getTime();
         if (diff < 60000)
             return "Just now";
         if (diff < 3600000)
-            return "".concat(Math.floor(diff / 60000), "m");
+            return `${Math.floor(diff / 60000)}m`;
         if (diff < 86400000)
             return date.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" });
         return date.toLocaleDateString([], { month: "short", day: "numeric" });
     }
     function getTypingText(convId) {
-        var users = typingUsers.get(convId);
+        const users = typingUsers.get(convId);
         if (!users || users.length === 0)
             return null;
         if (users.length === 1)
             return "typing...";
-        return "".concat(users.length, " people typing...");
+        return `${users.length} people typing...`;
     }
     if (conversations.length === 0) {
         return (_jsxs("div", { className: "flex flex-col items-center justify-center h-full text-gray-400 p-8", children: [_jsx(MessageCircle, { className: "w-16 h-16 mb-4 opacity-30" }), _jsx("p", { className: "text-lg font-medium", children: "No conversations yet" }), _jsx("p", { className: "text-sm mt-1", children: "Start a new chat to begin" })] }));
     }
-    return (_jsx("div", { className: "flex-1 overflow-y-auto", children: conversations.map(function (conv) {
+    return (_jsx("div", { className: "flex-1 overflow-y-auto", children: conversations.map((conv) => {
             var _a, _b;
-            var isActive = (activeConversation === null || activeConversation === void 0 ? void 0 : activeConversation._id) === conv._id;
-            var typing = getTypingText(conv._id);
-            var isOnline = isOtherOnline(conv);
-            return (_jsxs("button", { onClick: function () { return onSelect(conv); }, className: cn("w-full flex items-center gap-3 p-4 hover:bg-gray-50 dark:hover:bg-gray-800/50 transition-all duration-200 border-b border-gray-100 dark:border-gray-800", isActive ? "bg-indigo-50 dark:bg-indigo-950/30 border-l-4 border-l-indigo-500" : "border-l-4 border-l-transparent"), children: [_jsxs("div", { className: "relative", children: [_jsxs(Avatar, { children: [_jsx(AvatarImage, { src: getDisplayImage(conv) }), _jsx(AvatarFallback, { className: conv.type === "group" ? "bg-indigo-100 text-indigo-600" : "bg-teal-100 text-teal-600", children: conv.type === "group" ? _jsx(Users, { className: "w-4 h-4" }) : _jsx(User, { className: "w-4 h-4" }) })] }), isOnline && (_jsx("span", { className: "absolute bottom-0 right-0 w-3 h-3 bg-green-500 border-2 border-white dark:border-gray-900 rounded-full" }))] }), _jsxs("div", { className: "flex-1 min-w-0 text-left", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "font-semibold text-gray-900 dark:text-gray-100 truncate text-sm", children: getDisplayName(conv) }), _jsx("span", { className: "text-xs text-gray-400 ml-2 whitespace-nowrap", children: formatTime((_a = conv.lastMessage) === null || _a === void 0 ? void 0 : _a.sentAt) })] }), _jsx("p", { className: "text-xs text-gray-500 dark:text-gray-400 truncate mt-0.5", children: typing ? (_jsx("span", { className: "text-indigo-500 italic", children: typing })) : (((_b = conv.lastMessage) === null || _b === void 0 ? void 0 : _b.content) || "No messages yet") })] })] }, conv._id));
+            const isActive = (activeConversation === null || activeConversation === void 0 ? void 0 : activeConversation._id) === conv._id;
+            const typing = getTypingText(conv._id);
+            const isOnline = isOtherOnline(conv);
+            const participant = conv.participants.find(p => p.userId === currentUserId);
+            const unread = (participant === null || participant === void 0 ? void 0 : participant.unreadCounts) || { messages: 0, milestones: 0, expenses: 0, mentions: 0 };
+            const totalUnread = unread.messages + unread.milestones + unread.expenses + unread.mentions;
+            return (_jsxs("button", { onClick: () => onSelect(conv), className: cn("w-full flex items-center gap-3 p-4 hover:bg-gray-50 dark:hover:bg-gray-800/50 transition-all duration-200 border-b border-gray-100 dark:border-gray-800", isActive ? "bg-indigo-50 dark:bg-indigo-950/30 border-l-4 border-l-indigo-500" : "border-l-4 border-l-transparent"), children: [_jsxs("div", { className: "relative", children: [_jsxs(Avatar, { children: [_jsx(AvatarImage, { src: getDisplayImage(conv) }), _jsx(AvatarFallback, { className: conv.type === "group" ? "bg-indigo-100 text-indigo-600" : "bg-teal-100 text-teal-600", children: conv.type === "group" ? _jsx(Users, { className: "w-4 h-4" }) : _jsx(User, { className: "w-4 h-4" }) })] }), isOnline && (_jsx("span", { className: "absolute bottom-0 right-0 w-3 h-3 bg-green-500 border-2 border-white dark:border-gray-900 rounded-full" }))] }), _jsxs("div", { className: "flex-1 min-w-0 text-left", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "font-semibold text-gray-900 dark:text-gray-100 truncate text-sm", children: getDisplayName(conv) }), _jsx("span", { className: "text-xs text-gray-400 ml-2 whitespace-nowrap", children: formatTime((_a = conv.lastMessage) === null || _a === void 0 ? void 0 : _a.sentAt) })] }), _jsxs("div", { className: "flex items-center justify-between gap-2", children: [_jsx("p", { className: "text-xs text-gray-500 dark:text-gray-400 truncate mt-0.5 flex-1", children: typing ? (_jsx("span", { className: "text-indigo-500 italic", children: typing })) : (((_b = conv.lastMessage) === null || _b === void 0 ? void 0 : _b.content) || "No messages yet") }), totalUnread > 0 && (_jsxs("div", { className: "flex gap-1 items-center shrink-0 mt-0.5", children: [unread.mentions > 0 && _jsx(AtSign, { className: "w-3 h-3 text-red-500" }), unread.milestones > 0 && _jsx(ListTodo, { className: "w-3 h-3 text-teal-500" }), unread.expenses > 0 && _jsx(ReceiptText, { className: "w-3 h-3 text-orange-500" }), _jsx("span", { className: "bg-indigo-600 text-white text-[10px] font-bold px-1.5 py-0.5 rounded-full min-w-[20px] text-center shadow-sm", children: totalUnread })] }))] })] })] }, conv._id));
         }) }));
 }

package/dist/chat/ExpensePanel.d.ts

@@ -2,7 +2,10 @@ interface ExpensePanelProps {
     conversationId: string;
     currentUserId: string;
     isFullScreen?: boolean;
+    isFeatureEnabled?: boolean;
+    isAdmin?: boolean;
+    onEnableFeature?: () => void;
 }
-export declare function ExpensePanel({ conversationId, currentUserId, isFullScreen }: ExpensePanelProps): import("react/jsx-runtime").JSX.Element;
+export declare function ExpensePanel({ conversationId, currentUserId, isFullScreen, isFeatureEnabled, isAdmin, onEnableFeature }: ExpensePanelProps): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=ExpensePanel.d.ts.map

package/dist/chat/ExpensePanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExpensePanel.d.ts","sourceRoot":"","sources":["../../src/chat/ExpensePanel.tsx"],"names":[],"mappings":"AASA,UAAU,iBAAiB;IACvB,cAAc,EAAE,MAAM,CAAC;IACvB,aAAa,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,wBAAgB,YAAY,CAAC,EAAE,cAAc,EAAE,aAAa,EAAE,YAAoB,EAAE,EAAE,iBAAiB,2CAwStG"}
+{"version":3,"file":"ExpensePanel.d.ts","sourceRoot":"","sources":["../../src/chat/ExpensePanel.tsx"],"names":[],"mappings":"AAiBA,UAAU,iBAAiB;IACvB,cAAc,EAAE,MAAM,CAAC;IACvB,aAAa,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;CAChC;AAED,wBAAgB,YAAY,CAAC,EACzB,cAAc,EACd,aAAa,EACb,YAAoB,EACpB,gBAAwB,EACxB,OAAe,EACf,eAAe,EAClB,EAAE,iBAAiB,2CAw0BnB"}