stream-chat-react 14.12.0 → 15.0.0-rc.1

package/dist/es/components/Message/ReminderNotification.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ReminderNotification.mjs","names":[],"sources":["../../../../src/components/Message/ReminderNotification.tsx"],"sourcesContent":["import React from 'react';\nimport { useComponentContextIcons, useTranslationContext } from '../../context';\nimport { useStateStore } from '../../store';\nimport type { Reminder, ReminderState } from 'stream-chat';\n\nexport type ReminderNotificationProps = {\n  reminder?: Reminder;\n};\n\nconst reminderStateSelector = (state: ReminderState) => ({\n  timeLeftMs: state.timeLeftMs,\n});\n\nfunction SavedForLaterContent() {\n  const { IconBookmark } = useComponentContextIcons();\n  const { t } = useTranslationContext();\n  return (\n    <div className='str-chat__message-saved-for-later'>\n      <IconBookmark />\n      <span>{t('Saved for later')}</span>\n    </div>\n  );\n}\n\nconst THRESHOLD_RELATIVE_MINUTES = 59;\n\nfunction RemindMeContent({ reminder }: { reminder: Reminder }) {\n  const { IconBell } = useComponentContextIcons();\n  const { t } = useTranslationContext();\n  const { timeLeftMs } = useStateStore(reminder?.state, reminderStateSelector) ?? {};\n\n  const stopRefreshBoundaryMs = reminder?.timer.stopRefreshBoundaryMs;\n  const stopRefreshTimeStamp =\n    reminder?.remindAt && stopRefreshBoundaryMs\n      ? reminder.remindAt.getTime() + stopRefreshBoundaryMs\n      : undefined;\n\n  const isBehindRefreshBoundary =\n    !!stopRefreshTimeStamp && new Date().getTime() > stopRefreshTimeStamp;\n\n  if (timeLeftMs === null || !reminder.remindAt) return null;\n\n  const nowMs = Date.now();\n  const remindAtMs = reminder.remindAt.getTime();\n  const diffMs = remindAtMs - nowMs;\n  const diffMinutes = Math.abs(diffMs) / (60 * 1000);\n  const useAbsoluteFormat = diffMinutes > THRESHOLD_RELATIVE_MINUTES;\n\n  const renderTime = () => {\n    if (isBehindRefreshBoundary) {\n      // Past: reminder time has passed\n      if (useAbsoluteFormat) {\n        // > 59 min ago: calendar + time (same as DateSeparator + HH:mm)\n        // e.g. \"Due since Today at 15:00\", \"Due since Yesterday at 09:30\"\n        return t('Due since {{ dueSince }}', {\n          dueSince: t('timestamp/ReminderNotification', {\n            timestamp: reminder.remindAt,\n          }),\n        });\n      }\n      // Within 59 min ago: relative\n      // e.g. \"Due since 5 minutes ago\", \"Due since a minute ago\"\n      return t('Due since {{ dueSince }}', {\n        dueSince: t('duration/Message reminder', {\n          milliseconds: diffMs,\n        }),\n      });\n    }\n    // Future: reminder not yet due\n    if (useAbsoluteFormat) {\n      // > 59 min from now: calendar + time (no \"Due\" prefix)\n      // e.g. \"Today at 15:00\", \"Tomorrow at 09:30\"\n      return t('timestamp/ReminderNotification', {\n        timestamp: reminder.remindAt,\n      });\n    }\n    // Within 59 min from now: relative\n    // e.g. \"Due in 30 minutes\", \"Due in a minute\"\n    return t('Due {{ timeLeft }}', {\n      timeLeft: t('duration/Message reminder', {\n        milliseconds: timeLeftMs,\n      }),\n    });\n  };\n\n  return (\n    <p className='str-chat__message-reminder'>\n      <IconBell />\n      <span>{t('Reminder set')}</span>\n      <span> · </span>\n      <span className='str-chat__message-reminder__time-left'>{renderTime()}</span>\n    </p>\n  );\n}\n\nexport const ReminderNotification = ({ reminder }: ReminderNotificationProps) => {\n  if (!reminder) return null;\n\n  if (!reminder.remindAt) {\n    return <SavedForLaterContent />;\n  }\n\n  return <RemindMeContent reminder={reminder} />;\n};\n"],"mappings":";;;;;;AASA,IAAM,yBAAyB,WAA0B,EACvD,YAAY,MAAM,WACpB;AAEA,SAAS,uBAAuB;CAC9B,MAAM,EAAE,iBAAiB,yBAAyB;CAClD,MAAM,EAAE,MAAM,sBAAsB;CACpC,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACE,oBAAC,cAAD,CAAe,CAAA,GACf,oBAAC,QAAD,EAAA,UAAO,EAAE,iBAAiB,EAAQ,CAAA,CAC/B;;AAET;AAEA,IAAM,6BAA6B;AAEnC,SAAS,gBAAgB,EAAE,YAAoC;CAC7D,MAAM,EAAE,aAAa,yBAAyB;CAC9C,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,EAAE,eAAe,cAAc,UAAU,OAAO,qBAAqB,KAAK,CAAC;CAEjF,MAAM,wBAAwB,UAAU,MAAM;CAC9C,MAAM,uBACJ,UAAU,YAAY,wBAClB,SAAS,SAAS,QAAQ,IAAI,wBAC9B,KAAA;CAEN,MAAM,0BACJ,CAAC,CAAC,yCAAwB,IAAI,KAAK,EAAA,CAAE,QAAQ,IAAI;CAEnD,IAAI,eAAe,QAAQ,CAAC,SAAS,UAAU,OAAO;CAEtD,MAAM,QAAQ,KAAK,IAAI;CAEvB,MAAM,SADa,SAAS,SAAS,QACtB,IAAa;CAE5B,MAAM,oBADc,KAAK,IAAI,MAAM,KAAK,KAAK,OACL;CAExC,MAAM,mBAAmB;EACvB,IAAI,yBAAyB;GAE3B,IAAI,mBAGF,OAAO,EAAE,4BAA4B,EACnC,UAAU,EAAE,kCAAkC,EAC5C,WAAW,SAAS,SACtB,CAAC,EACH,CAAC;GAIH,OAAO,EAAE,4BAA4B,EACnC,UAAU,EAAE,6BAA6B,EACvC,cAAc,OAChB,CAAC,EACH,CAAC;EACH;EAEA,IAAI,mBAGF,OAAO,EAAE,kCAAkC,EACzC,WAAW,SAAS,SACtB,CAAC;EAIH,OAAO,EAAE,sBAAsB,EAC7B,UAAU,EAAE,6BAA6B,EACvC,cAAc,WAChB,CAAC,EACH,CAAC;CACH;CAEA,OACE,qBAAC,KAAD;EAAG,WAAU;YAAb;GACE,oBAAC,UAAD,CAAW,CAAA;GACX,oBAAC,QAAD,EAAA,UAAO,EAAE,cAAc,EAAQ,CAAA;GAC/B,oBAAC,QAAD,EAAA,UAAM,MAAS,CAAA;GACf,oBAAC,QAAD;IAAM,WAAU;cAAyC,WAAW;GAAQ,CAAA;EAC3E;;AAEP;AAEA,IAAa,wBAAwB,EAAE,eAA0C;CAC/E,IAAI,CAAC,UAAU,OAAO;CAEtB,IAAI,CAAC,SAAS,UACZ,OAAO,oBAAC,sBAAD,CAAuB,CAAA;CAGhC,OAAO,oBAAC,iBAAD,EAA2B,SAAW,CAAA;AAC/C"}
+{"version":3,"file":"ReminderNotification.mjs","names":[],"sources":["../../../../src/components/Message/ReminderNotification.tsx"],"sourcesContent":["import React from 'react';\nimport { useComponentContextIcons, useTranslationContext } from '../../context';\nimport { useStateStore } from '../../store';\nimport type { Reminder, ReminderState } from 'stream-chat';\nimport { nsToDate, nsToMs } from 'stream-chat';\n\nexport type ReminderNotificationProps = {\n  reminder?: Reminder;\n};\n\nconst reminderStateSelector = (state: ReminderState) => ({\n  timeLeftMs: state.timeLeftMs,\n});\n\nfunction SavedForLaterContent() {\n  const { IconBookmark } = useComponentContextIcons();\n  const { t } = useTranslationContext();\n  return (\n    <div className='str-chat__message-saved-for-later'>\n      <IconBookmark />\n      <span>{t('common.savedLater.text', 'Saved for later')}</span>\n    </div>\n  );\n}\n\nconst THRESHOLD_RELATIVE_MINUTES = 59;\n\nfunction RemindMeContent({ reminder }: { reminder: Reminder }) {\n  const { IconBell } = useComponentContextIcons();\n  const { t } = useTranslationContext();\n  const { timeLeftMs } = useStateStore(reminder?.state, reminderStateSelector) ?? {};\n\n  const stopRefreshBoundaryMs = reminder?.timer.stopRefreshBoundaryMs;\n  // Nullish, not truthy: `remindAt` is unix nanoseconds and `0` is a legitimate value (the epoch),\n  // so a truthiness guard leaves an overdue epoch reminder with no refresh boundary at all.\n  const stopRefreshTimeStamp =\n    reminder?.remindAt != null && stopRefreshBoundaryMs != null\n      ? nsToMs(reminder.remindAt) + stopRefreshBoundaryMs\n      : undefined;\n\n  const isBehindRefreshBoundary =\n    stopRefreshTimeStamp != null && new Date().getTime() > stopRefreshTimeStamp;\n\n  if (timeLeftMs === null || reminder.remindAt == null) return null;\n\n  const nowMs = Date.now();\n  const remindAtMs = nsToMs(reminder.remindAt);\n  const diffMs = remindAtMs - nowMs;\n  const diffMinutes = Math.abs(diffMs) / (60 * 1000);\n  const useAbsoluteFormat = diffMinutes > THRESHOLD_RELATIVE_MINUTES;\n\n  const renderTime = () => {\n    if (isBehindRefreshBoundary) {\n      // Past: reminder time has passed\n      if (useAbsoluteFormat) {\n        // > 59 min ago: calendar + time (same as DateSeparator + HH:mm)\n        // e.g. \"Due since Today at 15:00\", \"Due since Yesterday at 09:30\"\n        return t(\n          'message.reminderNotification.dueSince.label',\n          'Due since {{ dueSince }}',\n          {\n            dueSince: t('timestamp.ReminderNotification', {\n              timestamp:\n                reminder.remindAt != null ? nsToDate(reminder.remindAt) : undefined,\n            }),\n          },\n        );\n      }\n      // Within 59 min ago: relative\n      // e.g. \"Due since 5 minutes ago\", \"Due since a minute ago\"\n      return t(\n        'message.reminderNotification.dueSince.label',\n        'Due since {{ dueSince }}',\n        {\n          dueSince: t('duration.messageReminder', {\n            milliseconds: diffMs,\n          }),\n        },\n      );\n    }\n    // Future: reminder not yet due\n    if (useAbsoluteFormat) {\n      // > 59 min from now: calendar + time (no \"Due\" prefix)\n      // e.g. \"Today at 15:00\", \"Tomorrow at 09:30\"\n      return t('timestamp.ReminderNotification', {\n        timestamp: reminder.remindAt != null ? nsToDate(reminder.remindAt) : undefined,\n      });\n    }\n    // Within 59 min from now: relative\n    // e.g. \"Due in 30 minutes\", \"Due in a minute\"\n    return t('message.reminderNotification.due.label', 'Due {{ timeLeft }}', {\n      timeLeft: t('duration.messageReminder', {\n        milliseconds: timeLeftMs,\n      }),\n    });\n  };\n\n  return (\n    <p className='str-chat__message-reminder'>\n      <IconBell />\n      <span>{t('common.reminderSet.text', 'Reminder set')}</span>\n      <span> · </span>\n      <span className='str-chat__message-reminder__time-left'>{renderTime()}</span>\n    </p>\n  );\n}\n\nexport const ReminderNotification = ({ reminder }: ReminderNotificationProps) => {\n  if (!reminder) return null;\n\n  // Nullish, not truthy: `remindAt` is `null` only when the message is saved for later without a\n  // deadline. `0` is a real deadline (the epoch) and must render as an overdue reminder.\n  if (reminder.remindAt == null) {\n    return <SavedForLaterContent />;\n  }\n\n  return <RemindMeContent reminder={reminder} />;\n};\n"],"mappings":";;;;;;;AAUA,IAAM,yBAAyB,WAA0B,EACvD,YAAY,MAAM,WACpB;AAEA,SAAS,uBAAuB;CAC9B,MAAM,EAAE,iBAAiB,yBAAyB;CAClD,MAAM,EAAE,MAAM,sBAAsB;CACpC,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACE,oBAAC,cAAD,CAAe,CAAA,GACf,oBAAC,QAAD,EAAA,UAAO,EAAE,0BAA0B,iBAAiB,EAAQ,CAAA,CACzD;;AAET;AAEA,IAAM,6BAA6B;AAEnC,SAAS,gBAAgB,EAAE,YAAoC;CAC7D,MAAM,EAAE,aAAa,yBAAyB;CAC9C,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,EAAE,eAAe,cAAc,UAAU,OAAO,qBAAqB,KAAK,CAAC;CAEjF,MAAM,wBAAwB,UAAU,MAAM;CAG9C,MAAM,uBACJ,UAAU,YAAY,QAAQ,yBAAyB,OACnD,OAAO,SAAS,QAAQ,IAAI,wBAC5B,KAAA;CAEN,MAAM,0BACJ,wBAAwB,yBAAQ,IAAI,KAAK,EAAA,CAAE,QAAQ,IAAI;CAEzD,IAAI,eAAe,QAAQ,SAAS,YAAY,MAAM,OAAO;CAE7D,MAAM,QAAQ,KAAK,IAAI;CAEvB,MAAM,SADa,OAAO,SAAS,QACpB,IAAa;CAE5B,MAAM,oBADc,KAAK,IAAI,MAAM,KAAK,KAAK,OACL;CAExC,MAAM,mBAAmB;EACvB,IAAI,yBAAyB;GAE3B,IAAI,mBAGF,OAAO,EACL,+CACA,4BACA,EACE,UAAU,EAAE,kCAAkC,EAC5C,WACE,SAAS,YAAY,OAAO,SAAS,SAAS,QAAQ,IAAI,KAAA,EAC9D,CAAC,EACH,CACF;GAIF,OAAO,EACL,+CACA,4BACA,EACE,UAAU,EAAE,4BAA4B,EACtC,cAAc,OAChB,CAAC,EACH,CACF;EACF;EAEA,IAAI,mBAGF,OAAO,EAAE,kCAAkC,EACzC,WAAW,SAAS,YAAY,OAAO,SAAS,SAAS,QAAQ,IAAI,KAAA,EACvE,CAAC;EAIH,OAAO,EAAE,0CAA0C,sBAAsB,EACvE,UAAU,EAAE,4BAA4B,EACtC,cAAc,WAChB,CAAC,EACH,CAAC;CACH;CAEA,OACE,qBAAC,KAAD;EAAG,WAAU;YAAb;GACE,oBAAC,UAAD,CAAW,CAAA;GACX,oBAAC,QAAD,EAAA,UAAO,EAAE,2BAA2B,cAAc,EAAQ,CAAA;GAC1D,oBAAC,QAAD,EAAA,UAAM,MAAS,CAAA;GACf,oBAAC,QAAD;IAAM,WAAU;cAAyC,WAAW;GAAQ,CAAA;EAC3E;;AAEP;AAEA,IAAa,wBAAwB,EAAE,eAA0C;CAC/E,IAAI,CAAC,UAAU,OAAO;CAItB,IAAI,SAAS,YAAY,MACvB,OAAO,oBAAC,sBAAD,CAAuB,CAAA;CAGhC,OAAO,oBAAC,iBAAD,EAA2B,SAAW,CAAA;AAC/C"}

package/dist/es/components/Message/StreamedMessageText.mjs

@@ -1,14 +1,14 @@
-import { useChannelStateContext } from "../../context/ChannelStateContext.mjs";
 import { useMessageContext } from "../../context/MessageContext.mjs";
 import { useMessageTextStreaming } from "./hooks/useMessageTextStreaming.mjs";
 import { MessageText } from "./MessageText.mjs";
+import { useChannel } from "../../context/useChannel.mjs";
 import { useEffect } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/Message/StreamedMessageText.tsx
 var StreamedMessageText = (props) => {
 	const { message: messageFromProps, renderingLetterCount, renderText, streamingLetterIntervalMs } = props;
-	const { message: messageFromContext } = useMessageContext("StreamedMessageText");
-	const { channel } = useChannelStateContext();
+	const { message: messageFromContext } = useMessageContext();
+	const channel = useChannel();
 	const message = messageFromProps || messageFromContext;
 	const { text = "" } = message;
 	const { skipAnimation, streamedMessageText } = useMessageTextStreaming({
@@ -17,9 +17,10 @@ var StreamedMessageText = (props) => {
 		text
 	});
 	useEffect(() => {
-		channel?.on("ai_indicator.stop", () => {
+		const subscription = channel?.on("ai_indicator.stop", () => {
 			skipAnimation();
 		});
+		return () => subscription?.unsubscribe();
 	}, [channel, skipAnimation]);
 	return /* @__PURE__ */ jsx(MessageText, {
 		message: {

package/dist/es/components/Message/StreamedMessageText.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"StreamedMessageText.mjs","names":[],"sources":["../../../../src/components/Message/StreamedMessageText.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\n\nimport type { MessageTextProps } from './MessageText';\nimport { MessageText } from './MessageText';\n\nimport { useChannelStateContext, useMessageContext } from '../../context';\nimport { useMessageTextStreaming } from './hooks';\n\nexport type StreamedMessageTextProps = Pick<\n  MessageTextProps,\n  'message' | 'renderText'\n> & {\n  renderingLetterCount?: number;\n  streamingLetterIntervalMs?: number;\n};\n\nexport const StreamedMessageText = (props: StreamedMessageTextProps) => {\n  const {\n    message: messageFromProps,\n    renderingLetterCount,\n    renderText,\n    streamingLetterIntervalMs,\n  } = props;\n  const { message: messageFromContext } = useMessageContext('StreamedMessageText');\n  const { channel } = useChannelStateContext();\n  const message = messageFromProps || messageFromContext;\n  const { text = '' } = message;\n  const { skipAnimation, streamedMessageText } = useMessageTextStreaming({\n    renderingLetterCount,\n    streamingLetterIntervalMs,\n    text,\n  });\n\n  useEffect(() => {\n    channel?.on('ai_indicator.stop', () => {\n      skipAnimation();\n    });\n  }, [channel, skipAnimation]);\n\n  return (\n    <MessageText\n      message={{ ...message, text: streamedMessageText }}\n      renderText={renderText}\n    />\n  );\n};\n"],"mappings":";;;;;;;AAgBA,IAAa,uBAAuB,UAAoC;CACtE,MAAM,EACJ,SAAS,kBACT,sBACA,YACA,8BACE;CACJ,MAAM,EAAE,SAAS,uBAAuB,kBAAkB,qBAAqB;CAC/E,MAAM,EAAE,YAAY,uBAAuB;CAC3C,MAAM,UAAU,oBAAoB;CACpC,MAAM,EAAE,OAAO,OAAO;CACtB,MAAM,EAAE,eAAe,wBAAwB,wBAAwB;EACrE;EACA;EACA;CACF,CAAC;CAED,gBAAgB;EACd,SAAS,GAAG,2BAA2B;GACrC,cAAc;EAChB,CAAC;CACH,GAAG,CAAC,SAAS,aAAa,CAAC;CAE3B,OACE,oBAAC,aAAD;EACE,SAAS;GAAE,GAAG;GAAS,MAAM;EAAoB;EACrC;CACb,CAAA;AAEL"}
+{"version":3,"file":"StreamedMessageText.mjs","names":[],"sources":["../../../../src/components/Message/StreamedMessageText.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\n\nimport type { MessageTextProps } from './MessageText';\nimport { MessageText } from './MessageText';\n\nimport { useChannel, useMessageContext } from '../../context';\nimport { useMessageTextStreaming } from './hooks';\n\nexport type StreamedMessageTextProps = Pick<\n  MessageTextProps,\n  'message' | 'renderText'\n> & {\n  renderingLetterCount?: number;\n  streamingLetterIntervalMs?: number;\n};\n\nexport const StreamedMessageText = (props: StreamedMessageTextProps) => {\n  const {\n    message: messageFromProps,\n    renderingLetterCount,\n    renderText,\n    streamingLetterIntervalMs,\n  } = props;\n  const { message: messageFromContext } = useMessageContext();\n  const channel = useChannel();\n  const message = messageFromProps || messageFromContext;\n  const { text = '' } = message;\n  const { skipAnimation, streamedMessageText } = useMessageTextStreaming({\n    renderingLetterCount,\n    streamingLetterIntervalMs,\n    text,\n  });\n\n  useEffect(() => {\n    const subscription = channel?.on('ai_indicator.stop', () => {\n      skipAnimation();\n    });\n    return () => subscription?.unsubscribe();\n  }, [channel, skipAnimation]);\n\n  return (\n    <MessageText\n      message={{ ...message, text: streamedMessageText }}\n      renderText={renderText}\n    />\n  );\n};\n"],"mappings":";;;;;;;AAgBA,IAAa,uBAAuB,UAAoC;CACtE,MAAM,EACJ,SAAS,kBACT,sBACA,YACA,8BACE;CACJ,MAAM,EAAE,SAAS,uBAAuB,kBAAkB;CAC1D,MAAM,UAAU,WAAW;CAC3B,MAAM,UAAU,oBAAoB;CACpC,MAAM,EAAE,OAAO,OAAO;CACtB,MAAM,EAAE,eAAe,wBAAwB,wBAAwB;EACrE;EACA;EACA;CACF,CAAC;CAED,gBAAgB;EACd,MAAM,eAAe,SAAS,GAAG,2BAA2B;GAC1D,cAAc;EAChB,CAAC;EACD,aAAa,cAAc,YAAY;CACzC,GAAG,CAAC,SAAS,aAAa,CAAC;CAE3B,OACE,oBAAC,aAAD;EACE,SAAS;GAAE,GAAG;GAAS,MAAM;EAAoB;EACrC;CACb,CAAA;AAEL"}

package/dist/es/components/Message/Timestamp.mjs

@@ -1,13 +1,13 @@
-import { useMessageContext } from "../../context/MessageContext.mjs";
+import { MessageContext } from "../../context/MessageContext.mjs";
 import { getDateString, isDate } from "../../i18n/utils.mjs";
 import { useTranslationContext } from "../../context/TranslationContext.mjs";
-import { useMemo } from "react";
+import { useContext, useMemo } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/Message/Timestamp.tsx
 function Timestamp(props) {
 	const { calendar, calendarFormats, customClass, format, timestamp } = props;
-	const { formatDate } = useMessageContext("MessageTimestamp");
-	const { t, tDateTimeParser } = useTranslationContext("MessageTimestamp");
+	const { formatDate } = useContext(MessageContext) ?? {};
+	const { t, tDateTimeParser } = useTranslationContext();
 	const normalizedTimestamp = timestamp && isDate(timestamp) ? timestamp.toISOString() : timestamp;
 	const when = useMemo(() => getDateString({
 		calendar,
@@ -17,7 +17,7 @@ function Timestamp(props) {
 		messageCreatedAt: normalizedTimestamp,
 		t,
 		tDateTimeParser,
-		timestampTranslationKey: "timestamp/MessageTimestamp"
+		timestampTranslationKey: "timestamp.MessageTimestamp"
 	}), [
 		calendar,
 		calendarFormats,

package/dist/es/components/Message/Timestamp.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Timestamp.mjs","names":[],"sources":["../../../../src/components/Message/Timestamp.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\n\nimport { useMessageContext } from '../../context/MessageContext';\nimport { useTranslationContext } from '../../context/TranslationContext';\nimport { getDateString, isDate } from '../../i18n/utils';\nimport type { TimestampFormatterOptions } from '../../i18n/types';\n\nexport interface TimestampProps extends TimestampFormatterOptions {\n  /* Adds a CSS class name to the component's outer `time` container. */\n  customClass?: string;\n  /* Timestamp to display */\n  timestamp?: Date | string;\n}\n\nexport function Timestamp(props: TimestampProps) {\n  const { calendar, calendarFormats, customClass, format, timestamp } = props;\n\n  const { formatDate } = useMessageContext('MessageTimestamp');\n  const { t, tDateTimeParser } = useTranslationContext('MessageTimestamp');\n\n  const normalizedTimestamp =\n    timestamp && isDate(timestamp) ? timestamp.toISOString() : timestamp;\n\n  const when = useMemo(\n    () =>\n      getDateString({\n        calendar,\n        calendarFormats,\n        format,\n        formatDate,\n        messageCreatedAt: normalizedTimestamp,\n        t,\n        tDateTimeParser,\n        timestampTranslationKey: 'timestamp/MessageTimestamp',\n      }),\n    [\n      calendar,\n      calendarFormats,\n      format,\n      formatDate,\n      normalizedTimestamp,\n      t,\n      tDateTimeParser,\n    ],\n  );\n\n  if (!when) {\n    return null;\n  }\n\n  return (\n    <time\n      className={customClass}\n      dateTime={normalizedTimestamp}\n      title={normalizedTimestamp}\n    >\n      {when}\n    </time>\n  );\n}\n"],"mappings":";;;;;;AAcA,SAAgB,UAAU,OAAuB;CAC/C,MAAM,EAAE,UAAU,iBAAiB,aAAa,QAAQ,cAAc;CAEtE,MAAM,EAAE,eAAe,kBAAkB,kBAAkB;CAC3D,MAAM,EAAE,GAAG,oBAAoB,sBAAsB,kBAAkB;CAEvE,MAAM,sBACJ,aAAa,OAAO,SAAS,IAAI,UAAU,YAAY,IAAI;CAE7D,MAAM,OAAO,cAET,cAAc;EACZ;EACA;EACA;EACA;EACA,kBAAkB;EAClB;EACA;EACA,yBAAyB;CAC3B,CAAC,GACH;EACE;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CACF;CAEA,IAAI,CAAC,MACH,OAAO;CAGT,OACE,oBAAC,QAAD;EACE,WAAW;EACX,UAAU;EACV,OAAO;YAEN;CACG,CAAA;AAEV"}
+{"version":3,"file":"Timestamp.mjs","names":[],"sources":["../../../../src/components/Message/Timestamp.tsx"],"sourcesContent":["import React, { useContext, useMemo } from 'react';\n\nimport { MessageContext } from '../../context/MessageContext';\nimport { useTranslationContext } from '../../context/TranslationContext';\nimport { getDateString, isDate } from '../../i18n/utils';\nimport type { TimestampFormatterOptions } from '../../i18n/types';\n\nexport interface TimestampProps extends TimestampFormatterOptions {\n  /* Adds a CSS class name to the component's outer `time` container. */\n  customClass?: string;\n  /* Timestamp to display */\n  timestamp?: Date | string;\n}\n\nexport function Timestamp(props: TimestampProps) {\n  const { calendar, calendarFormats, customClass, format, timestamp } = props;\n\n  // also rendered outside a message (channel list items, composer previews)\n  const { formatDate } = useContext(MessageContext) ?? {};\n  const { t, tDateTimeParser } = useTranslationContext();\n\n  const normalizedTimestamp =\n    timestamp && isDate(timestamp) ? timestamp.toISOString() : timestamp;\n\n  const when = useMemo(\n    () =>\n      getDateString({\n        calendar,\n        calendarFormats,\n        format,\n        formatDate,\n        messageCreatedAt: normalizedTimestamp,\n        t,\n        tDateTimeParser,\n        timestampTranslationKey: 'timestamp.MessageTimestamp',\n      }),\n    [\n      calendar,\n      calendarFormats,\n      format,\n      formatDate,\n      normalizedTimestamp,\n      t,\n      tDateTimeParser,\n    ],\n  );\n\n  if (!when) {\n    return null;\n  }\n\n  return (\n    <time\n      className={customClass}\n      dateTime={normalizedTimestamp}\n      title={normalizedTimestamp}\n    >\n      {when}\n    </time>\n  );\n}\n"],"mappings":";;;;;;AAcA,SAAgB,UAAU,OAAuB;CAC/C,MAAM,EAAE,UAAU,iBAAiB,aAAa,QAAQ,cAAc;CAGtE,MAAM,EAAE,eAAe,WAAW,cAAc,KAAK,CAAC;CACtD,MAAM,EAAE,GAAG,oBAAoB,sBAAsB;CAErD,MAAM,sBACJ,aAAa,OAAO,SAAS,IAAI,UAAU,YAAY,IAAI;CAE7D,MAAM,OAAO,cAET,cAAc;EACZ;EACA;EACA;EACA;EACA,kBAAkB;EAClB;EACA;EACA,yBAAyB;CAC3B,CAAC,GACH;EACE;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CACF;CAEA,IAAI,CAAC,MACH,OAAO;CAGT,OACE,oBAAC,QAAD;EACE,WAAW;EACX,UAAU;EACV,OAAO;YAEN;CACG,CAAA;AAEV"}

package/dist/es/components/Message/hooks/useActionHandler.mjs

@@ -1,15 +1,16 @@
-import { useChannelActionContext } from "../../../context/ChannelActionContext.mjs";
-import { useChannelStateContext } from "../../../context/ChannelStateContext.mjs";
 import { useStableCallback } from "../../../utils/useStableCallback.mjs";
+import { useMessagePaginator } from "../../../hooks/useMessagePaginator.mjs";
+import { useChannel } from "../../../context/useChannel.mjs";
+import { formatMessage } from "stream-chat";
 //#region src/components/Message/hooks/useActionHandler.ts
 var handleActionWarning = `Action handler was called, but it is missing one of its required arguments. 
 Make sure the ChannelAction and ChannelState contexts are properly set and the hook is initialized with a valid message.`;
 function useActionHandler(message) {
-	const { removeMessage, updateMessage } = useChannelActionContext("useActionHandler");
-	const { channel } = useChannelStateContext("useActionHandler");
+	const channel = useChannel();
+	const messagePaginator = useMessagePaginator();
 	return useStableCallback(async (dataOrName, value, event) => {
 		if (event) event.preventDefault();
-		if (!message || !updateMessage || !removeMessage || !channel) {
+		if (!message || !channel) {
 			console.warn(handleActionWarning);
 			return;
 		}
@@ -19,8 +20,8 @@ function useActionHandler(message) {
 		else formData = { ...dataOrName };
 		if (messageId) {
 			const data = await channel.sendAction(messageId, formData);
-			if (data?.message) updateMessage(data.message);
-			else removeMessage(message);
+			if (data?.message) messagePaginator.ingestItem(formatMessage(data.message));
+			else messagePaginator.removeItem({ item: message });
 		}
 	});
 }

package/dist/es/components/Message/hooks/useActionHandler.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useActionHandler.mjs","names":[],"sources":["../../../../../src/components/Message/hooks/useActionHandler.ts"],"sourcesContent":["import { useChannelActionContext } from '../../../context/ChannelActionContext';\nimport { useChannelStateContext } from '../../../context/ChannelStateContext';\n\nimport type React from 'react';\nimport type { LocalMessage } from 'stream-chat';\nimport { useStableCallback } from '../../../utils/useStableCallback';\n\nexport type FormData = Record<string, string>;\n\nexport type ActionHandlerReturnType = (\n  dataOrName?: string | FormData,\n  value?: string,\n  event?: React.BaseSyntheticEvent,\n) => Promise<void> | void;\n\nexport const handleActionWarning = `Action handler was called, but it is missing one of its required arguments. \nMake sure the ChannelAction and ChannelState contexts are properly set and the hook is initialized with a valid message.`;\n\nexport function useActionHandler(message?: LocalMessage): ActionHandlerReturnType {\n  const { removeMessage, updateMessage } = useChannelActionContext('useActionHandler');\n  const { channel } = useChannelStateContext('useActionHandler');\n\n  return useStableCallback(async (dataOrName, value, event) => {\n    if (event) event.preventDefault();\n\n    if (!message || !updateMessage || !removeMessage || !channel) {\n      console.warn(handleActionWarning);\n      return;\n    }\n\n    const messageId = message.id;\n    let formData: FormData = {};\n\n    // deprecated: value&name should be removed in favor of data obj\n    if (typeof dataOrName === 'string') {\n      formData[dataOrName] = value as string;\n    } else {\n      formData = { ...dataOrName };\n    }\n\n    if (messageId) {\n      const data = await channel.sendAction(messageId, formData);\n\n      if (data?.message) {\n        updateMessage(data.message);\n      } else {\n        removeMessage(message);\n      }\n    }\n  });\n}\n"],"mappings":";;;;AAeA,IAAa,sBAAsB;;AAGnC,SAAgB,iBAAiB,SAAiD;CAChF,MAAM,EAAE,eAAe,kBAAkB,wBAAwB,kBAAkB;CACnF,MAAM,EAAE,YAAY,uBAAuB,kBAAkB;CAE7D,OAAO,kBAAkB,OAAO,YAAY,OAAO,UAAU;EAC3D,IAAI,OAAO,MAAM,eAAe;EAEhC,IAAI,CAAC,WAAW,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,SAAS;GAC5D,QAAQ,KAAK,mBAAmB;GAChC;EACF;EAEA,MAAM,YAAY,QAAQ;EAC1B,IAAI,WAAqB,CAAC;EAG1B,IAAI,OAAO,eAAe,UACxB,SAAS,cAAc;OAEvB,WAAW,EAAE,GAAG,WAAW;EAG7B,IAAI,WAAW;GACb,MAAM,OAAO,MAAM,QAAQ,WAAW,WAAW,QAAQ;GAEzD,IAAI,MAAM,SACR,cAAc,KAAK,OAAO;QAE1B,cAAc,OAAO;EAEzB;CACF,CAAC;AACH"}
+{"version":3,"file":"useActionHandler.mjs","names":[],"sources":["../../../../../src/components/Message/hooks/useActionHandler.ts"],"sourcesContent":["import { useChannel } from '../../../context';\nimport { useMessagePaginator } from '../../../hooks';\n\nimport type React from 'react';\nimport { formatMessage, type LocalMessage } from 'stream-chat';\nimport { useStableCallback } from '../../../utils/useStableCallback';\n\nexport type FormData = Record<string, string>;\n\nexport type ActionHandlerReturnType = (\n  dataOrName?: string | FormData,\n  value?: string,\n  event?: React.BaseSyntheticEvent,\n) => Promise<void> | void;\n\nexport const handleActionWarning = `Action handler was called, but it is missing one of its required arguments. \nMake sure the ChannelAction and ChannelState contexts are properly set and the hook is initialized with a valid message.`;\n\nexport function useActionHandler(message?: LocalMessage): ActionHandlerReturnType {\n  const channel = useChannel();\n  const messagePaginator = useMessagePaginator();\n\n  return useStableCallback(async (dataOrName, value, event) => {\n    if (event) event.preventDefault();\n\n    if (!message || !channel) {\n      console.warn(handleActionWarning);\n      return;\n    }\n\n    const messageId = message.id;\n    let formData: FormData = {};\n\n    // deprecated: value&name should be removed in favor of data obj\n    if (typeof dataOrName === 'string') {\n      formData[dataOrName] = value as string;\n    } else {\n      formData = { ...dataOrName };\n    }\n\n    if (messageId) {\n      const data = await channel.sendAction(messageId, formData);\n\n      if (data?.message) {\n        messagePaginator.ingestItem(formatMessage(data.message));\n      } else {\n        messagePaginator.removeItem({ item: message });\n      }\n    }\n  });\n}\n"],"mappings":";;;;;AAeA,IAAa,sBAAsB;;AAGnC,SAAgB,iBAAiB,SAAiD;CAChF,MAAM,UAAU,WAAW;CAC3B,MAAM,mBAAmB,oBAAoB;CAE7C,OAAO,kBAAkB,OAAO,YAAY,OAAO,UAAU;EAC3D,IAAI,OAAO,MAAM,eAAe;EAEhC,IAAI,CAAC,WAAW,CAAC,SAAS;GACxB,QAAQ,KAAK,mBAAmB;GAChC;EACF;EAEA,MAAM,YAAY,QAAQ;EAC1B,IAAI,WAAqB,CAAC;EAG1B,IAAI,OAAO,eAAe,UACxB,SAAS,cAAc;OAEvB,WAAW,EAAE,GAAG,WAAW;EAG7B,IAAI,WAAW;GACb,MAAM,OAAO,MAAM,QAAQ,WAAW,WAAW,QAAQ;GAEzD,IAAI,MAAM,SACR,iBAAiB,WAAW,cAAc,KAAK,OAAO,CAAC;QAEvD,iBAAiB,WAAW,EAAE,MAAM,QAAQ,CAAC;EAEjD;CACF,CAAC;AACH"}

package/dist/es/components/Message/hooks/useDeleteHandler.mjs

@@ -1,18 +1,37 @@
-import { useChannelActionContext } from "../../../context/ChannelActionContext.mjs";
 import { useChatContext } from "../../../context/ChatContext.mjs";
-import { isNetworkSendFailure } from "../utils.mjs";
+import { useThreadContext } from "../../Threads/ThreadContext.mjs";
+import { useTranslationContext } from "../../../context/TranslationContext.mjs";
+import { useMessagePaginator } from "../../../hooks/useMessagePaginator.mjs";
+import { validateAndGetMessage } from "../utils.mjs";
+import { useChannel } from "../../../context/useChannel.mjs";
+import { formatMessage } from "stream-chat";
 //#region src/components/Message/hooks/useDeleteHandler.ts
-var useDeleteHandler = (message) => {
-	const { deleteMessage, removeMessage, updateMessage } = useChannelActionContext("useDeleteHandler");
-	const { client } = useChatContext("useDeleteHandler");
+var useDeleteHandler = (message, notifications = {}) => {
+	const { getErrorNotification, notify } = notifications;
+	const channel = useChannel();
+	const thread = useThreadContext();
+	const { client } = useChatContext();
+	const { t } = useTranslationContext();
+	const messagePaginator = useMessagePaginator();
 	return async (options) => {
-		if (!message) return;
-		if (message.type === "error" || isNetworkSendFailure(message)) {
-			removeMessage?.(message);
-			return;
+		if (!message?.id || !client) return;
+		try {
+			const entity = thread ?? channel;
+			if (entity.deleteMessageWithLocalUpdate) await entity.deleteMessageWithLocalUpdate({
+				localMessage: formatMessage(message),
+				options
+			});
+			else {
+				const deletedMessage = (await client.deleteMessage({
+					id: message.id,
+					...options
+				})).message;
+				messagePaginator.ingestItem(formatMessage(deletedMessage));
+			}
+		} catch (e) {
+			const errorMessage = getErrorNotification && validateAndGetMessage(getErrorNotification, [message]);
+			if (notify) notify(errorMessage || t("common.errorDeletingMessage.label", "Error deleting message"), "error");
 		}
-		if (!message.id || !client || !updateMessage) return;
-		updateMessage(await deleteMessage(message, options));
 	};
 };
 //#endregion

package/dist/es/components/Message/hooks/useDeleteHandler.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useDeleteHandler.mjs","names":[],"sources":["../../../../../src/components/Message/hooks/useDeleteHandler.ts"],"sourcesContent":["import { isNetworkSendFailure } from '../utils';\n\nimport { useChannelActionContext } from '../../../context/ChannelActionContext';\nimport { useChatContext } from '../../../context/ChatContext';\n\nimport type { DeleteMessageOptions, LocalMessage } from 'stream-chat';\nimport type { MessageContextValue } from '../../../context';\n\nexport const useDeleteHandler = (\n  message?: LocalMessage,\n): MessageContextValue['handleDelete'] => {\n  const { deleteMessage, removeMessage, updateMessage } =\n    useChannelActionContext('useDeleteHandler');\n  const { client } = useChatContext('useDeleteHandler');\n\n  return async (options?: DeleteMessageOptions) => {\n    if (!message) {\n      return;\n    }\n\n    if (message.type === 'error' || isNetworkSendFailure(message)) {\n      removeMessage?.(message);\n      return;\n    }\n\n    if (!message.id || !client || !updateMessage) {\n      return;\n    }\n\n    const deletedMessage = await deleteMessage(message, options);\n    updateMessage(deletedMessage);\n  };\n};\n"],"mappings":";;;;AAQA,IAAa,oBACX,YACwC;CACxC,MAAM,EAAE,eAAe,eAAe,kBACpC,wBAAwB,kBAAkB;CAC5C,MAAM,EAAE,WAAW,eAAe,kBAAkB;CAEpD,OAAO,OAAO,YAAmC;EAC/C,IAAI,CAAC,SACH;EAGF,IAAI,QAAQ,SAAS,WAAW,qBAAqB,OAAO,GAAG;GAC7D,gBAAgB,OAAO;GACvB;EACF;EAEA,IAAI,CAAC,QAAQ,MAAM,CAAC,UAAU,CAAC,eAC7B;EAIF,cAAc,MADe,cAAc,SAAS,OAAO,CAC/B;CAC9B;AACF"}
+{"version":3,"file":"useDeleteHandler.mjs","names":[],"sources":["../../../../../src/components/Message/hooks/useDeleteHandler.ts"],"sourcesContent":["import { validateAndGetMessage } from '../utils';\n\nimport { useChannel, useChatContext } from '../../../context';\nimport { useTranslationContext } from '../../../context/TranslationContext';\nimport { useMessagePaginator } from '../../../hooks';\nimport { useThreadContext } from '../../Threads';\n\nimport { type DeleteMessageOptions, formatMessage, type LocalMessage } from 'stream-chat';\nimport type { MessageContextValue } from '../../../context';\n\nexport type DeleteMessageNotifications = {\n  getErrorNotification?: (message: LocalMessage) => string;\n  notify?: (notificationText: string, type: 'success' | 'error') => void;\n};\n\nexport const useDeleteHandler = (\n  message?: LocalMessage,\n  notifications: DeleteMessageNotifications = {},\n): MessageContextValue['handleDelete'] => {\n  const { getErrorNotification, notify } = notifications;\n\n  const channel = useChannel();\n  const thread = useThreadContext();\n  const { client } = useChatContext();\n  const { t } = useTranslationContext();\n  const messagePaginator = useMessagePaginator();\n\n  return async (options?: DeleteMessageOptions) => {\n    if (!message?.id || !client) {\n      return;\n    }\n\n    try {\n      const entity = thread ?? channel;\n      if (entity.deleteMessageWithLocalUpdate) {\n        await entity.deleteMessageWithLocalUpdate({\n          localMessage: formatMessage(message),\n          options,\n        });\n      } else {\n        const deletedMessage = (\n          await client.deleteMessage({ id: message.id, ...options })\n        ).message;\n        messagePaginator.ingestItem(formatMessage(deletedMessage));\n      }\n    } catch (e) {\n      const errorMessage =\n        getErrorNotification && validateAndGetMessage(getErrorNotification, [message]);\n\n      if (notify)\n        notify(\n          errorMessage ||\n            t('common.errorDeletingMessage.label', 'Error deleting message'),\n          'error',\n        );\n    }\n  };\n};\n"],"mappings":";;;;;;;;AAeA,IAAa,oBACX,SACA,gBAA4C,CAAC,MACL;CACxC,MAAM,EAAE,sBAAsB,WAAW;CAEzC,MAAM,UAAU,WAAW;CAC3B,MAAM,SAAS,iBAAiB;CAChC,MAAM,EAAE,WAAW,eAAe;CAClC,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,mBAAmB,oBAAoB;CAE7C,OAAO,OAAO,YAAmC;EAC/C,IAAI,CAAC,SAAS,MAAM,CAAC,QACnB;EAGF,IAAI;GACF,MAAM,SAAS,UAAU;GACzB,IAAI,OAAO,8BACT,MAAM,OAAO,6BAA6B;IACxC,cAAc,cAAc,OAAO;IACnC;GACF,CAAC;QACI;IACL,MAAM,kBACJ,MAAM,OAAO,cAAc;KAAE,IAAI,QAAQ;KAAI,GAAG;IAAQ,CAAC,EAAA,CACzD;IACF,iBAAiB,WAAW,cAAc,cAAc,CAAC;GAC3D;EACF,SAAS,GAAG;GACV,MAAM,eACJ,wBAAwB,sBAAsB,sBAAsB,CAAC,OAAO,CAAC;GAE/E,IAAI,QACF,OACE,gBACE,EAAE,qCAAqC,wBAAwB,GACjE,OACF;EACJ;CACF;AACF"}

package/dist/es/components/Message/hooks/useFlagHandler.mjs

@@ -3,15 +3,15 @@ import { useTranslationContext } from "../../../context/TranslationContext.mjs";
 //#region src/components/Message/hooks/useFlagHandler.ts
 var missingUseFlagHandlerParameterWarning = "useFlagHandler was called but it is missing one or more necessary parameters.";
 var useFlagHandler = (message) => {
-	const { client } = useChatContext("useFlagHandler");
-	const { t } = useTranslationContext("useFlagHandler");
+	const { client } = useChatContext();
+	const { t } = useTranslationContext();
 	return async (event) => {
 		event.preventDefault();
 		if (!client || !t || !message?.id) {
 			console.warn(missingUseFlagHandlerParameterWarning);
 			return;
 		}
-		await client.flagMessage(message.id);
+		await client.moderation.flagMessage(message.id);
 	};
 };
 //#endregion

package/dist/es/components/Message/hooks/useFlagHandler.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useFlagHandler.mjs","names":[],"sources":["../../../../../src/components/Message/hooks/useFlagHandler.ts"],"sourcesContent":["import { useChatContext } from '../../../context/ChatContext';\nimport { useTranslationContext } from '../../../context/TranslationContext';\n\nimport type { LocalMessage } from 'stream-chat';\nimport type { ReactEventHandler } from '../types';\n\nexport const missingUseFlagHandlerParameterWarning =\n  'useFlagHandler was called but it is missing one or more necessary parameters.';\n\nexport const useFlagHandler = (message?: LocalMessage): ReactEventHandler => {\n  const { client } = useChatContext('useFlagHandler');\n  const { t } = useTranslationContext('useFlagHandler');\n\n  return async (event) => {\n    event.preventDefault();\n\n    if (!client || !t || !message?.id) {\n      console.warn(missingUseFlagHandlerParameterWarning);\n      return;\n    }\n\n    await client.flagMessage(message.id);\n  };\n};\n"],"mappings":";;;AAMA,IAAa,wCACX;AAEF,IAAa,kBAAkB,YAA8C;CAC3E,MAAM,EAAE,WAAW,eAAe,gBAAgB;CAClD,MAAM,EAAE,MAAM,sBAAsB,gBAAgB;CAEpD,OAAO,OAAO,UAAU;EACtB,MAAM,eAAe;EAErB,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,SAAS,IAAI;GACjC,QAAQ,KAAK,qCAAqC;GAClD;EACF;EAEA,MAAM,OAAO,YAAY,QAAQ,EAAE;CACrC;AACF"}
+{"version":3,"file":"useFlagHandler.mjs","names":[],"sources":["../../../../../src/components/Message/hooks/useFlagHandler.ts"],"sourcesContent":["import { useChatContext } from '../../../context/ChatContext';\nimport { useTranslationContext } from '../../../context/TranslationContext';\n\nimport type { LocalMessage } from 'stream-chat';\nimport type { ReactEventHandler } from '../types';\n\nexport const missingUseFlagHandlerParameterWarning =\n  'useFlagHandler was called but it is missing one or more necessary parameters.';\n\nexport const useFlagHandler = (message?: LocalMessage): ReactEventHandler => {\n  const { client } = useChatContext();\n  const { t } = useTranslationContext();\n\n  return async (event) => {\n    event.preventDefault();\n\n    if (!client || !t || !message?.id) {\n      console.warn(missingUseFlagHandlerParameterWarning);\n      return;\n    }\n\n    await client.moderation.flagMessage(message.id);\n  };\n};\n"],"mappings":";;;AAMA,IAAa,wCACX;AAEF,IAAa,kBAAkB,YAA8C;CAC3E,MAAM,EAAE,WAAW,eAAe;CAClC,MAAM,EAAE,MAAM,sBAAsB;CAEpC,OAAO,OAAO,UAAU;EACtB,MAAM,eAAe;EAErB,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,SAAS,IAAI;GACjC,QAAQ,KAAK,qCAAqC;GAClD;EACF;EAEA,MAAM,OAAO,WAAW,YAAY,QAAQ,EAAE;CAChD;AACF"}

package/dist/es/components/Message/hooks/useMarkUnreadHandler.mjs

@@ -1,7 +1,9 @@
-import { useChannelStateContext } from "../../../context/ChannelStateContext.mjs";
+import { validateAndGetMessage } from "../utils.mjs";
+import { useChannel } from "../../../context/useChannel.mjs";
 //#region src/components/Message/hooks/useMarkUnreadHandler.ts
-var useMarkUnreadHandler = (message) => {
-	const { channel } = useChannelStateContext("useMarkUnreadHandler");
+var useMarkUnreadHandler = (message, notifications = {}) => {
+	const { getSuccessNotification, notify } = notifications;
+	const channel = useChannel();
 	return async (event) => {
 		event.preventDefault();
 		if (!message?.id) {
@@ -9,6 +11,9 @@ var useMarkUnreadHandler = (message) => {
 			return;
 		}
 		await channel.markUnread({ message_id: message.id });
+		if (!notify) return;
+		const successMessage = getSuccessNotification && validateAndGetMessage(getSuccessNotification, [message]);
+		if (successMessage) notify(successMessage, "success");
 	};
 };
 //#endregion

package/dist/es/components/Message/hooks/useMarkUnreadHandler.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useMarkUnreadHandler.mjs","names":[],"sources":["../../../../../src/components/Message/hooks/useMarkUnreadHandler.ts"],"sourcesContent":["import { useChannelStateContext } from '../../../context';\n\nimport type { LocalMessage } from 'stream-chat';\nimport type { ReactEventHandler } from '../types';\n\nexport const useMarkUnreadHandler = (message?: LocalMessage): ReactEventHandler => {\n  const { channel } = useChannelStateContext('useMarkUnreadHandler');\n\n  return async (event) => {\n    event.preventDefault();\n    if (!message?.id) {\n      console.warn('Mark unread handler does not have access to message id');\n      return;\n    }\n\n    await channel.markUnread({ message_id: message.id });\n  };\n};\n"],"mappings":";;AAKA,IAAa,wBAAwB,YAA8C;CACjF,MAAM,EAAE,YAAY,uBAAuB,sBAAsB;CAEjE,OAAO,OAAO,UAAU;EACtB,MAAM,eAAe;EACrB,IAAI,CAAC,SAAS,IAAI;GAChB,QAAQ,KAAK,wDAAwD;GACrE;EACF;EAEA,MAAM,QAAQ,WAAW,EAAE,YAAY,QAAQ,GAAG,CAAC;CACrD;AACF"}
+{"version":3,"file":"useMarkUnreadHandler.mjs","names":[],"sources":["../../../../../src/components/Message/hooks/useMarkUnreadHandler.ts"],"sourcesContent":["import { validateAndGetMessage } from '../utils';\nimport { useChannel } from '../../../context';\n\nimport type { LocalMessage } from 'stream-chat';\nimport type { ReactEventHandler } from '../types';\n\nexport type MarkUnreadHandlerNotifications = {\n  getErrorNotification?: (message: LocalMessage) => string;\n  getSuccessNotification?: (message: LocalMessage) => string;\n  notify?: (notificationText: string, type: 'success' | 'error') => void;\n};\n\nexport const useMarkUnreadHandler = (\n  message?: LocalMessage,\n  notifications: MarkUnreadHandlerNotifications = {},\n): ReactEventHandler => {\n  const { getSuccessNotification, notify } = notifications;\n\n  const channel = useChannel();\n\n  return async (event) => {\n    event.preventDefault();\n    if (!message?.id) {\n      console.warn('Mark unread handler does not have access to message id');\n      return;\n    }\n\n    // Let request failures propagate so the caller (e.g. MessageActions' MarkUnread control, which\n    // wraps every action in try/catch and reports failures through useNotificationApi) can surface\n    // the error. The optional `notify` bridge remains for direct callers that want a success toast.\n    await channel.markUnread({ message_id: message.id });\n    if (!notify) return;\n    const successMessage =\n      getSuccessNotification && validateAndGetMessage(getSuccessNotification, [message]);\n    if (successMessage) notify(successMessage, 'success');\n  };\n};\n"],"mappings":";;;AAYA,IAAa,wBACX,SACA,gBAAgD,CAAC,MAC3B;CACtB,MAAM,EAAE,wBAAwB,WAAW;CAE3C,MAAM,UAAU,WAAW;CAE3B,OAAO,OAAO,UAAU;EACtB,MAAM,eAAe;EACrB,IAAI,CAAC,SAAS,IAAI;GAChB,QAAQ,KAAK,wDAAwD;GACrE;EACF;EAKA,MAAM,QAAQ,WAAW,EAAE,YAAY,QAAQ,GAAG,CAAC;EACnD,IAAI,CAAC,QAAQ;EACb,MAAM,iBACJ,0BAA0B,sBAAsB,wBAAwB,CAAC,OAAO,CAAC;EACnF,IAAI,gBAAgB,OAAO,gBAAgB,SAAS;CACtD;AACF"}

package/dist/es/components/Message/hooks/useMentionsHandler.mjs

@@ -1,4 +1,3 @@
-import { useChannelActionContext } from "../../../context/ChannelActionContext.mjs";
 //#region src/components/Message/hooks/useMentionsHandler.ts
 function createEventHandler(fn, message) {
 	return (event) => {
@@ -8,9 +7,8 @@ function createEventHandler(fn, message) {
 	};
 }
 var useMentionsHandler = (message, customMentionHandler) => {
-	const { onMentionsClick: contextOnMentionsClick, onMentionsHover: contextOnMentionsHover } = useChannelActionContext("useMentionsHandler");
-	const onMentionsClick = customMentionHandler?.onMentionsClick || contextOnMentionsClick || (() => null);
-	const onMentionsHover = customMentionHandler?.onMentionsHover || contextOnMentionsHover || (() => null);
+	const onMentionsClick = customMentionHandler?.onMentionsClick || (() => null);
+	const onMentionsHover = customMentionHandler?.onMentionsHover || (() => null);
 	return {
 		onMentionsClick: createEventHandler(onMentionsClick, message),
 		onMentionsHover: createEventHandler(onMentionsHover, message)

package/dist/es/components/Message/hooks/useMentionsHandler.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useMentionsHandler.mjs","names":[],"sources":["../../../../../src/components/Message/hooks/useMentionsHandler.ts"],"sourcesContent":["import { useChannelActionContext } from '../../../context/ChannelActionContext';\n\nimport type React from 'react';\nimport type { LocalMessage, UserResponse } from 'stream-chat';\n\nimport type { ReactEventHandler } from '../types';\n\nexport type CustomMentionHandler = (\n  event: React.BaseSyntheticEvent,\n  /**\n   * @deprecated Use the third `message` argument to access mention metadata instead.\n   * FIXME: Remove this argument in the next major release.\n   */\n  mentioned_users: UserResponse[],\n  message: LocalMessage,\n) => void;\n\nexport type MentionedUserEventHandler = (\n  event: React.BaseSyntheticEvent,\n  mentionedUsers: UserResponse[],\n) => void;\n\nfunction createEventHandler(\n  fn?: CustomMentionHandler,\n  message?: LocalMessage,\n): ReactEventHandler {\n  return (event) => {\n    const hasMentions = Boolean(\n      message?.mentioned_users?.length ||\n      message?.mentioned_channel ||\n      message?.mentioned_here ||\n      message?.mentioned_roles?.length ||\n      message?.mentioned_groups?.length,\n    );\n\n    if (typeof fn !== 'function' || !message || !hasMentions) {\n      return;\n    }\n    fn(event, message?.mentioned_users ?? [], message);\n  };\n}\n\nexport const useMentionsHandler = (\n  message?: LocalMessage,\n  customMentionHandler?: {\n    onMentionsClick?: CustomMentionHandler;\n    onMentionsHover?: CustomMentionHandler;\n  },\n) => {\n  const {\n    onMentionsClick: contextOnMentionsClick,\n    onMentionsHover: contextOnMentionsHover,\n  } = useChannelActionContext('useMentionsHandler');\n\n  const onMentionsClick =\n    customMentionHandler?.onMentionsClick || contextOnMentionsClick || (() => null);\n\n  const onMentionsHover =\n    customMentionHandler?.onMentionsHover || contextOnMentionsHover || (() => null);\n\n  return {\n    onMentionsClick: createEventHandler(onMentionsClick, message),\n    onMentionsHover: createEventHandler(onMentionsHover, message),\n  };\n};\n"],"mappings":";;AAsBA,SAAS,mBACP,IACA,SACmB;CACnB,QAAQ,UAAU;EAChB,MAAM,cAAc,QAClB,SAAS,iBAAiB,UAC1B,SAAS,qBACT,SAAS,kBACT,SAAS,iBAAiB,UAC1B,SAAS,kBAAkB,MAC7B;EAEA,IAAI,OAAO,OAAO,cAAc,CAAC,WAAW,CAAC,aAC3C;EAEF,GAAG,OAAO,SAAS,mBAAmB,CAAC,GAAG,OAAO;CACnD;AACF;AAEA,IAAa,sBACX,SACA,yBAIG;CACH,MAAM,EACJ,iBAAiB,wBACjB,iBAAiB,2BACf,wBAAwB,oBAAoB;CAEhD,MAAM,kBACJ,sBAAsB,mBAAmB,iCAAiC;CAE5E,MAAM,kBACJ,sBAAsB,mBAAmB,iCAAiC;CAE5E,OAAO;EACL,iBAAiB,mBAAmB,iBAAiB,OAAO;EAC5D,iBAAiB,mBAAmB,iBAAiB,OAAO;CAC9D;AACF"}
+{"version":3,"file":"useMentionsHandler.mjs","names":[],"sources":["../../../../../src/components/Message/hooks/useMentionsHandler.ts"],"sourcesContent":["import type React from 'react';\nimport type { LocalMessage, UserResponse } from 'stream-chat';\n\nimport type { ReactEventHandler } from '../types';\n\nexport type CustomMentionHandler = (\n  event: React.BaseSyntheticEvent,\n  /**\n   * @deprecated Use the third `message` argument to access mention metadata instead.\n   * FIXME: Remove this argument in the next major release.\n   */\n  mentioned_users: UserResponse[],\n  message: LocalMessage,\n) => void;\n\nexport type MentionedUserEventHandler = (\n  event: React.BaseSyntheticEvent,\n  mentionedUsers: UserResponse[],\n) => void;\n\nfunction createEventHandler(\n  fn?: CustomMentionHandler,\n  message?: LocalMessage,\n): ReactEventHandler {\n  return (event) => {\n    const hasMentions = Boolean(\n      message?.mentioned_users?.length ||\n      message?.mentioned_channel ||\n      message?.mentioned_here ||\n      message?.mentioned_roles?.length ||\n      message?.mentioned_groups?.length,\n    );\n\n    if (typeof fn !== 'function' || !message || !hasMentions) {\n      return;\n    }\n    fn(event, message?.mentioned_users ?? [], message);\n  };\n}\n\nexport const useMentionsHandler = (\n  message?: LocalMessage,\n  customMentionHandler?: {\n    onMentionsClick?: CustomMentionHandler;\n    onMentionsHover?: CustomMentionHandler;\n  },\n) => {\n  const onMentionsClick = customMentionHandler?.onMentionsClick || (() => null);\n  const onMentionsHover = customMentionHandler?.onMentionsHover || (() => null);\n\n  return {\n    onMentionsClick: createEventHandler(onMentionsClick, message),\n    onMentionsHover: createEventHandler(onMentionsHover, message),\n  };\n};\n"],"mappings":";AAoBA,SAAS,mBACP,IACA,SACmB;CACnB,QAAQ,UAAU;EAChB,MAAM,cAAc,QAClB,SAAS,iBAAiB,UAC1B,SAAS,qBACT,SAAS,kBACT,SAAS,iBAAiB,UAC1B,SAAS,kBAAkB,MAC7B;EAEA,IAAI,OAAO,OAAO,cAAc,CAAC,WAAW,CAAC,aAC3C;EAEF,GAAG,OAAO,SAAS,mBAAmB,CAAC,GAAG,OAAO;CACnD;AACF;AAEA,IAAa,sBACX,SACA,yBAIG;CACH,MAAM,kBAAkB,sBAAsB,0BAA0B;CACxE,MAAM,kBAAkB,sBAAsB,0BAA0B;CAExE,OAAO;EACL,iBAAiB,mBAAmB,iBAAiB,OAAO;EAC5D,iBAAiB,mBAAmB,iBAAiB,OAAO;CAC9D;AACF"}

package/dist/es/components/Message/hooks/useMessageAlsoSentInChannelNavigation.mjs

@@ -0,0 +1,72 @@
+import { useChatContext } from "../../../context/ChatContext.mjs";
+import { useMessageContext } from "../../../context/MessageContext.mjs";
+import { useThreadContext } from "../../Threads/ThreadContext.mjs";
+import { useTranslationContext } from "../../../context/TranslationContext.mjs";
+import { useChannel } from "../../../context/useChannel.mjs";
+import { useWorkspaceNavigation } from "../../../context/WorkspaceNavigationContext.mjs";
+//#region src/components/Message/hooks/useMessageAlsoSentInChannelNavigation.ts
+/**
+* Encapsulates the navigation behind {@link MessageAlsoSentInChannelIndicator} so integrators can
+* reuse it (or compose extra behavior around it) without re-implementing the component. Returns the
+* composed `viewReference` handler plus the granular `viewReplyInChannel` / `viewReplyInThread`
+* actions and the `isInThread` / `isShownInChannel` flags used for rendering.
+*/
+var useMessageAlsoSentInChannelNavigation = () => {
+	const { channelManager, client } = useChatContext();
+	const { t } = useTranslationContext();
+	const channel = useChannel();
+	const { isChannelActive, openChannel, openThread } = useWorkspaceNavigation();
+	const thread = useThreadContext();
+	const { message } = useMessageContext();
+	const addThreadNotFoundNotification = (error) => {
+		client.notifications.addError({
+			message: t("notification.replySearchFailed", "Thread has not been found"),
+			options: {
+				originalError: error,
+				type: "api:message:search:not-found"
+			},
+			origin: {
+				context: { threadReply: message },
+				emitter: "useMessageAlsoSentInChannelNavigation"
+			}
+		});
+	};
+	const viewReplyInChannel = async (messageId = message?.id) => {
+		if (!messageId) return;
+		const needsNavigation = !isChannelActive(channel.cid);
+		if (needsNavigation) openChannel(channel);
+		await channel.messagePaginator.jumpToMessage(messageId);
+		if (needsNavigation) channelManager.ingestChannel(channel);
+	};
+	const viewReplyInThread = async (replyId = message?.id, parentId = message?.parent_id) => {
+		if (!replyId || !parentId) return;
+		let targetThread = client.threads.threadsById[parentId];
+		if (!targetThread) try {
+			targetThread = await client.getThreadAndHydrate(parentId, { watch: true });
+		} catch (error) {
+			addThreadNotFoundNotification(error);
+			return;
+		}
+		openThread(targetThread);
+		await targetThread.messagePaginator.jumpToMessage(replyId);
+	};
+	const viewReference = async () => {
+		if (thread) {
+			await viewReplyInChannel(message?.id);
+			return;
+		}
+		if (!message?.parent_id) return;
+		await viewReplyInThread(message.id, message.parent_id);
+	};
+	return {
+		isInThread: !!thread,
+		isShownInChannel: !!message?.show_in_channel,
+		viewReference,
+		viewReplyInChannel,
+		viewReplyInThread
+	};
+};
+//#endregion
+export { useMessageAlsoSentInChannelNavigation };
+
+//# sourceMappingURL=useMessageAlsoSentInChannelNavigation.mjs.map

package/dist/es/components/Message/hooks/useMessageAlsoSentInChannelNavigation.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMessageAlsoSentInChannelNavigation.mjs","names":[],"sources":["../../../../../src/components/Message/hooks/useMessageAlsoSentInChannelNavigation.ts"],"sourcesContent":["import {\n  useChannel,\n  useChatContext,\n  useMessageContext,\n  useTranslationContext,\n  useWorkspaceNavigation,\n} from '../../../context';\nimport { useThreadContext } from '../../Threads';\n\nexport type MessageAlsoSentInChannelNavigation = {\n  /** True when rendered inside a thread (the reply was \"also sent in channel\"); false in a\n   *  channel message list (the message is a thread reply, \"replied to a thread\"). */\n  isInThread: boolean;\n  /** Whether the current message is shown in the channel (i.e. the indicator should render). */\n  isShownInChannel: boolean;\n  /** Composed handler used by the default indicator: jumps to the referenced message, picking the\n   *  channel or the thread depending on where the indicator is rendered. */\n  viewReference: () => Promise<void>;\n  /** Jump to the reply in the channel message list (used from inside a thread). */\n  viewReplyInChannel: (messageId?: string) => Promise<void>;\n  /** Open the reply's parent thread and jump to the reply (used from a channel message list). */\n  viewReplyInThread: (replyId?: string, parentId?: string) => Promise<void>;\n};\n\n/**\n * Encapsulates the navigation behind {@link MessageAlsoSentInChannelIndicator} so integrators can\n * reuse it (or compose extra behavior around it) without re-implementing the component. Returns the\n * composed `viewReference` handler plus the granular `viewReplyInChannel` / `viewReplyInThread`\n * actions and the `isInThread` / `isShownInChannel` flags used for rendering.\n */\nexport const useMessageAlsoSentInChannelNavigation =\n  (): MessageAlsoSentInChannelNavigation => {\n    const { channelManager, client } = useChatContext();\n    const { t } = useTranslationContext();\n    const channel = useChannel();\n    const { isChannelActive, openChannel, openThread } = useWorkspaceNavigation();\n    const thread = useThreadContext();\n    const { message } = useMessageContext();\n\n    const addThreadNotFoundNotification = (error: Error) => {\n      client.notifications.addError({\n        message: t('notification.replySearchFailed', 'Thread has not been found'),\n        options: {\n          originalError: error,\n          type: 'api:message:search:not-found',\n        },\n        origin: {\n          context: { threadReply: message },\n          emitter: 'useMessageAlsoSentInChannelNavigation',\n        },\n      });\n    };\n\n    const viewReplyInChannel = async (messageId = message?.id) => {\n      if (!messageId) return;\n      // The channel isn't on screen when it isn't open in the workspace — navigate to it.\n      const needsNavigation = !isChannelActive(channel.cid);\n      if (needsNavigation) {\n        openChannel(channel);\n      }\n\n      await channel.messagePaginator.jumpToMessage(messageId);\n\n      if (needsNavigation) {\n        channelManager.ingestChannel(channel);\n      }\n    };\n\n    const viewReplyInThread = async (\n      replyId = message?.id,\n      parentId = message?.parent_id,\n    ) => {\n      if (!replyId || !parentId) return;\n      let targetThread = client.threads.threadsById[parentId];\n\n      if (!targetThread) {\n        try {\n          targetThread = await client.getThreadAndHydrate(parentId, { watch: true });\n        } catch (error) {\n          addThreadNotFoundNotification(error as Error);\n          return;\n        }\n      }\n\n      openThread(targetThread);\n      await targetThread.messagePaginator.jumpToMessage(replyId);\n    };\n\n    const viewReference = async () => {\n      if (thread) {\n        await viewReplyInChannel(message?.id);\n        return;\n      }\n\n      if (!message?.parent_id) return;\n      await viewReplyInThread(message.id, message.parent_id);\n    };\n\n    return {\n      isInThread: !!thread,\n      isShownInChannel: !!message?.show_in_channel,\n      viewReference,\n      viewReplyInChannel,\n      viewReplyInThread,\n    };\n  };\n"],"mappings":";;;;;;;;;;;;;AA8BA,IAAa,8CAC+B;CACxC,MAAM,EAAE,gBAAgB,WAAW,eAAe;CAClD,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,UAAU,WAAW;CAC3B,MAAM,EAAE,iBAAiB,aAAa,eAAe,uBAAuB;CAC5E,MAAM,SAAS,iBAAiB;CAChC,MAAM,EAAE,YAAY,kBAAkB;CAEtC,MAAM,iCAAiC,UAAiB;EACtD,OAAO,cAAc,SAAS;GAC5B,SAAS,EAAE,kCAAkC,2BAA2B;GACxE,SAAS;IACP,eAAe;IACf,MAAM;GACR;GACA,QAAQ;IACN,SAAS,EAAE,aAAa,QAAQ;IAChC,SAAS;GACX;EACF,CAAC;CACH;CAEA,MAAM,qBAAqB,OAAO,YAAY,SAAS,OAAO;EAC5D,IAAI,CAAC,WAAW;EAEhB,MAAM,kBAAkB,CAAC,gBAAgB,QAAQ,GAAG;EACpD,IAAI,iBACF,YAAY,OAAO;EAGrB,MAAM,QAAQ,iBAAiB,cAAc,SAAS;EAEtD,IAAI,iBACF,eAAe,cAAc,OAAO;CAExC;CAEA,MAAM,oBAAoB,OACxB,UAAU,SAAS,IACnB,WAAW,SAAS,cACjB;EACH,IAAI,CAAC,WAAW,CAAC,UAAU;EAC3B,IAAI,eAAe,OAAO,QAAQ,YAAY;EAE9C,IAAI,CAAC,cACH,IAAI;GACF,eAAe,MAAM,OAAO,oBAAoB,UAAU,EAAE,OAAO,KAAK,CAAC;EAC3E,SAAS,OAAO;GACd,8BAA8B,KAAc;GAC5C;EACF;EAGF,WAAW,YAAY;EACvB,MAAM,aAAa,iBAAiB,cAAc,OAAO;CAC3D;CAEA,MAAM,gBAAgB,YAAY;EAChC,IAAI,QAAQ;GACV,MAAM,mBAAmB,SAAS,EAAE;GACpC;EACF;EAEA,IAAI,CAAC,SAAS,WAAW;EACzB,MAAM,kBAAkB,QAAQ,IAAI,QAAQ,SAAS;CACvD;CAEA,OAAO;EACL,YAAY,CAAC,CAAC;EACd,kBAAkB,CAAC,CAAC,SAAS;EAC7B;EACA;EACA;CACF;AACF"}

package/dist/es/components/Message/hooks/useMessageReminder.mjs

@@ -1,5 +1,5 @@
-import { useChatContext } from "../../../context/ChatContext.mjs";
 import { useStateStore } from "../../../store/hooks/useStateStore.mjs";
+import { useChatContext } from "../../../context/ChatContext.mjs";
 import { useCallback } from "react";
 //#region src/components/Message/hooks/useMessageReminder.ts
 var useMessageReminder = (messageId) => {

package/dist/es/components/Message/hooks/useMuteHandler.mjs

@@ -1,21 +1,38 @@
-import { useChannelStateContext } from "../../../context/ChannelStateContext.mjs";
 import { useChatContext } from "../../../context/ChatContext.mjs";
 import { useTranslationContext } from "../../../context/TranslationContext.mjs";
-import { isUserMuted } from "../utils.mjs";
+import { isUserMuted, validateAndGetMessage } from "../utils.mjs";
 //#region src/components/Message/hooks/useMuteHandler.ts
 var missingUseMuteHandlerParamsWarning = "useMuteHandler was called but it is missing one or more necessary parameter.";
-var useMuteHandler = (message) => {
-	const { mutes } = useChannelStateContext("useMuteHandler");
-	const { client } = useChatContext("useMuteHandler");
-	const { t } = useTranslationContext("useMuteHandler");
+var useMuteHandler = (message, notifications = {}) => {
+	const { client } = useChatContext();
+	const { t } = useTranslationContext();
 	return async (event) => {
 		event.preventDefault();
-		if (!t || !message?.user || !client) {
+		const { getErrorNotification, getSuccessNotification, notify } = notifications;
+		if (!message?.user || !client) {
 			console.warn(missingUseMuteHandlerParamsWarning);
 			return;
 		}
-		if (!isUserMuted(message, mutes)) await client.muteUser(message.user.id);
-		else await client.unmuteUser(message.user.id);
+		if (!isUserMuted(message, client.mutedUsersStore.getLatestValue().mutedUsers ?? [])) try {
+			await client.moderation.mute({ target_ids: [message.user.id] });
+			if (!notify) return;
+			const successMessage = getSuccessNotification && validateAndGetMessage(getSuccessNotification, [message.user]) || t("common.muted.label", "{{ user }} has been muted", { user: message.user.name || message.user.id });
+			if (typeof successMessage === "string") notify(successMessage, "success");
+		} catch (e) {
+			if (!notify) return;
+			const errorMessage = getErrorNotification && validateAndGetMessage(getErrorNotification, [message.user]) || t("common.errorMutingUser.label", "Error muting a user ...");
+			if (typeof errorMessage === "string") notify(errorMessage, "error");
+		}
+		else try {
+			await client.moderation.unmute({ target_ids: [message.user.id] });
+			if (!notify) return;
+			const successMessage = getSuccessNotification && validateAndGetMessage(getSuccessNotification, [message.user]) || t("common.unmuted.label", "{{ user }} has been unmuted", { user: message.user.name || message.user.id });
+			if (typeof successMessage === "string") notify(successMessage, "success");
+		} catch (e) {
+			if (!notify) return;
+			const errorMessage = getErrorNotification && validateAndGetMessage(getErrorNotification, [message.user]) || t("common.errorUnmutingUser.label", "Error unmuting a user ...");
+			if (typeof errorMessage === "string") notify(errorMessage, "error");
+		}
 	};
 };
 //#endregion

package/dist/es/components/Message/hooks/useMuteHandler.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useMuteHandler.mjs","names":[],"sources":["../../../../../src/components/Message/hooks/useMuteHandler.ts"],"sourcesContent":["import { isUserMuted } from '../utils';\n\nimport { useChannelStateContext } from '../../../context/ChannelStateContext';\nimport { useChatContext } from '../../../context/ChatContext';\nimport { useTranslationContext } from '../../../context/TranslationContext';\n\nimport type { LocalMessage } from 'stream-chat';\n\nimport type { ReactEventHandler } from '../types';\n\nexport const missingUseMuteHandlerParamsWarning =\n  'useMuteHandler was called but it is missing one or more necessary parameter.';\n\nexport const useMuteHandler = (message?: LocalMessage): ReactEventHandler => {\n  const { mutes } = useChannelStateContext('useMuteHandler');\n  const { client } = useChatContext('useMuteHandler');\n  const { t } = useTranslationContext('useMuteHandler');\n\n  return async (event) => {\n    event.preventDefault();\n\n    if (!t || !message?.user || !client) {\n      console.warn(missingUseMuteHandlerParamsWarning);\n      return;\n    }\n\n    if (!isUserMuted(message, mutes)) {\n      await client.muteUser(message.user.id);\n    } else {\n      await client.unmuteUser(message.user.id);\n    }\n  };\n};\n"],"mappings":";;;;;AAUA,IAAa,qCACX;AAEF,IAAa,kBAAkB,YAA8C;CAC3E,MAAM,EAAE,UAAU,uBAAuB,gBAAgB;CACzD,MAAM,EAAE,WAAW,eAAe,gBAAgB;CAClD,MAAM,EAAE,MAAM,sBAAsB,gBAAgB;CAEpD,OAAO,OAAO,UAAU;EACtB,MAAM,eAAe;EAErB,IAAI,CAAC,KAAK,CAAC,SAAS,QAAQ,CAAC,QAAQ;GACnC,QAAQ,KAAK,kCAAkC;GAC/C;EACF;EAEA,IAAI,CAAC,YAAY,SAAS,KAAK,GAC7B,MAAM,OAAO,SAAS,QAAQ,KAAK,EAAE;OAErC,MAAM,OAAO,WAAW,QAAQ,KAAK,EAAE;CAE3C;AACF"}
+{"version":3,"file":"useMuteHandler.mjs","names":[],"sources":["../../../../../src/components/Message/hooks/useMuteHandler.ts"],"sourcesContent":["import { isUserMuted, validateAndGetMessage } from '../utils';\n\nimport { useChatContext } from '../../../context/ChatContext';\nimport { useTranslationContext } from '../../../context/TranslationContext';\n\nimport type { LocalMessage, UserResponse } from 'stream-chat';\n\nimport type { ReactEventHandler } from '../types';\n\nexport const missingUseMuteHandlerParamsWarning =\n  'useMuteHandler was called but it is missing one or more necessary parameter.';\n\nexport type MuteUserNotifications = {\n  getErrorNotification?: (user: UserResponse) => string;\n  getSuccessNotification?: (user: UserResponse) => string;\n  notify?: (notificationText: string, type: 'success' | 'error') => void;\n};\n\nexport const useMuteHandler = (\n  message?: LocalMessage,\n  notifications: MuteUserNotifications = {},\n): ReactEventHandler => {\n  const { client } = useChatContext();\n  const { t } = useTranslationContext();\n\n  return async (event) => {\n    event.preventDefault();\n\n    const { getErrorNotification, getSuccessNotification, notify } = notifications;\n\n    // Perform the mute/unmute unconditionally — mirror useMarkUnreadHandler/useDeleteHandler, which\n    // do the action first and treat `notify` as an optional UI bridge. Gating the action on `notify`\n    // (as this hook previously did) turned mute into a no-op, because Message.tsx wires the handler\n    // as `useMuteHandler(message)` with no notifications, per the canonical `(message)`-only style.\n    if (!message?.user || !client) {\n      console.warn(missingUseMuteHandlerParamsWarning);\n      return;\n    }\n    const mutes = client.mutedUsersStore.getLatestValue().mutedUsers ?? [];\n\n    if (!isUserMuted(message, mutes)) {\n      try {\n        await client.moderation.mute({ target_ids: [message.user.id] });\n\n        if (!notify) return;\n        const successMessage =\n          (getSuccessNotification &&\n            validateAndGetMessage(getSuccessNotification, [message.user])) ||\n          t('common.muted.label', '{{ user }} has been muted', {\n            user: message.user.name || message.user.id,\n          });\n\n        if (typeof successMessage === 'string') notify(successMessage, 'success');\n      } catch (e) {\n        if (!notify) return;\n        const errorMessage =\n          (getErrorNotification &&\n            validateAndGetMessage(getErrorNotification, [message.user])) ||\n          t('common.errorMutingUser.label', 'Error muting a user ...');\n\n        if (typeof errorMessage === 'string') notify(errorMessage, 'error');\n      }\n    } else {\n      try {\n        await client.moderation.unmute({ target_ids: [message.user.id] });\n\n        if (!notify) return;\n        const successMessage =\n          (getSuccessNotification &&\n            validateAndGetMessage(getSuccessNotification, [message.user])) ||\n          t('common.unmuted.label', '{{ user }} has been unmuted', {\n            user: message.user.name || message.user.id,\n          });\n\n        if (typeof successMessage === 'string') notify(successMessage, 'success');\n      } catch (e) {\n        if (!notify) return;\n        const errorMessage =\n          (getErrorNotification &&\n            validateAndGetMessage(getErrorNotification, [message.user])) ||\n          t('common.errorUnmutingUser.label', 'Error unmuting a user ...');\n\n        if (typeof errorMessage === 'string') notify(errorMessage, 'error');\n      }\n    }\n  };\n};\n"],"mappings":";;;;AASA,IAAa,qCACX;AAQF,IAAa,kBACX,SACA,gBAAuC,CAAC,MAClB;CACtB,MAAM,EAAE,WAAW,eAAe;CAClC,MAAM,EAAE,MAAM,sBAAsB;CAEpC,OAAO,OAAO,UAAU;EACtB,MAAM,eAAe;EAErB,MAAM,EAAE,sBAAsB,wBAAwB,WAAW;EAMjE,IAAI,CAAC,SAAS,QAAQ,CAAC,QAAQ;GAC7B,QAAQ,KAAK,kCAAkC;GAC/C;EACF;EAGA,IAAI,CAAC,YAAY,SAFH,OAAO,gBAAgB,eAAe,CAAC,CAAC,cAAc,CAAC,CAEtC,GAC7B,IAAI;GACF,MAAM,OAAO,WAAW,KAAK,EAAE,YAAY,CAAC,QAAQ,KAAK,EAAE,EAAE,CAAC;GAE9D,IAAI,CAAC,QAAQ;GACb,MAAM,iBACH,0BACC,sBAAsB,wBAAwB,CAAC,QAAQ,IAAI,CAAC,KAC9D,EAAE,sBAAsB,6BAA6B,EACnD,MAAM,QAAQ,KAAK,QAAQ,QAAQ,KAAK,GAC1C,CAAC;GAEH,IAAI,OAAO,mBAAmB,UAAU,OAAO,gBAAgB,SAAS;EAC1E,SAAS,GAAG;GACV,IAAI,CAAC,QAAQ;GACb,MAAM,eACH,wBACC,sBAAsB,sBAAsB,CAAC,QAAQ,IAAI,CAAC,KAC5D,EAAE,gCAAgC,yBAAyB;GAE7D,IAAI,OAAO,iBAAiB,UAAU,OAAO,cAAc,OAAO;EACpE;OAEA,IAAI;GACF,MAAM,OAAO,WAAW,OAAO,EAAE,YAAY,CAAC,QAAQ,KAAK,EAAE,EAAE,CAAC;GAEhE,IAAI,CAAC,QAAQ;GACb,MAAM,iBACH,0BACC,sBAAsB,wBAAwB,CAAC,QAAQ,IAAI,CAAC,KAC9D,EAAE,wBAAwB,+BAA+B,EACvD,MAAM,QAAQ,KAAK,QAAQ,QAAQ,KAAK,GAC1C,CAAC;GAEH,IAAI,OAAO,mBAAmB,UAAU,OAAO,gBAAgB,SAAS;EAC1E,SAAS,GAAG;GACV,IAAI,CAAC,QAAQ;GACb,MAAM,eACH,wBACC,sBAAsB,sBAAsB,CAAC,QAAQ,IAAI,CAAC,KAC5D,EAAE,kCAAkC,2BAA2B;GAEjE,IAAI,OAAO,iBAAiB,UAAU,OAAO,cAAc,OAAO;EACpE;CAEJ;AACF"}

package/dist/es/components/Message/hooks/useOpenThreadHandler.mjs

@@ -1,14 +1,22 @@
-import { useChannelActionContext } from "../../../context/ChannelActionContext.mjs";
+import { useChannel } from "../../../context/useChannel.mjs";
+import { useWorkspaceNavigation } from "../../../context/WorkspaceNavigationContext.mjs";
 //#region src/components/Message/hooks/useOpenThreadHandler.ts
 var useOpenThreadHandler = (message, customOpenThread) => {
-	const { openThread: channelOpenThread } = useChannelActionContext("useOpenThreadHandler");
-	const openThread = customOpenThread || channelOpenThread;
+	const channel = useChannel();
+	const { openThread } = useWorkspaceNavigation();
 	return (event) => {
-		if (!openThread || !message) {
+		if (!message) {
 			console.warn("Open thread handler was called but it is missing one of its parameters");
 			return;
 		}
-		openThread(message, event);
+		if (customOpenThread) {
+			customOpenThread(message, event);
+			return;
+		}
+		openThread({
+			channel,
+			message
+		});
 	};
 };
 //#endregion

package/dist/es/components/Message/hooks/useOpenThreadHandler.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useOpenThreadHandler.mjs","names":[],"sources":["../../../../../src/components/Message/hooks/useOpenThreadHandler.ts"],"sourcesContent":["import { useChannelActionContext } from '../../../context/ChannelActionContext';\n\nimport type { LocalMessage } from 'stream-chat';\nimport type { ReactEventHandler } from '../types';\n\nexport const useOpenThreadHandler = (\n  message?: LocalMessage,\n  customOpenThread?: (message: LocalMessage, event: React.BaseSyntheticEvent) => void,\n): ReactEventHandler => {\n  const { openThread: channelOpenThread } =\n    useChannelActionContext('useOpenThreadHandler');\n\n  const openThread = customOpenThread || channelOpenThread;\n\n  return (event) => {\n    if (!openThread || !message) {\n      console.warn(\n        'Open thread handler was called but it is missing one of its parameters',\n      );\n      return;\n    }\n\n    openThread(message, event);\n  };\n};\n"],"mappings":";;AAKA,IAAa,wBACX,SACA,qBACsB;CACtB,MAAM,EAAE,YAAY,sBAClB,wBAAwB,sBAAsB;CAEhD,MAAM,aAAa,oBAAoB;CAEvC,QAAQ,UAAU;EAChB,IAAI,CAAC,cAAc,CAAC,SAAS;GAC3B,QAAQ,KACN,wEACF;GACA;EACF;EAEA,WAAW,SAAS,KAAK;CAC3B;AACF"}
+{"version":3,"file":"useOpenThreadHandler.mjs","names":[],"sources":["../../../../../src/components/Message/hooks/useOpenThreadHandler.ts"],"sourcesContent":["import type React from 'react';\nimport type { LocalMessage } from 'stream-chat';\n\nimport { useChannel, useWorkspaceNavigation } from '../../../context';\nimport type { ReactEventHandler } from '../types';\n\n// MERGE-RECONCILE: master's useOpenThreadHandler read `openThread` from the deleted\n// ChannelActionContext. Reimplemented over the core WorkspaceNavigation adapter — threads\n// open through `useWorkspaceNavigation().openThread` (see MessageRepliesCountButton /\n// ThreadListItemUI). Without a slot-layout plugin the adapter falls back to a no-op,\n// matching the prior \"missing handler\" guard.\nexport const useOpenThreadHandler = (\n  message?: LocalMessage,\n  customOpenThread?: (message: LocalMessage, event: React.BaseSyntheticEvent) => void,\n): ReactEventHandler => {\n  const channel = useChannel();\n  const { openThread } = useWorkspaceNavigation();\n\n  return (event) => {\n    if (!message) {\n      console.warn(\n        'Open thread handler was called but it is missing one of its parameters',\n      );\n      return;\n    }\n\n    if (customOpenThread) {\n      customOpenThread(message, event);\n      return;\n    }\n\n    void openThread({ channel, message });\n  };\n};\n"],"mappings":";;;AAWA,IAAa,wBACX,SACA,qBACsB;CACtB,MAAM,UAAU,WAAW;CAC3B,MAAM,EAAE,eAAe,uBAAuB;CAE9C,QAAQ,UAAU;EAChB,IAAI,CAAC,SAAS;GACZ,QAAQ,KACN,wEACF;GACA;EACF;EAEA,IAAI,kBAAkB;GACpB,iBAAiB,SAAS,KAAK;GAC/B;EACF;EAEA,WAAgB;GAAE;GAAS;EAAQ,CAAC;CACtC;AACF"}