@linktr.ee/messaging-react 1.6.0 → 1.6.2

package/dist/index.js

@@ -1,6 +1,6 @@
-import { jsx as e, jsxs as c, Fragment as oe } from "react/jsx-runtime";
+import { jsx as e, jsxs as d, Fragment as oe } from "react/jsx-runtime";
 import D from "classnames";
-import X, { createContext as ve, useContext as we, useCallback as U, useState as I, useRef as H, useEffect as G } from "react";
+import X, { createContext as ve, useContext as we, useCallback as U, useState as E, useRef as H, useEffect as G } from "react";
 import { StreamChatService as Ee } from "@linktr.ee/messaging-core";
 import { Chat as Ie, useChatContext as ye, ChannelList as Se, Channel as Re, useChannelStateContext as ue, Window as ke, MessageList as Te, MessageInput as Pe } from "stream-chat-react";
 import { NotePencilIcon as De, XIcon as me, ArrowLeftIcon as Me, DotsThreeIcon as Oe, SpinnerGapIcon as ee, SignOutIcon as Ue, ProhibitInsetIcon as ie, FlagIcon as Fe, MagnifyingGlassIcon as pe, ChatCircleDotsIcon as ce } from "@phosphor-icons/react";
@@ -20,50 +20,50 @@ const he = ve({
   user: s,
   serviceConfig: n,
   apiKey: l,
-  capabilities: a = {},
-  customization: d = {},
-  debug: i = !1
+  capabilities: i = {},
+  customization: c = {},
+  debug: a = !1
 }) => {
-  const r = U(
-    (v, ...M) => {
-      i && console.log(`🔥 [MessagingProvider] ${v}`, ...M);
+  const o = U(
+    (w, ...M) => {
+      a && console.log(`🔥 [MessagingProvider] ${w}`, ...M);
     },
-    [i]
+    [a]
   );
-  r("🔄 RENDER START", {
+  o("🔄 RENDER START", {
     userId: s == null ? void 0 : s.id,
     apiKey: (l == null ? void 0 : l.substring(0, 8)) + "...",
     serviceConfig: !!n,
-    capabilities: Object.keys(a),
-    customization: Object.keys(d)
+    capabilities: Object.keys(i),
+    customization: Object.keys(c)
   });
-  const [o, w] = I(null), [u, N] = I(null), [m, E] = I(!1), [x, h] = I(!1), [C, S] = I(null), O = H(!1), y = H({
+  const [r, b] = E(null), [u, g] = E(null), [m, I] = E(!1), [N, h] = E(!1), [v, S] = E(null), O = H(!1), y = H({
     userId: s == null ? void 0 : s.id,
     apiKey: l,
     serviceConfig: n,
-    capabilities: a,
-    customization: d
+    capabilities: i,
+    customization: c
   }), k = H(0);
-  k.current++, r("📊 RENDER INFO", {
+  k.current++, o("📊 RENDER INFO", {
     renderCount: k.current,
     currentProps: { userId: s == null ? void 0 : s.id, apiKey: (l == null ? void 0 : l.substring(0, 8)) + "..." },
     propChanges: {
       userChanged: y.current.userId !== (s == null ? void 0 : s.id),
       apiKeyChanged: y.current.apiKey !== l,
       serviceConfigChanged: y.current.serviceConfig !== n,
-      capabilitiesChanged: y.current.capabilities !== a,
-      customizationChanged: y.current.customization !== d
+      capabilitiesChanged: y.current.capabilities !== i,
+      customizationChanged: y.current.customization !== c
     }
   }), y.current = {
     userId: s == null ? void 0 : s.id,
     apiKey: l,
     serviceConfig: n,
-    capabilities: a,
-    customization: d
+    capabilities: i,
+    customization: c
   }, G(() => {
-    const v = k.current;
-    if (r("🔧 SERVICE INIT EFFECT TRIGGERED", {
-      renderCount: v,
+    const w = k.current;
+    if (o("🔧 SERVICE INIT EFFECT TRIGGERED", {
+      renderCount: w,
       apiKey: !!l,
       serviceConfig: !!n,
       dependencies: {
@@ -73,151 +73,151 @@ const he = ve({
         apiKeyStable: y.current.apiKey === l
       }
     }), !l || !n) {
-      r("⚠️ SERVICE INIT SKIPPED", {
-        renderCount: v,
+      o("⚠️ SERVICE INIT SKIPPED", {
+        renderCount: w,
         reason: "Missing apiKey or serviceConfig"
       });
       return;
     }
-    r("🚀 CREATING NEW SERVICE", {
-      renderCount: v,
+    o("🚀 CREATING NEW SERVICE", {
+      renderCount: w,
       apiKey: (l == null ? void 0 : l.substring(0, 8)) + "...",
       serviceConfigChanged: y.current.serviceConfig !== n
     });
     const M = new Ee({
       ...n,
       apiKey: l,
-      debug: i
+      debug: a
     });
-    return w(M), r("✅ SERVICE SET", {
-      renderCount: v,
+    return b(M), o("✅ SERVICE SET", {
+      renderCount: w,
       serviceInstance: !!M
     }), () => {
-      r("🧹 SERVICE CLEANUP", {
-        renderCount: v,
+      o("🧹 SERVICE CLEANUP", {
+        renderCount: w,
         reason: "Effect cleanup"
       }), M.disconnectUser().catch(console.error);
     };
-  }, [l, n, i, r]);
+  }, [l, n, a, o]);
   const T = H(null);
   G(() => {
     var M, p;
-    if (r("🔗 USER CONNECTION EFFECT TRIGGERED", {
-      hasService: !!o,
+    if (o("🔗 USER CONNECTION EFFECT TRIGGERED", {
+      hasService: !!r,
       hasUser: !!s,
       userId: s == null ? void 0 : s.id,
       isConnecting: O.current,
       isConnected: m,
-      dependencies: { service: !!o, userId: s == null ? void 0 : s.id }
-    }), !o || !s) {
-      r("⚠️ USER CONNECTION SKIPPED", "Missing service or user");
+      dependencies: { service: !!r, userId: s == null ? void 0 : s.id }
+    }), !r || !s) {
+      o("⚠️ USER CONNECTION SKIPPED", "Missing service or user");
       return;
     }
     if (O.current) {
-      r("⚠️ USER CONNECTION SKIPPED", "Already connecting");
+      o("⚠️ USER CONNECTION SKIPPED", "Already connecting");
       return;
     }
-    if (((M = T.current) == null ? void 0 : M.serviceId) === o && ((p = T.current) == null ? void 0 : p.userId) === s.id) {
-      r(
+    if (((M = T.current) == null ? void 0 : M.serviceId) === r && ((p = T.current) == null ? void 0 : p.userId) === s.id) {
+      o(
         "⚠️ USER CONNECTION SKIPPED",
         "Already connected this user with this service"
       );
       return;
     }
     (async () => {
-      r("🚀 STARTING USER CONNECTION", { userId: s.id }), O.current = !0, h(!0), S(null);
+      o("🚀 STARTING USER CONNECTION", { userId: s.id }), O.current = !0, h(!0), S(null);
       try {
-        r("📞 CALLING SERVICE.CONNECTUSER", { userId: s.id });
-        const L = await o.connectUser(s);
-        N(L), E(!0), T.current = { serviceId: o, userId: s.id }, r("✅ USER CONNECTION SUCCESS", {
+        o("📞 CALLING SERVICE.CONNECTUSER", { userId: s.id });
+        const L = await r.connectUser(s);
+        g(L), I(!0), T.current = { serviceId: r, userId: s.id }, o("✅ USER CONNECTION SUCCESS", {
           userId: s.id,
           clientId: L.userID
         });
       } catch (L) {
         const $ = L instanceof Error ? L.message : "Connection failed";
-        S($), r("❌ USER CONNECTION ERROR", {
+        S($), o("❌ USER CONNECTION ERROR", {
           userId: s.id,
           error: $
         });
       } finally {
-        h(!1), O.current = !1, r("🔄 USER CONNECTION FINISHED", {
+        h(!1), O.current = !1, o("🔄 USER CONNECTION FINISHED", {
           userId: s.id,
           isConnected: m
         });
       }
     })();
-  }, [o, s, r, m]), G(() => (r("🔌 CLEANUP EFFECT REGISTERED", {
-    hasService: !!o,
+  }, [r, s, o, m]), G(() => (o("🔌 CLEANUP EFFECT REGISTERED", {
+    hasService: !!r,
     isConnected: m
   }), () => {
-    o && m ? (r(
+    r && m ? (o(
       "🧹 CLEANUP EFFECT TRIGGERED",
       "Cleaning up connection on unmount"
-    ), T.current = null, o.disconnectUser().catch(console.error)) : r("🔇 CLEANUP EFFECT SKIPPED", {
-      hasService: !!o,
+    ), T.current = null, r.disconnectUser().catch(console.error)) : o("🔇 CLEANUP EFFECT SKIPPED", {
+      hasService: !!r,
       isConnected: m
     });
-  }), [o, m, r]);
+  }), [r, m, o]);
   const f = U(async () => {
-    if (r("🔄 REFRESH CONNECTION CALLED", {
-      hasService: !!o,
+    if (o("🔄 REFRESH CONNECTION CALLED", {
+      hasService: !!r,
       hasUser: !!s
-    }), !o || !s) {
-      r("⚠️ REFRESH CONNECTION SKIPPED", "Missing service or user");
+    }), !r || !s) {
+      o("⚠️ REFRESH CONNECTION SKIPPED", "Missing service or user");
       return;
     }
-    r("🚀 STARTING CONNECTION REFRESH", { userId: s.id }), h(!0);
+    o("🚀 STARTING CONNECTION REFRESH", { userId: s.id }), h(!0);
     try {
-      r("🔌 DISCONNECTING FOR REFRESH"), await o.disconnectUser(), r("📞 RECONNECTING FOR REFRESH");
-      const v = await o.connectUser(s);
-      N(v), E(!0), S(null), r("✅ CONNECTION REFRESH SUCCESS", { userId: s.id });
-    } catch (v) {
-      const M = v instanceof Error ? v.message : "Refresh failed";
-      S(M), r("❌ CONNECTION REFRESH ERROR", {
+      o("🔌 DISCONNECTING FOR REFRESH"), await r.disconnectUser(), o("📞 RECONNECTING FOR REFRESH");
+      const w = await r.connectUser(s);
+      g(w), I(!0), S(null), o("✅ CONNECTION REFRESH SUCCESS", { userId: s.id });
+    } catch (w) {
+      const M = w instanceof Error ? w.message : "Refresh failed";
+      S(M), o("❌ CONNECTION REFRESH ERROR", {
         userId: s.id,
         error: M
       });
     } finally {
-      h(!1), r("🔄 CONNECTION REFRESH FINISHED", { userId: s.id });
+      h(!1), o("🔄 CONNECTION REFRESH FINISHED", { userId: s.id });
     }
-  }, [o, s, r]), g = X.useMemo(() => (r("💫 CONTEXT VALUE MEMOIZATION", {
-    hasService: !!o,
+  }, [r, s, o]), x = X.useMemo(() => (o("💫 CONTEXT VALUE MEMOIZATION", {
+    hasService: !!r,
     hasClient: !!u,
     isConnected: m,
-    isLoading: x,
-    hasError: !!C,
-    capabilitiesKeys: Object.keys(a),
-    customizationKeys: Object.keys(d)
+    isLoading: N,
+    hasError: !!v,
+    capabilitiesKeys: Object.keys(i),
+    customizationKeys: Object.keys(c)
   }), {
-    service: o,
+    service: r,
     client: u,
     isConnected: m,
-    isLoading: x,
-    error: C,
-    capabilities: a,
-    customization: d,
+    isLoading: N,
+    error: v,
+    capabilities: i,
+    customization: c,
     refreshConnection: f,
-    debug: i
+    debug: a
   }), [
-    o,
+    r,
     u,
     m,
-    x,
-    C,
-    a,
-    d,
-    f,
+    N,
+    v,
     i,
-    r
+    c,
+    f,
+    a,
+    o
   ]);
-  return r("🔄 RENDER END", {
+  return o("🔄 RENDER END", {
     renderCount: k.current,
     willRenderChat: !!(u && m),
-    contextValueReady: !!g
-  }), /* @__PURE__ */ e(he.Provider, { value: g, children: u && m ? /* @__PURE__ */ e(Ie, { client: u, children: t }) : t });
+    contextValueReady: !!x
+  }), /* @__PURE__ */ e(he.Provider, { value: x, children: u && m ? /* @__PURE__ */ e(Ie, { client: u, children: t }) : t });
 }, Le = () => se();
 function ne({ label: t, className: s, children: n, ...l }) {
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ d(
     "button",
     {
       type: "button",
@@ -265,8 +265,8 @@ function je(t) {
     // olive green
   ];
   let n = 0;
-  for (let a = 0; a < t.length; a++)
-    n = (n << 5) - n + t.charCodeAt(a), n = n & n;
+  for (let i = 0; i < t.length; i++)
+    n = (n << 5) - n + t.charCodeAt(i), n = n & n;
   const l = Math.abs(n) % s.length;
   return s[l];
 }
@@ -275,15 +275,15 @@ const Y = ({
   name: s,
   image: n,
   size: l = 40,
-  className: a
+  className: i
 }) => {
-  const { color: d } = je(t), i = s.charAt(0).toUpperCase(), o = l < 32 ? "text-xs" : l < 56 ? "text-sm" : "text-lg";
+  const { color: c } = je(t), a = s.charAt(0).toUpperCase(), r = l < 32 ? "text-xs" : l < 56 ? "text-sm" : "text-lg";
   return /* @__PURE__ */ e(
     "div",
     {
       className: D(
         "flex-shrink-0 overflow-hidden rounded-full",
-        a
+        i
       ),
       style: { width: `${l}px`, height: `${l}px` },
       children: n ? /* @__PURE__ */ e(
@@ -299,75 +299,75 @@ const Y = ({
           "aria-hidden": "true",
           className: D(
             "flex h-full w-full items-center justify-center font-semibold",
-            o
+            r
           ),
           style: {
-            color: d,
-            backgroundColor: `color-mix(in srgb, ${d} 20%, transparent)`
+            color: c,
+            backgroundColor: `color-mix(in srgb, ${c} 20%, transparent)`
           },
-          children: i
+          children: a
         }
       )
     }
   );
-}, Ae = ({ channel: t, selectedChannel: s, onChannelSelect: n, debug: l = !1 }) => {
-  var x, h, C, S, O, y, k;
-  const a = (s == null ? void 0 : s.id) === (t == null ? void 0 : t.id), d = () => {
+}, Ae = ({ channel: t, selectedChannel: s, onChannelSelect: n, debug: l = !1, unread: i }) => {
+  var h, v, S, O, y, k;
+  const c = (s == null ? void 0 : s.id) === (t == null ? void 0 : t.id), a = () => {
     t && n(t);
-  }, r = Object.values(((x = t == null ? void 0 : t.state) == null ? void 0 : x.members) || {}).find(
+  }, r = Object.values(((h = t == null ? void 0 : t.state) == null ? void 0 : h.members) || {}).find(
     (T) => {
-      var f, g;
-      return ((f = T.user) == null ? void 0 : f.id) && T.user.id !== ((g = t == null ? void 0 : t._client) == null ? void 0 : g.userID);
+      var f, x;
+      return ((f = T.user) == null ? void 0 : f.id) && T.user.id !== ((x = t == null ? void 0 : t._client) == null ? void 0 : x.userID);
     }
-  ), o = ((h = r == null ? void 0 : r.user) == null ? void 0 : h.name) || "Conversation", w = (C = r == null ? void 0 : r.user) == null ? void 0 : C.image, u = (O = (S = t == null ? void 0 : t.state) == null ? void 0 : S.messages) == null ? void 0 : O[t.state.messages.length - 1], N = (u == null ? void 0 : u.text) || "No messages yet", m = u != null && u.created_at ? new Date(u.created_at).toLocaleTimeString([], {
+  ), b = ((v = r == null ? void 0 : r.user) == null ? void 0 : v.name) || "Conversation", u = (S = r == null ? void 0 : r.user) == null ? void 0 : S.image, g = (y = (O = t == null ? void 0 : t.state) == null ? void 0 : O.messages) == null ? void 0 : y[t.state.messages.length - 1], m = (g == null ? void 0 : g.text) || "No messages yet", I = g != null && g.created_at ? new Date(g.created_at).toLocaleTimeString([], {
     hour: "2-digit",
     minute: "2-digit"
-  }) : "", E = ((y = t == null ? void 0 : t.state) == null ? void 0 : y.unreadCount) || 0;
+  }) : "", N = i ?? 0;
   return l && console.log("📺 [ChannelList] 📋 CHANNEL PREVIEW RENDER", {
     channelId: t == null ? void 0 : t.id,
-    isSelected: a,
-    participantName: o,
-    unread: E,
-    hasTimestamp: !!m
+    isSelected: c,
+    participantName: b,
+    unreadCount: N,
+    hasTimestamp: !!I
   }), /* @__PURE__ */ e(
     "button",
     {
       type: "button",
-      onClick: d,
+      onClick: a,
       className: D(
         "w-full px-4 py-3 transition-colors border-b border-sand text-left max-w-full overflow-hidden focus-ring",
         {
-          "bg-primary-alt/10 border-l-4 border-l-primary": a,
-          "hover:bg-sand": !a
+          "bg-primary-alt/10 border-l-4 border-l-primary": c,
+          "hover:bg-sand": !c
         }
       ),
-      children: /* @__PURE__ */ c("div", { className: "flex items-start gap-3", children: [
+      children: /* @__PURE__ */ d("div", { className: "flex items-start gap-3", children: [
         /* @__PURE__ */ e(
           Y,
           {
             id: ((k = r == null ? void 0 : r.user) == null ? void 0 : k.id) || t.id || "unknown",
-            name: o,
-            image: w,
+            name: b,
+            image: u,
             size: 44
           }
         ),
-        /* @__PURE__ */ c("div", { className: "flex-1 min-w-0 flex flex-col gap-1", children: [
-          /* @__PURE__ */ c("div", { className: "flex items-center justify-between gap-2", children: [
+        /* @__PURE__ */ d("div", { className: "flex-1 min-w-0 flex flex-col gap-1", children: [
+          /* @__PURE__ */ d("div", { className: "flex items-center justify-between gap-2", children: [
             /* @__PURE__ */ e(
               "h3",
               {
                 className: D(
                   "text-sm font-medium truncate",
-                  a ? "text-primary" : "text-charcoal"
+                  c ? "text-primary" : "text-charcoal"
                 ),
-                children: o
+                children: b
               }
             ),
-            m && /* @__PURE__ */ e("span", { className: "text-xs text-stone flex-shrink-0", children: m })
+            I && /* @__PURE__ */ e("span", { className: "text-xs text-stone flex-shrink-0", children: I })
           ] }),
-          /* @__PURE__ */ c("div", { className: "flex items-center justify-between gap-2 min-w-0", children: [
-            /* @__PURE__ */ e("p", { className: "text-xs text-stone mr-2 flex-1 line-clamp-2", children: N }),
-            E > 0 && /* @__PURE__ */ e("span", { className: "bg-primary text-white text-xs px-2 py-0.5 rounded-full min-w-[20px] text-center flex-shrink-0", children: E > 99 ? "99+" : E })
+          /* @__PURE__ */ d("div", { className: "flex items-center justify-between gap-2 min-w-0", children: [
+            /* @__PURE__ */ e("p", { className: "text-xs text-stone mr-2 flex-1 line-clamp-2", children: m }),
+            N > 0 && /* @__PURE__ */ e("span", { className: "bg-primary text-white text-xs px-2 py-0.5 rounded-full min-w-[20px] text-center flex-shrink-0", children: N > 99 ? "99+" : N })
           ] })
         ] })
       ] })
@@ -378,43 +378,43 @@ const Y = ({
   selectedChannel: s,
   showStartConversation: n = !1,
   onStartConversation: l,
-  participantLabel: a = "participants",
-  className: d
+  participantLabel: i = "participants",
+  className: c
 }) => {
   var u;
-  const i = X.useRef(0);
-  i.current++;
-  const { debug: r = !1 } = se();
-  r && console.log("📺 [ChannelList] 🔄 RENDER START", {
-    renderCount: i.current,
+  const a = X.useRef(0);
+  a.current++;
+  const { debug: o = !1 } = se();
+  o && console.log("📺 [ChannelList] 🔄 RENDER START", {
+    renderCount: a.current,
     selectedChannelId: s == null ? void 0 : s.id,
     showStartConversation: n,
-    participantLabel: a
+    participantLabel: i
   });
-  const { client: o } = ye();
-  r && console.log("📺 [ChannelList] 📡 CHAT CONTEXT", {
-    renderCount: i.current,
-    hasClient: !!o,
-    clientUserId: o == null ? void 0 : o.userID,
-    clientConnected: (u = o == null ? void 0 : o.wsConnection) == null ? void 0 : u.isHealthy
+  const { client: r } = ye();
+  o && console.log("📺 [ChannelList] 📡 CHAT CONTEXT", {
+    renderCount: a.current,
+    hasClient: !!r,
+    clientUserId: r == null ? void 0 : r.userID,
+    clientConnected: (u = r == null ? void 0 : r.wsConnection) == null ? void 0 : u.isHealthy
   });
-  const w = X.useMemo(() => {
-    const N = o.userID, m = N ? { type: "messaging", members: { $in: [N] }, hidden: !1 } : { type: "messaging" };
-    return r && console.log("📺 [ChannelList] 🔍 FILTERS MEMOIZED", {
-      renderCount: i.current,
-      userId: N,
+  const b = X.useMemo(() => {
+    const g = r.userID, m = g ? { type: "messaging", members: { $in: [g] }, hidden: !1 } : { type: "messaging" };
+    return o && console.log("📺 [ChannelList] 🔍 FILTERS MEMOIZED", {
+      renderCount: a.current,
+      userId: g,
       filters: m
     }), m;
-  }, [o.userID, r]);
-  return /* @__PURE__ */ c(
+  }, [r.userID, o]);
+  return /* @__PURE__ */ d(
     "div",
     {
       className: D(
         "messaging-channel-list h-full flex flex-col min-w-0 overflow-hidden",
-        d
+        c
       ),
       children: [
-        /* @__PURE__ */ e("div", { className: "px-4 py-4 border-b border-sand bg-chalk", children: /* @__PURE__ */ c("div", { className: "flex items-center justify-between gap-3 min-h-10 min-w-0", children: [
+        /* @__PURE__ */ e("div", { className: "px-4 py-4 border-b border-sand bg-chalk", children: /* @__PURE__ */ d("div", { className: "flex items-center justify-between gap-3 min-h-10 min-w-0", children: [
           /* @__PURE__ */ e("h2", { className: "text-lg font-semibold text-charcoal", children: "Conversations" }),
           /* @__PURE__ */ e("div", { className: "flex items-center gap-2", children: n && l && /* @__PURE__ */ e(
             ne,
@@ -426,30 +426,30 @@ const Y = ({
             }
           ) })
         ] }) }),
-        /* @__PURE__ */ e("div", { className: "flex-1 overflow-hidden min-w-0", children: (r && console.log("📺 [ChannelList] 🎬 RENDERING STREAM CHANNEL LIST", {
-          renderCount: i.current,
-          filters: w,
-          hasClient: !!o,
-          clientUserId: o == null ? void 0 : o.userID
+        /* @__PURE__ */ e("div", { className: "flex-1 overflow-hidden min-w-0", children: (o && console.log("📺 [ChannelList] 🎬 RENDERING STREAM CHANNEL LIST", {
+          renderCount: a.current,
+          filters: b,
+          hasClient: !!r,
+          clientUserId: r == null ? void 0 : r.userID
         }), /* @__PURE__ */ e(
           Se,
           {
-            filters: w,
+            filters: b,
             sort: { last_message_at: -1 },
             options: { limit: 30 },
-            Preview: (N) => {
-              var m, E;
-              return r && console.log("📺 [ChannelList] 📋 CHANNEL PREVIEW RENDER", {
-                channelId: (m = N.channel) == null ? void 0 : m.id,
+            Preview: (g) => {
+              var m, I;
+              return o && console.log("📺 [ChannelList] 📋 CHANNEL PREVIEW RENDER", {
+                channelId: (m = g.channel) == null ? void 0 : m.id,
                 selectedChannelId: s == null ? void 0 : s.id,
-                isSelected: (s == null ? void 0 : s.id) === ((E = N.channel) == null ? void 0 : E.id)
+                isSelected: (s == null ? void 0 : s.id) === ((I = g.channel) == null ? void 0 : I.id)
               }), /* @__PURE__ */ e(
                 Ae,
                 {
-                  ...N,
+                  ...g,
                   selectedChannel: s,
                   onChannelSelect: t,
-                  debug: r
+                  debug: o
                 }
               );
             }
@@ -479,19 +479,19 @@ const Y = ({
 function fe({ onClick: t }) {
   return /* @__PURE__ */ e(ne, { label: "Close", onClick: t, className: "p-1", children: /* @__PURE__ */ e(me, { className: "h-5 w-5 text-stone", weight: "bold" }) });
 }
-const He = ({ renderActions: t }) => /* @__PURE__ */ c("div", { className: "message-input flex items-center gap-2 p-4", children: [
+const He = ({ renderActions: t }) => /* @__PURE__ */ d("div", { className: "message-input flex items-center gap-2 p-4", children: [
   t && t(),
   /* @__PURE__ */ e("div", { className: "flex-1", children: /* @__PURE__ */ e(Pe, { focus: !0, maxRows: 4 }) })
 ] }), Ge = ({ onBack: t, showBackButton: s, onShowInfo: n, canShowInfo: l }) => {
-  var o, w, u, N;
-  const { channel: a } = ue(), d = X.useMemo(() => Object.values(a.state.members || {}).find(
-    (E) => {
-      var x;
-      return ((x = E.user) == null ? void 0 : x.id) && E.user.id !== a._client.userID;
+  var r, b, u, g;
+  const { channel: i } = ue(), c = X.useMemo(() => Object.values(i.state.members || {}).find(
+    (I) => {
+      var N;
+      return ((N = I.user) == null ? void 0 : N.id) && I.user.id !== i._client.userID;
     }
-  ), [a._client.userID, a.state.members]), i = ((o = d == null ? void 0 : d.user) == null ? void 0 : o.name) || ((w = d == null ? void 0 : d.user) == null ? void 0 : w.id) || "Unknown member", r = (u = d == null ? void 0 : d.user) == null ? void 0 : u.image;
-  return /* @__PURE__ */ c("div", { className: "flex items-center justify-between gap-3 min-h-12", children: [
-    /* @__PURE__ */ c("div", { className: "flex items-center gap-3 min-w-0", children: [
+  ), [i._client.userID, i.state.members]), a = ((r = c == null ? void 0 : c.user) == null ? void 0 : r.name) || ((b = c == null ? void 0 : c.user) == null ? void 0 : b.id) || "Unknown member", o = (u = c == null ? void 0 : c.user) == null ? void 0 : u.image;
+  return /* @__PURE__ */ d("div", { className: "flex items-center justify-between gap-3 min-h-12", children: [
+    /* @__PURE__ */ d("div", { className: "flex items-center gap-3 min-w-0", children: [
       s && t && /* @__PURE__ */ e(
         "button",
         {
@@ -505,13 +505,13 @@ const He = ({ renderActions: t }) => /* @__PURE__ */ c("div", { className: "mess
       /* @__PURE__ */ e(
         Y,
         {
-          id: ((N = d == null ? void 0 : d.user) == null ? void 0 : N.id) || a.id || "unknown",
-          name: i,
-          image: r,
+          id: ((g = c == null ? void 0 : c.user) == null ? void 0 : g.id) || i.id || "unknown",
+          name: a,
+          image: o,
           size: 40
         }
       ),
-      /* @__PURE__ */ e("div", { className: "min-w-0", children: /* @__PURE__ */ e("h1", { className: "text-lg font-semibold text-charcoal truncate", children: i }) })
+      /* @__PURE__ */ e("div", { className: "min-w-0", children: /* @__PURE__ */ e("h1", { className: "text-lg font-semibold text-charcoal truncate", children: a }) })
     ] }),
     l && n && /* @__PURE__ */ e(ne, { label: "Chat info", onClick: n, children: /* @__PURE__ */ e(Oe, { className: "h-6 w-6 text-charcoal", weight: "bold" }) })
   ] });
@@ -520,56 +520,56 @@ const He = ({ renderActions: t }) => /* @__PURE__ */ c("div", { className: "mess
   onClose: s,
   participant: n,
   channel: l,
-  followerStatusLabel: a,
-  onLeaveConversation: d,
-  onBlockParticipant: i
+  followerStatusLabel: i,
+  onLeaveConversation: c,
+  onBlockParticipant: a
 }) => {
   var L, $, _, V, Q, W, z;
-  const { service: r, debug: o } = se(), w = H(null), [u, N] = I(!1), [m, E] = I(!1), [x, h] = I(!1);
+  const { service: o, debug: r } = se(), b = H(null), [u, g] = E(!1), [m, I] = E(!1), [N, h] = E(!1);
   G(() => {
-    const R = w.current;
+    const R = b.current;
     R && (t ? R.showModal() : R.close());
   }, [t]);
-  const C = U(async () => {
+  const v = U(async () => {
     var R;
-    if (!(!r || !((R = n == null ? void 0 : n.user) != null && R.id)))
+    if (!(!o || !((R = n == null ? void 0 : n.user) != null && R.id)))
       try {
-        const A = (await r.getBlockedUsers()).some(
+        const A = (await o.getBlockedUsers()).some(
           (q) => {
             var Z;
             return q.blocked_user_id === ((Z = n == null ? void 0 : n.user) == null ? void 0 : Z.id);
           }
         );
-        N(A);
+        g(A);
       } catch (P) {
         console.error(
           "[ChannelInfoDialog] Failed to check blocked status:",
           P
         );
       }
-  }, [r, (L = n == null ? void 0 : n.user) == null ? void 0 : L.id]);
+  }, [o, (L = n == null ? void 0 : n.user) == null ? void 0 : L.id]);
   G(() => {
-    t && C();
-  }, [t, C]);
+    t && v();
+  }, [t, v]);
   const S = async () => {
     var R;
     if (!m) {
-      o && console.log("[ChannelInfoDialog] Leave conversation", l.cid), E(!0);
+      r && console.log("[ChannelInfoDialog] Leave conversation", l.cid), I(!0);
       try {
         const P = ((R = l._client) == null ? void 0 : R.userID) ?? null;
-        await l.hide(P, !1), d && await d(l), s();
+        await l.hide(P, !1), c && await c(l), s();
       } catch (P) {
         console.error("[ChannelInfoDialog] Failed to leave conversation", P);
       } finally {
-        E(!1);
+        I(!1);
       }
     }
   }, O = async () => {
     var R, P, A;
-    if (!(x || !r)) {
-      o && console.log("[ChannelInfoDialog] Block member", (R = n == null ? void 0 : n.user) == null ? void 0 : R.id), h(!0);
+    if (!(N || !o)) {
+      r && console.log("[ChannelInfoDialog] Block member", (R = n == null ? void 0 : n.user) == null ? void 0 : R.id), h(!0);
       try {
-        await r.blockUser((P = n == null ? void 0 : n.user) == null ? void 0 : P.id), i && await i((A = n == null ? void 0 : n.user) == null ? void 0 : A.id), s();
+        await o.blockUser((P = n == null ? void 0 : n.user) == null ? void 0 : P.id), a && await a((A = n == null ? void 0 : n.user) == null ? void 0 : A.id), s();
       } catch (q) {
         console.error("[ChannelInfoDialog] Failed to block member", q);
       } finally {
@@ -578,10 +578,10 @@ const He = ({ renderActions: t }) => /* @__PURE__ */ c("div", { className: "mess
     }
   }, y = async () => {
     var R, P, A;
-    if (!(x || !r)) {
-      o && console.log("[ChannelInfoDialog] Unblock member", (R = n == null ? void 0 : n.user) == null ? void 0 : R.id), h(!0);
+    if (!(N || !o)) {
+      r && console.log("[ChannelInfoDialog] Unblock member", (R = n == null ? void 0 : n.user) == null ? void 0 : R.id), h(!0);
       try {
-        await r.unBlockUser((P = n == null ? void 0 : n.user) == null ? void 0 : P.id), i && await i((A = n == null ? void 0 : n.user) == null ? void 0 : A.id), s();
+        await o.unBlockUser((P = n == null ? void 0 : n.user) == null ? void 0 : P.id), a && await a((A = n == null ? void 0 : n.user) == null ? void 0 : A.id), s();
       } catch (q) {
         console.error("[ChannelInfoDialog] Failed to unblock member", q);
       } finally {
@@ -596,25 +596,25 @@ const He = ({ renderActions: t }) => /* @__PURE__ */ c("div", { className: "mess
     );
   };
   if (!n) return null;
-  const T = (($ = n.user) == null ? void 0 : $.name) || ((_ = n.user) == null ? void 0 : _.id) || "Unknown member", f = (V = n.user) == null ? void 0 : V.image, g = (Q = n.user) == null ? void 0 : Q.email, v = (W = n.user) == null ? void 0 : W.username, M = g || (v ? `linktr.ee/${v}` : void 0), p = ((z = n.user) == null ? void 0 : z.id) || "unknown";
+  const T = (($ = n.user) == null ? void 0 : $.name) || ((_ = n.user) == null ? void 0 : _.id) || "Unknown member", f = (V = n.user) == null ? void 0 : V.image, x = (Q = n.user) == null ? void 0 : Q.email, w = (W = n.user) == null ? void 0 : W.username, M = x || (w ? `linktr.ee/${w}` : void 0), p = ((z = n.user) == null ? void 0 : z.id) || "unknown";
   return (
     // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-noninteractive-element-interactions
     /* @__PURE__ */ e(
       "dialog",
       {
-        ref: w,
+        ref: b,
         className: "mes-dialog",
         onClose: s,
         onClick: (R) => {
-          R.target === w.current && s();
+          R.target === b.current && s();
         },
-        children: /* @__PURE__ */ c("div", { className: "ml-auto flex h-full w-full flex-col bg-white shadow-max-elevation-light", children: [
-          /* @__PURE__ */ c("div", { className: "flex items-center justify-between border-b border-sand px-4 py-3", children: [
+        children: /* @__PURE__ */ d("div", { className: "ml-auto flex h-full w-full flex-col bg-white shadow-max-elevation-light", children: [
+          /* @__PURE__ */ d("div", { className: "flex items-center justify-between border-b border-sand px-4 py-3", children: [
             /* @__PURE__ */ e("h2", { className: "text-base font-semibold text-charcoal", children: "Chat info" }),
             /* @__PURE__ */ e(fe, { onClick: s })
           ] }),
-          /* @__PURE__ */ c("div", { className: "flex-1 overflow-y-auto px-6 py-6", children: [
-            /* @__PURE__ */ e("div", { className: "rounded-2xl bg-chalk p-4", children: /* @__PURE__ */ c("div", { className: "flex items-center gap-4", children: [
+          /* @__PURE__ */ d("div", { className: "flex-1 overflow-y-auto px-6 py-6", children: [
+            /* @__PURE__ */ e("div", { className: "rounded-2xl bg-chalk p-4", children: /* @__PURE__ */ d("div", { className: "flex items-center gap-4", children: [
               /* @__PURE__ */ e(
                 Y,
                 {
@@ -624,14 +624,14 @@ const He = ({ renderActions: t }) => /* @__PURE__ */ c("div", { className: "mess
                   size: 64
                 }
               ),
-              /* @__PURE__ */ c("div", { className: "min-w-0 flex-1", children: [
+              /* @__PURE__ */ d("div", { className: "min-w-0 flex-1", children: [
                 /* @__PURE__ */ e("p", { className: "truncate text-base font-semibold text-charcoal", children: T }),
                 M && /* @__PURE__ */ e("p", { className: "truncate text-sm text-stone", children: M }),
-                a && /* @__PURE__ */ e("span", { className: "mt-2 inline-flex items-center rounded-full bg-green-100 px-2 py-0.5 text-xs font-medium text-green-700", children: a })
+                i && /* @__PURE__ */ e("span", { className: "mt-2 inline-flex items-center rounded-full bg-green-100 px-2 py-0.5 text-xs font-medium text-green-700", children: i })
               ] })
             ] }) }),
-            /* @__PURE__ */ c("ul", { className: "flex flex-col gap-2 mt-2", children: [
-              /* @__PURE__ */ e("li", { children: /* @__PURE__ */ c(
+            /* @__PURE__ */ d("ul", { className: "flex flex-col gap-2 mt-2", children: [
+              /* @__PURE__ */ e("li", { children: /* @__PURE__ */ d(
                 K,
                 {
                   onClick: S,
@@ -643,30 +643,30 @@ const He = ({ renderActions: t }) => /* @__PURE__ */ c("div", { className: "mess
                   ]
                 }
               ) }),
-              /* @__PURE__ */ e("li", { children: u ? /* @__PURE__ */ c(
+              /* @__PURE__ */ e("li", { children: u ? /* @__PURE__ */ d(
                 K,
                 {
                   onClick: y,
-                  disabled: x,
-                  "aria-busy": x,
+                  disabled: N,
+                  "aria-busy": N,
                   children: [
-                    x ? /* @__PURE__ */ e(ee, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ e(ie, { className: "h-5 w-5" }),
+                    N ? /* @__PURE__ */ e(ee, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ e(ie, { className: "h-5 w-5" }),
                     /* @__PURE__ */ e("span", { children: "Unblock" })
                   ]
                 }
-              ) : /* @__PURE__ */ c(
+              ) : /* @__PURE__ */ d(
                 K,
                 {
                   onClick: O,
-                  disabled: x,
-                  "aria-busy": x,
+                  disabled: N,
+                  "aria-busy": N,
                   children: [
-                    x ? /* @__PURE__ */ e(ee, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ e(ie, { className: "h-5 w-5" }),
+                    N ? /* @__PURE__ */ e(ee, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ e(ie, { className: "h-5 w-5" }),
                     /* @__PURE__ */ e("span", { children: "Block" })
                   ]
                 }
               ) }),
-              /* @__PURE__ */ e("li", { children: /* @__PURE__ */ c(K, { variant: "danger", onClick: k, children: [
+              /* @__PURE__ */ e("li", { children: /* @__PURE__ */ d(K, { variant: "danger", onClick: k, children: [
                 /* @__PURE__ */ e(Fe, { className: "h-5 w-5" }),
                 /* @__PURE__ */ e("span", { children: "Report" })
               ] }) })
@@ -681,51 +681,51 @@ const He = ({ renderActions: t }) => /* @__PURE__ */ c("div", { className: "mess
   showBackButton: s,
   renderMessageInputActions: n,
   onLeaveConversation: l,
-  onBlockParticipant: a,
-  CustomChannelEmptyState: d
+  onBlockParticipant: i,
+  CustomChannelEmptyState: c
 }) => {
-  var m, E;
-  const { channel: i } = ue(), [r, o] = I(!1), w = (((E = (m = i == null ? void 0 : i.state) == null ? void 0 : m.messages) == null ? void 0 : E.length) ?? 0) > 0, u = X.useMemo(() => Object.values(i.state.members || {}).find(
+  var m, I;
+  const { channel: a } = ue(), [o, r] = E(!1), b = (((I = (m = a == null ? void 0 : a.state) == null ? void 0 : m.messages) == null ? void 0 : I.length) ?? 0) > 0, u = X.useMemo(() => Object.values(a.state.members || {}).find(
     (h) => {
-      var C;
-      return ((C = h.user) == null ? void 0 : C.id) && h.user.id !== i._client.userID;
+      var v;
+      return ((v = h.user) == null ? void 0 : v.id) && h.user.id !== a._client.userID;
     }
-  ), [i._client.userID, i.state.members]), N = X.useMemo(() => {
-    const x = i.data ?? {};
-    return x.followerStatus ? String(x.followerStatus) : x.isFollower ? "Subscribed to you" : void 0;
-  }, [i.data]);
-  return /* @__PURE__ */ c(oe, { children: [
-    /* @__PURE__ */ c(ke, { children: [
+  ), [a._client.userID, a.state.members]), g = X.useMemo(() => {
+    const N = a.data ?? {};
+    return N.followerStatus ? String(N.followerStatus) : N.isFollower ? "Subscribed to you" : void 0;
+  }, [a.data]);
+  return /* @__PURE__ */ d(oe, { children: [
+    /* @__PURE__ */ d(ke, { children: [
       /* @__PURE__ */ e("div", { className: "border-b border-sand bg-white px-4 py-3", children: /* @__PURE__ */ e(
         Ge,
         {
           onBack: t,
           showBackButton: s,
-          onShowInfo: () => o(!0),
+          onShowInfo: () => r(!0),
           canShowInfo: !!u
         }
       ) }),
-      /* @__PURE__ */ c("div", { className: "flex-1 overflow-hidden relative", children: [
+      /* @__PURE__ */ d("div", { className: "flex-1 overflow-hidden relative", children: [
         /* @__PURE__ */ e(Te, { hideDeletedMessages: !0, hideNewMessageSeparator: !1 }),
-        !w && d && /* @__PURE__ */ e("div", { className: "absolute inset-0 flex bg-white", children: /* @__PURE__ */ e(d, {}) })
+        !b && c && /* @__PURE__ */ e("div", { className: "absolute inset-0 flex bg-white", children: /* @__PURE__ */ e(c, {}) })
       ] }),
       /* @__PURE__ */ e(
         He,
         {
-          renderActions: () => n == null ? void 0 : n(i)
+          renderActions: () => n == null ? void 0 : n(a)
         }
       )
     ] }),
     /* @__PURE__ */ e(
       $e,
       {
-        isOpen: r,
-        onClose: () => o(!1),
+        isOpen: o,
+        onClose: () => r(!1),
         participant: u,
-        channel: i,
-        followerStatusLabel: N,
+        channel: a,
+        followerStatusLabel: g,
         onLeaveConversation: l,
-        onBlockParticipant: a
+        onBlockParticipant: i
       }
     )
   ] });
@@ -734,16 +734,16 @@ const He = ({ renderActions: t }) => /* @__PURE__ */ c("div", { className: "mess
   onBack: s,
   showBackButton: n = !1,
   renderMessageInputActions: l,
-  onLeaveConversation: a,
-  onBlockParticipant: d,
-  className: i,
-  CustomChannelEmptyState: r
+  onLeaveConversation: i,
+  onBlockParticipant: c,
+  className: a,
+  CustomChannelEmptyState: o
 }) => /* @__PURE__ */ e(
   "div",
   {
     className: D(
       "messaging-channel-view h-full flex flex-col",
-      i
+      a
     ),
     children: /* @__PURE__ */ e(Re, { channel: t, children: /* @__PURE__ */ e(
       _e,
@@ -751,9 +751,9 @@ const He = ({ renderActions: t }) => /* @__PURE__ */ c("div", { className: "mess
         onBack: s,
         showBackButton: n,
         renderMessageInputActions: l,
-        onLeaveConversation: a,
-        onBlockParticipant: d,
-        CustomChannelEmptyState: r
+        onLeaveConversation: i,
+        onBlockParticipant: c,
+        CustomChannelEmptyState: o
       }
     ) })
   }
@@ -764,7 +764,7 @@ function We({
   placeholder: n
 }) {
   const l = H(null);
-  return /* @__PURE__ */ c("div", { className: "relative", children: [
+  return /* @__PURE__ */ d("div", { className: "relative", children: [
     /* @__PURE__ */ e(
       pe,
       {
@@ -779,7 +779,7 @@ function We({
         type: "text",
         placeholder: n,
         value: t,
-        onChange: (a) => s(a.target.value),
+        onChange: (i) => s(i.target.value),
         className: "w-full pl-10 pr-10 py-3 text-sm border border-sand rounded-xl focus:outline-none focus:ring-2 focus:ring-black focus:border-transparent"
       }
     ),
@@ -788,8 +788,8 @@ function We({
       {
         label: "Clear search",
         onClick: () => {
-          var a;
-          s(""), (a = l.current) == null || a.focus();
+          var i;
+          s(""), (i = l.current) == null || i.focus();
         },
         className: "absolute right-3 top-1/2 -translate-y-1/2 p-1 text-stone hover:text-charcoal",
         children: /* @__PURE__ */ e(me, { className: "h-4 w-4", weight: "bold" })
@@ -802,104 +802,104 @@ const ze = ({
   onSelectParticipant: s,
   onClose: n,
   existingParticipantIds: l = /* @__PURE__ */ new Set(),
-  participantLabel: a = "participants",
-  searchPlaceholder: d = "Search participants...",
-  className: i
+  participantLabel: i = "participants",
+  searchPlaceholder: c = "Search participants...",
+  className: a
 }) => {
-  const { debug: r } = se(), [o, w] = I(""), [u, N] = I([]), [m, E] = I(!1), [x, h] = I(null), [C, S] = I(
+  const { debug: o } = se(), [r, b] = E(""), [u, g] = E([]), [m, I] = E(!1), [N, h] = E(null), [v, S] = E(
     null
   ), O = H(!1);
   G(() => {
     if (t.loading) {
-      r && console.log(
+      o && console.log(
         "[ParticipantPicker] Waiting for participant source to finish loading..."
       );
       return;
     }
     if (O.current) return;
     (async () => {
-      r && console.log("[ParticipantPicker] Loading initial participants..."), E(!0), h(null);
+      o && console.log("[ParticipantPicker] Loading initial participants..."), I(!0), h(null);
       try {
-        const g = await t.loadParticipants({
+        const x = await t.loadParticipants({
           search: "",
           // Load all participants initially
           limit: 100
         });
-        N(g.participants), O.current = !0, r && console.log(
+        g(x.participants), O.current = !0, o && console.log(
           "[ParticipantPicker] Participants loaded successfully:",
-          g.participants.length
+          x.participants.length
         );
-      } catch (g) {
-        const v = g instanceof Error ? g.message : "Failed to load participants";
-        h(v), console.error("[ParticipantPicker] Failed to load participants:", g);
+      } catch (x) {
+        const w = x instanceof Error ? x.message : "Failed to load participants";
+        h(w), console.error("[ParticipantPicker] Failed to load participants:", x);
       } finally {
-        E(!1);
+        I(!1);
       }
     })();
-  }, [t.loading, r]);
+  }, [t.loading, o]);
   const y = u.filter((f) => !l.has(f.id)).filter((f) => {
-    var v;
-    if (!o) return !0;
-    const g = o.toLowerCase();
-    return f.name.toLowerCase().includes(g) || ((v = f.email) == null ? void 0 : v.toLowerCase().includes(g)) || !1;
+    var w;
+    if (!r) return !0;
+    const x = r.toLowerCase();
+    return f.name.toLowerCase().includes(x) || ((w = f.email) == null ? void 0 : w.toLowerCase().includes(x)) || !1;
   }), k = U(
     async (f) => {
-      if (!C) {
+      if (!v) {
         S(f.id);
         try {
           await s(f);
-        } catch (g) {
-          console.error("[ParticipantPicker] Failed to start chat:", g), S(null);
+        } catch (x) {
+          console.error("[ParticipantPicker] Failed to start chat:", x), S(null);
         }
       }
     },
-    [s, C]
-  ), T = (f, g) => {
-    (f.key === "Enter" || f.key === " ") && (f.preventDefault(), k(g));
+    [s, v]
+  ), T = (f, x) => {
+    (f.key === "Enter" || f.key === " ") && (f.preventDefault(), k(x));
   };
-  return /* @__PURE__ */ c("div", { className: D("flex flex-col h-full", i), children: [
-    /* @__PURE__ */ c("div", { className: "px-4 py-4 border-b border-sand bg-chalk", children: [
-      /* @__PURE__ */ c("div", { className: "flex items-center justify-between mb-3", children: [
+  return /* @__PURE__ */ d("div", { className: D("flex flex-col h-full", a), children: [
+    /* @__PURE__ */ d("div", { className: "px-4 py-4 border-b border-sand bg-chalk", children: [
+      /* @__PURE__ */ d("div", { className: "flex items-center justify-between mb-3", children: [
         /* @__PURE__ */ e("h2", { className: "text-lg font-semibold text-charcoal", children: "Start a new Conversation" }),
         /* @__PURE__ */ e(fe, { onClick: n })
       ] }),
-      /* @__PURE__ */ c("p", { className: "text-xs text-stone mb-3", children: [
+      /* @__PURE__ */ d("p", { className: "text-xs text-stone mb-3", children: [
         "Select a ",
-        a.slice(0, -1),
+        i.slice(0, -1),
         " to start messaging (",
         y.length,
         " available)",
-        t.totalCount !== void 0 && ` • ${t.totalCount} ${a} total`
+        t.totalCount !== void 0 && ` • ${t.totalCount} ${i} total`
       ] }),
       /* @__PURE__ */ e(
         We,
         {
-          searchQuery: o,
-          setSearchQuery: w,
-          placeholder: d
+          searchQuery: r,
+          setSearchQuery: b,
+          placeholder: c
         }
       )
     ] }),
-    x && /* @__PURE__ */ c("div", { className: "p-4 text-sm text-danger bg-danger-alt", children: [
+    N && /* @__PURE__ */ d("div", { className: "p-4 text-sm text-danger bg-danger-alt", children: [
       "Error loading ",
-      a,
+      i,
       ": ",
-      x
+      N
     ] }),
-    /* @__PURE__ */ e("div", { className: "flex-1 overflow-auto", children: m && y.length === 0 ? /* @__PURE__ */ e("div", { className: "h-32 flex items-center justify-center", children: /* @__PURE__ */ c("div", { className: "flex items-center space-x-2", children: [
+    /* @__PURE__ */ e("div", { className: "flex-1 overflow-auto", children: m && y.length === 0 ? /* @__PURE__ */ e("div", { className: "h-32 flex items-center justify-center", children: /* @__PURE__ */ d("div", { className: "flex items-center space-x-2", children: [
       /* @__PURE__ */ e("div", { className: "w-4 h-4 animate-spin rounded-full border-2 border-primary border-t-transparent" }),
-      /* @__PURE__ */ c("span", { className: "text-sm text-stone", children: [
+      /* @__PURE__ */ d("span", { className: "text-sm text-stone", children: [
         "Loading ",
-        a,
+        i,
         "..."
       ] })
-    ] }) }) : y.length === 0 ? /* @__PURE__ */ c("div", { className: "p-6 text-center", children: [
+    ] }) }) : y.length === 0 ? /* @__PURE__ */ d("div", { className: "p-6 text-center", children: [
       /* @__PURE__ */ e("div", { className: "mx-auto mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-sand", children: /* @__PURE__ */ e(ce, { className: "h-8 w-8 text-charcoal" }) }),
-      /* @__PURE__ */ e("h3", { className: "text-sm font-semibold text-charcoal mb-2", children: o ? `No ${a} found` : u.length > 0 ? `Already chatting with all ${a}` : `No ${a} yet` }),
-      /* @__PURE__ */ e("p", { className: "text-xs text-stone", children: o ? "Try a different search term" : u.length > 0 ? `You have existing conversations with all your ${a}` : `${a.charAt(0).toUpperCase() + a.slice(1)} will appear here` })
-    ] }) : /* @__PURE__ */ c("ul", { className: "space-y-0", children: [
+      /* @__PURE__ */ e("h3", { className: "text-sm font-semibold text-charcoal mb-2", children: r ? `No ${i} found` : u.length > 0 ? `Already chatting with all ${i}` : `No ${i} yet` }),
+      /* @__PURE__ */ e("p", { className: "text-xs text-stone", children: r ? "Try a different search term" : u.length > 0 ? `You have existing conversations with all your ${i}` : `${i.charAt(0).toUpperCase() + i.slice(1)} will appear here` })
+    ] }) : /* @__PURE__ */ d("ul", { className: "space-y-0", children: [
       y.map((f) => {
-        const g = f.name || f.email || f.id, v = f.email && f.name ? f.email : f.phone;
+        const x = f.name || f.email || f.id, w = f.email && f.name ? f.email : f.phone;
         return /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
           "button",
           {
@@ -907,46 +907,46 @@ const ze = ({
             onClick: () => k(f),
             onKeyDown: (M) => T(M, f),
             className: "w-full px-4 py-3 hover:bg-sand transition-colors border-b border-sand text-left focus:outline-none focus:ring-2 focus:ring-black",
-            children: /* @__PURE__ */ c("div", { className: "flex items-center justify-between", children: [
-              /* @__PURE__ */ c("div", { className: "flex items-center space-x-3 flex-1 min-w-0", children: [
+            children: /* @__PURE__ */ d("div", { className: "flex items-center justify-between", children: [
+              /* @__PURE__ */ d("div", { className: "flex items-center space-x-3 flex-1 min-w-0", children: [
                 /* @__PURE__ */ e(
                   Y,
                   {
                     id: f.id,
-                    name: g,
+                    name: x,
                     image: f.image,
                     size: 40
                   }
                 ),
-                /* @__PURE__ */ c("div", { className: "flex-1 min-w-0", children: [
-                  /* @__PURE__ */ e("h4", { className: "text-sm font-medium text-charcoal truncate", children: g }),
-                  v && /* @__PURE__ */ e("p", { className: "text-xs text-stone truncate", children: v })
+                /* @__PURE__ */ d("div", { className: "flex-1 min-w-0", children: [
+                  /* @__PURE__ */ e("h4", { className: "text-sm font-medium text-charcoal truncate", children: x }),
+                  w && /* @__PURE__ */ e("p", { className: "text-xs text-stone truncate", children: w })
                 ] })
               ] }),
-              /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: C === f.id ? /* @__PURE__ */ e(ee, { className: "h-5 w-5 text-primary animate-spin" }) : /* @__PURE__ */ e(ce, { className: "h-5 w-5 text-stone" }) })
+              /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: v === f.id ? /* @__PURE__ */ e(ee, { className: "h-5 w-5 text-primary animate-spin" }) : /* @__PURE__ */ e(ce, { className: "h-5 w-5 text-stone" }) })
             ] })
           }
         ) }, f.id);
       }),
-      m && /* @__PURE__ */ e("li", { className: "p-4 flex justify-center", children: /* @__PURE__ */ c("div", { className: "flex items-center space-x-2", children: [
+      m && /* @__PURE__ */ e("li", { className: "p-4 flex justify-center", children: /* @__PURE__ */ d("div", { className: "flex items-center space-x-2", children: [
         /* @__PURE__ */ e("div", { className: "w-4 h-4 animate-spin rounded-full border-2 border-primary border-t-transparent" }),
         /* @__PURE__ */ e("span", { className: "text-sm text-stone", children: "Loading more..." })
       ] }) })
     ] }) })
   ] });
-}, qe = ({ hasChannels: t, onStartConversation: s, participantLabel: n }) => /* @__PURE__ */ e("div", { className: "messaging-empty-state flex items-center justify-center h-full p-8 text-balance", children: /* @__PURE__ */ c("div", { className: "text-center max-w-sm", children: [
+}, qe = ({ hasChannels: t, onStartConversation: s, participantLabel: n }) => /* @__PURE__ */ e("div", { className: "messaging-empty-state flex items-center justify-center h-full p-8 text-balance", children: /* @__PURE__ */ d("div", { className: "text-center max-w-sm", children: [
   /* @__PURE__ */ e("div", { className: "w-24 h-24 bg-primary-alt/10 rounded-full flex items-center justify-center mx-auto mb-6", children: /* @__PURE__ */ e("span", { className: "text-4xl", children: "💬" }) }),
   /* @__PURE__ */ e("h2", { className: "font-semibold text-charcoal", children: "Welcome to Messages" }),
-  /* @__PURE__ */ e("p", { className: "text-stone text-sm mb-6", children: t ? /* @__PURE__ */ c(oe, { children: [
+  /* @__PURE__ */ e("p", { className: "text-stone text-sm mb-6", children: t ? /* @__PURE__ */ d(oe, { children: [
     "Choose a conversation from the list or",
     " ",
-    s && /* @__PURE__ */ c(de, { onClick: s, children: [
+    s && /* @__PURE__ */ d(de, { onClick: s, children: [
       "start a new conversation with a ",
       n.slice(0, -1),
       "."
     ] })
-  ] }) : s && /* @__PURE__ */ c(oe, { children: [
-    /* @__PURE__ */ c(de, { onClick: s, children: [
+  ] }) : s && /* @__PURE__ */ d(oe, { children: [
+    /* @__PURE__ */ d(de, { onClick: s, children: [
       "Start a new conversation with one of your ",
       n
     ] }),
@@ -964,7 +964,7 @@ const ze = ({
     className: "inline-flex items-center gap-1 text-sm font-medium text-primary hover:text-primary-alt focus:outline-none focus:ring-2 focus:ring-primary",
     children: s
   }
-), le = ({ message: t, onBack: s }) => /* @__PURE__ */ e("div", { className: "messaging-error-state flex items-center justify-center h-full p-8", children: /* @__PURE__ */ c("div", { className: "text-center max-w-sm", children: [
+), le = ({ message: t, onBack: s }) => /* @__PURE__ */ e("div", { className: "messaging-error-state flex items-center justify-center h-full p-8", children: /* @__PURE__ */ d("div", { className: "text-center max-w-sm", children: [
   /* @__PURE__ */ e("div", { className: "w-24 h-24 bg-danger-alt/20 rounded-full flex items-center justify-center mx-auto mb-6", children: /* @__PURE__ */ e("span", { className: "text-4xl", children: "⚠️" }) }),
   /* @__PURE__ */ e("h2", { className: "font-semibold text-charcoal mb-2", children: "Oops!" }),
   /* @__PURE__ */ e("p", { className: "text-stone text-sm mb-6", children: t }),
@@ -977,12 +977,12 @@ const ze = ({
       children: "Go Back"
     }
   )
-] }) }), Xe = ({ className: t, message: s }) => /* @__PURE__ */ c(
+] }) }), Xe = ({ className: t, message: s }) => /* @__PURE__ */ d(
   "div",
   {
     className: D("flex items-center justify-center h-full", t),
     children: [
-      /* @__PURE__ */ c("svg", { viewBox: "0 0 100 100", className: "size-8 fill-pebble", stroke: "none", children: [
+      /* @__PURE__ */ d("svg", { viewBox: "0 0 100 100", className: "size-8 fill-pebble", stroke: "none", children: [
         /* @__PURE__ */ e("circle", { cx: "6", cy: "50", r: "6", children: /* @__PURE__ */ e(
           "animateTransform",
           {
@@ -1020,7 +1020,7 @@ const ze = ({
       s && /* @__PURE__ */ e("span", { className: "text-stone", children: s })
     ]
   }
-), Qe = () => /* @__PURE__ */ e("div", { className: "messaging-loading-state flex items-center justify-center h-full", children: /* @__PURE__ */ c("div", { className: "flex items-center", children: [
+), Qe = () => /* @__PURE__ */ e("div", { className: "messaging-loading-state flex items-center justify-center h-full", children: /* @__PURE__ */ d("div", { className: "flex items-center", children: [
   /* @__PURE__ */ e(Xe, { className: "w-6 h-6" }),
   /* @__PURE__ */ e("span", { className: "text-sm text-stone", children: "Loading messages" })
 ] }) }), rs = ({
@@ -1028,34 +1028,34 @@ const ze = ({
   className: s,
   renderMessageInputActions: n,
   onChannelSelect: l,
-  onParticipantSelect: a,
-  initialParticipantFilter: d,
-  initialParticipantData: i,
-  CustomChannelEmptyState: r,
-  showChannelList: o = !0
+  onParticipantSelect: i,
+  initialParticipantFilter: c,
+  initialParticipantData: a,
+  CustomChannelEmptyState: o,
+  showChannelList: r = !0
 }) => {
   const {
-    service: w,
+    service: b,
     client: u,
-    isConnected: N,
+    isConnected: g,
     isLoading: m,
-    error: E,
-    refreshConnection: x,
+    error: I,
+    refreshConnection: N,
     debug: h
-  } = Le(), [C, S] = I(null), [O, y] = I(!1), [k, T] = I(!1), [f, g] = I(/* @__PURE__ */ new Set()), [v, M] = I(0), [p, L] = I(!1), [$, _] = I(null), V = H(null), {
+  } = Le(), [v, S] = E(null), [O, y] = E(!1), [k, T] = E(!1), [f, x] = E(/* @__PURE__ */ new Set()), [w, M] = E(0), [p, L] = E(!1), [$, _] = E(null), V = H(null), {
     showStartConversation: Q = !1,
     participantSource: W,
     participantLabel: z = "participants"
   } = t, R = H(null), P = U(async () => {
-    if (!u || !N) return;
-    const b = u.userID;
-    if (b)
+    if (!u || !g) return;
+    const C = u.userID;
+    if (C)
       try {
-        h && console.log("[MessagingShell] Syncing channels for user:", b);
+        h && console.log("[MessagingShell] Syncing channels for user:", C);
         const j = await u.queryChannels(
           {
             type: "messaging",
-            members: { $in: [b] }
+            members: { $in: [C] }
           },
           {},
           { limit: 100 }
@@ -1065,34 +1065,34 @@ const ze = ({
           Object.values(be).forEach((Ce) => {
             var ae;
             const re = (ae = Ce.user) == null ? void 0 : ae.id;
-            re && re !== b && F.add(re);
+            re && re !== C && F.add(re);
           });
-        }), g(F), y(j.length > 0), R.current = b, h && console.log("[MessagingShell] Channels synced successfully:", {
+        }), x(F), y(j.length > 0), R.current = C, h && console.log("[MessagingShell] Channels synced successfully:", {
           channelCount: j.length,
           memberCount: F.size
         });
       } catch (j) {
         console.error("[MessagingShell] Failed to sync channels:", j);
       }
-  }, [u, N, h]);
+  }, [u, g, h]);
   G(() => {
-    if (!u || !N) return;
-    const b = u.userID;
-    b && R.current !== b && P();
-  }, [u, N, P]), G(() => {
-    if (!d || !u || !N) return;
+    if (!u || !g) return;
+    const C = u.userID;
+    C && R.current !== C && P();
+  }, [u, g, P]), G(() => {
+    if (!c || !u || !g) return;
     (async () => {
       const j = u.userID;
       if (j)
         try {
           h && console.log(
             "[MessagingShell] Loading initial conversation with:",
-            d
+            c
           );
           const F = await u.queryChannels(
             {
               type: "messaging",
-              members: { $eq: [j, d] }
+              members: { $eq: [j, c] }
             },
             {},
             { limit: 1 }
@@ -1102,17 +1102,17 @@ const ze = ({
               "[MessagingShell] Initial conversation loaded:",
               F[0].id
             );
-          else if (i && w) {
+          else if (a && b) {
             h && console.log(
               "[MessagingShell] No conversation found, creating one for:",
-              i
+              a
             );
             try {
-              const B = await w.startChannelWithParticipant({
-                id: i.id,
-                name: i.name,
-                email: i.email,
-                phone: i.phone
+              const B = await b.startChannelWithParticipant({
+                id: a.id,
+                name: a.name,
+                email: a.email,
+                phone: a.phone
               });
               S(B), L(!0), _(null), l && l(B), h && console.log(
                 "[MessagingShell] Channel created and loaded:",
@@ -1129,7 +1129,7 @@ const ze = ({
               "No conversation found with this account"
             ), h && console.log(
               "[MessagingShell] No conversation found for:",
-              d
+              c
             );
         } catch (F) {
           console.error(
@@ -1139,71 +1139,71 @@ const ze = ({
         }
     })();
   }, [
-    d,
-    i,
+    c,
+    a,
     u,
-    N,
-    w,
+    g,
+    b,
     h,
     l
   ]);
   const A = U(
-    (b) => {
-      S(b), l == null || l(b);
+    (C) => {
+      S(C), l == null || l(C);
     },
     [l]
   ), q = U(() => {
     p || S(null);
   }, [p]), Z = U(() => {
-    var b;
-    W && (M((j) => j + 1), T(!0), (b = V.current) == null || b.showModal());
+    var C;
+    W && (M((j) => j + 1), T(!0), (C = V.current) == null || C.showModal());
   }, [W]), ge = U(
-    async (b) => {
+    async (C) => {
       var j;
-      if (w)
+      if (b)
         try {
           h && console.log(
             "[MessagingShell] Starting conversation with:",
-            b.id
+            C.id
           );
-          const F = await w.startChannelWithParticipant({
-            id: b.id,
-            name: b.name,
-            email: b.email,
-            phone: b.phone
+          const F = await b.startChannelWithParticipant({
+            id: C.id,
+            name: C.name,
+            email: C.email,
+            phone: C.phone
           });
           try {
             await F.show();
           } catch (B) {
             console.warn("[MessagingShell] Failed to unhide channel:", B);
           }
-          S(F), T(!1), (j = V.current) == null || j.close(), a == null || a(b);
+          S(F), T(!1), (j = V.current) == null || j.close(), i == null || i(C);
         } catch (F) {
           console.error("[MessagingShell] Failed to start conversation:", F);
         }
     },
-    [w, a, h]
+    [b, i, h]
   ), te = U(() => {
-    var b;
-    T(!1), (b = V.current) == null || b.close();
+    var C;
+    T(!1), (C = V.current) == null || C.close();
   }, []), xe = U(
-    async (b) => {
-      h && console.log("[MessagingShell] Leaving conversation:", b.id), S(null), L(!1), R.current = null, await P();
+    async (C) => {
+      h && console.log("[MessagingShell] Leaving conversation:", C.id), S(null), L(!1), R.current = null, await P();
     },
     [P, h]
   ), Ne = U(
-    async (b) => {
-      h && console.log("[MessagingShell] Blocking participant:", b), S(null), L(!1), R.current = null, await P();
+    async (C) => {
+      h && console.log("[MessagingShell] Blocking participant:", C), S(null), L(!1), R.current = null, await P();
     },
     [P, h]
-  ), J = !!C;
-  return m ? /* @__PURE__ */ e("div", { className: D("h-full", s), children: /* @__PURE__ */ e(Qe, {}) }) : E ? /* @__PURE__ */ e("div", { className: D("h-full", s), children: /* @__PURE__ */ e(le, { message: E, onBack: x }) }) : !N || !u ? /* @__PURE__ */ e("div", { className: D("h-full", s), children: /* @__PURE__ */ e(
+  ), J = !!v;
+  return m ? /* @__PURE__ */ e("div", { className: D("h-full", s), children: /* @__PURE__ */ e(Qe, {}) }) : I ? /* @__PURE__ */ e("div", { className: D("h-full", s), children: /* @__PURE__ */ e(le, { message: I, onBack: N }) }) : !g || !u ? /* @__PURE__ */ e("div", { className: D("h-full", s), children: /* @__PURE__ */ e(
     le,
     {
       message: "Not connected to messaging service",
-      onBack: x
+      onBack: N
     }
-  ) }) : $ ? /* @__PURE__ */ e("div", { className: D("h-full", s), children: /* @__PURE__ */ e(le, { message: $ }) }) : /* @__PURE__ */ c(
+  ) }) : $ ? /* @__PURE__ */ e("div", { className: D("h-full", s), children: /* @__PURE__ */ e(le, { message: $ }) }) : /* @__PURE__ */ d(
     "div",
     {
       className: D(
@@ -1211,7 +1211,7 @@ const ze = ({
         s
       ),
       children: [
-        /* @__PURE__ */ c("div", { className: "flex h-full min-h-0", children: [
+        /* @__PURE__ */ d("div", { className: "flex h-full min-h-0", children: [
           /* @__PURE__ */ e(
             "div",
             {
@@ -1219,18 +1219,18 @@ const ze = ({
                 "messaging-channel-list-sidebar min-h-0 min-w-0 bg-white lg:bg-chalk lg:flex lg:flex-col lg:border-r lg:border-sand",
                 {
                   // Explicitly hidden via prop or in direct conversation mode
-                  "!hidden": o === !1 || p,
+                  "!hidden": r === !1 || p,
                   // Normal mode: hide on mobile when channel selected, show on desktop
-                  "hidden lg:flex lg:w-80 lg:min-w-[280px] lg:max-w-[360px]": o !== !1 && !p && J,
+                  "hidden lg:flex lg:w-80 lg:min-w-[280px] lg:max-w-[360px]": r !== !1 && !p && J,
                   // Normal mode: show when no channel selected
-                  "flex flex-col w-full lg:flex-1 lg:max-w-2xl": o !== !1 && !p && !J
+                  "flex flex-col w-full lg:flex-1 lg:max-w-2xl": r !== !1 && !p && !J
                 }
               ),
               children: /* @__PURE__ */ e(
                 Be,
                 {
                   onChannelSelect: A,
-                  selectedChannel: C || void 0,
+                  selectedChannel: v || void 0,
                   showStartConversation: Q && !!W,
                   onStartConversation: Z,
                   participantLabel: z
@@ -1250,18 +1250,18 @@ const ze = ({
                   "hidden lg:flex": !p && !J
                 }
               ),
-              children: C ? /* @__PURE__ */ e("div", { className: "flex-1 min-h-0 flex flex-col", children: /* @__PURE__ */ e(
+              children: v ? /* @__PURE__ */ e("div", { className: "flex-1 min-h-0 flex flex-col", children: /* @__PURE__ */ e(
                 Ve,
                 {
-                  channel: C,
+                  channel: v,
                   onBack: q,
                   showBackButton: !p,
                   renderMessageInputActions: n,
                   onLeaveConversation: xe,
                   onBlockParticipant: Ne,
-                  CustomChannelEmptyState: r
+                  CustomChannelEmptyState: o
                 },
-                C.id
+                v.id
               ) }) : /* @__PURE__ */ e(
                 qe,
                 {
@@ -1279,8 +1279,8 @@ const ze = ({
           {
             ref: V,
             className: "mes-dialog",
-            onClick: (b) => {
-              b.target === V.current && te();
+            onClick: (C) => {
+              C.target === V.current && te();
             },
             onClose: te,
             children: /* @__PURE__ */ e("div", { className: "h-full w-full bg-white shadow-max-elevation-light", children: /* @__PURE__ */ e(
@@ -1293,7 +1293,7 @@ const ze = ({
                 participantLabel: z,
                 searchPlaceholder: `Search ${z}...`
               },
-              v
+              w
             ) })
           }
         )
@@ -1327,74 +1327,74 @@ const ze = ({
   onFaqClick: s,
   loadingFaqId: n,
   headerText: l,
-  className: a,
-  avatarImage: d,
-  avatarName: i
+  className: i,
+  avatarImage: c,
+  avatarName: a
 }) => {
-  const r = t.filter((o) => o.enabled).sort((o, w) => (o.order ?? 0) - (w.order ?? 0));
-  return r.length === 0 ? null : /* @__PURE__ */ e("div", { className: D("px-4 py-6", a), children: /* @__PURE__ */ c("div", { className: "flex gap-3 items-end", children: [
-    (d || i) && /* @__PURE__ */ e("div", { className: "flex-none", children: /* @__PURE__ */ e(
+  const o = t.filter((r) => r.enabled).sort((r, b) => (r.order ?? 0) - (b.order ?? 0));
+  return o.length === 0 ? null : /* @__PURE__ */ e("div", { className: D("px-4 py-6", i), children: /* @__PURE__ */ d("div", { className: "flex gap-3 items-end", children: [
+    (c || a) && /* @__PURE__ */ e("div", { className: "flex-none", children: /* @__PURE__ */ e(
       Y,
       {
-        id: i || "account",
-        name: i || "Account",
-        image: d,
+        id: a || "account",
+        name: a || "Account",
+        image: c,
         size: 24
       }
     ) }),
-    /* @__PURE__ */ c(
+    /* @__PURE__ */ d(
       "div",
       {
         className: "flex-1 rounded-lg p-4 space-y-3",
         style: { backgroundColor: "#F1F0EE" },
         children: [
           l && /* @__PURE__ */ e("p", { className: "text-md text-charcoal mb-4", children: l }),
-          r.map((o) => /* @__PURE__ */ e(
+          o.map((r) => /* @__PURE__ */ e(
             Ze,
             {
-              question: o.question,
-              onClick: () => s(o.id),
-              loading: n === o.id
+              question: r.question,
+              onClick: () => s(r.id),
+              loading: n === r.id
             },
-            o.id
+            r.id
           ))
         ]
       }
     )
   ] }) });
 }, os = (t, s = {}) => {
-  const { initialSearch: n = "", pageSize: l = 20 } = s, [a, d] = I([]), [i, r] = I(!1), [o, w] = I(null), [u, N] = I(n), [m, E] = I(!0), [x, h] = I(), C = U(async (k = !1, T) => {
-    if (i) return;
+  const { initialSearch: n = "", pageSize: l = 20 } = s, [i, c] = E([]), [a, o] = E(!1), [r, b] = E(null), [u, g] = E(n), [m, I] = E(!0), [N, h] = E(), v = U(async (k = !1, T) => {
+    if (a) return;
     const f = T !== void 0 ? T : u;
-    r(!0), w(null);
+    o(!0), b(null);
     try {
-      const g = await t.loadParticipants({
+      const x = await t.loadParticipants({
         search: f || void 0,
         limit: l,
-        cursor: k ? void 0 : x
+        cursor: k ? void 0 : N
       });
-      d(
-        (v) => k ? g.participants : [...v, ...g.participants]
-      ), E(g.hasMore), h(g.nextCursor);
-    } catch (g) {
-      const v = g instanceof Error ? g.message : "Failed to load participants";
-      w(v), console.error("[useParticipants] Load error:", g);
+      c(
+        (w) => k ? x.participants : [...w, ...x.participants]
+      ), I(x.hasMore), h(x.nextCursor);
+    } catch (x) {
+      const w = x instanceof Error ? x.message : "Failed to load participants";
+      b(w), console.error("[useParticipants] Load error:", x);
     } finally {
-      r(!1);
+      o(!1);
     }
-  }, [t, u, x, l, i]), S = U(() => {
-    m && !i && C(!1);
-  }, [m, i, C]), O = U((k) => {
-    N(k), h(void 0), C(!0, k);
-  }, [C]), y = U(() => {
-    h(void 0), C(!0);
-  }, [C]);
+  }, [t, u, N, l, a]), S = U(() => {
+    m && !a && v(!1);
+  }, [m, a, v]), O = U((k) => {
+    g(k), h(void 0), v(!0, k);
+  }, [v]), y = U(() => {
+    h(void 0), v(!0);
+  }, [v]);
   return G(() => {
-    C(!0);
+    v(!0);
   }, [t.loadParticipants]), {
-    participants: a,
-    loading: i,
-    error: o,
+    participants: i,
+    loading: a,
+    error: r,
     searchQuery: u,
     hasMore: m,
     totalCount: t.totalCount,