@linktr.ee/messaging-react 1.11.5 → 1.12.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@linktr.ee/messaging-react",
-  "version": "1.11.5",
+  "version": "1.12.1",
   "description": "React messaging components built on messaging-core for web applications",
   "type": "module",
   "main": "dist/index.js",

package/src/components/ChannelView.tsx

@@ -147,6 +147,10 @@ const ChannelInfoDialog: React.FC<{
   followerStatusLabel?: string
   onLeaveConversation?: (channel: ChannelType) => void
   onBlockParticipant?: (participantId?: string) => void
+  showDeleteConversation?: boolean
+  onDeleteConversationClick?: () => void
+  onBlockParticipantClick?: () => void
+  onReportParticipantClick?: () => void
 }> = ({
   dialogRef,
   onClose,
@@ -155,6 +159,10 @@ const ChannelInfoDialog: React.FC<{
   followerStatusLabel,
   onLeaveConversation,
   onBlockParticipant,
+  showDeleteConversation = true,
+  onDeleteConversationClick,
+  onBlockParticipantClick,
+  onReportParticipantClick,
 }) => {
   const { service, debug } = useMessagingContext()
   const [isParticipantBlocked, setIsParticipantBlocked] = useState(false)
@@ -186,6 +194,9 @@ const ChannelInfoDialog: React.FC<{
   const handleLeaveConversation = async () => {
     if (isLeaving) return
 
+    // Fire analytics callback before action
+    onDeleteConversationClick?.()
+
     if (debug) {
       console.log('[ChannelInfoDialog] Leave conversation', channel.cid)
     }
@@ -210,6 +221,9 @@ const ChannelInfoDialog: React.FC<{
   const handleBlockUser = async () => {
     if (isUpdatingBlockStatus || !service) return
 
+    // Fire analytics callback before action
+    onBlockParticipantClick?.()
+
     if (debug) {
       console.log('[ChannelInfoDialog] Block member', participant?.user?.id)
     }
@@ -233,6 +247,9 @@ const ChannelInfoDialog: React.FC<{
   const handleUnblockUser = async () => {
     if (isUpdatingBlockStatus || !service) return
 
+    // Fire analytics callback before action
+    onBlockParticipantClick?.()
+
     if (debug) {
       console.log('[ChannelInfoDialog] Unblock member', participant?.user?.id)
     }
@@ -254,6 +271,9 @@ const ChannelInfoDialog: React.FC<{
   }
 
   const handleReportUser = () => {
+    // Fire analytics callback before action
+    onReportParticipantClick?.()
+
     onClose()
     window.open(
       'https://linktr.ee/s/about/trust-center/report',
@@ -341,20 +361,22 @@ const ChannelInfoDialog: React.FC<{
           </div>
 
           <ul className="flex flex-col gap-2 mt-2">
-            <li>
-              <ActionButton
-                onClick={handleLeaveConversation}
-                disabled={isLeaving}
-                aria-busy={isLeaving}
-              >
-                {isLeaving ? (
-                  <SpinnerGapIcon className="h-5 w-5 animate-spin" />
-                ) : (
-                  <SignOutIcon className="h-5 w-5" />
-                )}
-                <span>Delete Conversation</span>
-              </ActionButton>
-            </li>
+            {showDeleteConversation && (
+              <li>
+                <ActionButton
+                  onClick={handleLeaveConversation}
+                  disabled={isLeaving}
+                  aria-busy={isLeaving}
+                >
+                  {isLeaving ? (
+                    <SpinnerGapIcon className="h-5 w-5 animate-spin" />
+                  ) : (
+                    <SignOutIcon className="h-5 w-5" />
+                  )}
+                  <span>Delete Conversation</span>
+                </ActionButton>
+              </li>
+            )}
             <li>
               {isParticipantBlocked ? (
                 <ActionButton
@@ -407,12 +429,20 @@ const ChannelViewInner: React.FC<{
   onLeaveConversation?: (channel: ChannelType) => void
   onBlockParticipant?: (participantId?: string) => void
   CustomChannelEmptyState?: React.ComponentType
+  showDeleteConversation?: boolean
+  onDeleteConversationClick?: () => void
+  onBlockParticipantClick?: () => void
+  onReportParticipantClick?: () => void
 }> = ({
   onBack,
   showBackButton,
   renderMessageInputActions,
   onLeaveConversation,
   onBlockParticipant,
+  showDeleteConversation = true,
+  onDeleteConversationClick,
+  onBlockParticipantClick,
+  onReportParticipantClick,
 }) => {
   const { channel } = useChannelStateContext()
   const infoDialogRef = useRef<HTMLDialogElement>(null)
@@ -491,6 +521,10 @@ const ChannelViewInner: React.FC<{
         followerStatusLabel={followerStatusLabel}
         onLeaveConversation={onLeaveConversation}
         onBlockParticipant={onBlockParticipant}
+        showDeleteConversation={showDeleteConversation}
+        onDeleteConversationClick={onDeleteConversationClick}
+        onBlockParticipantClick={onBlockParticipantClick}
+        onReportParticipantClick={onReportParticipantClick}
       />
     </>
   )
@@ -509,6 +543,10 @@ export const ChannelView = React.memo<ChannelViewProps>(
     onBlockParticipant,
     className,
     CustomChannelEmptyState = ChannelEmptyState,
+    showDeleteConversation = true,
+    onDeleteConversationClick,
+    onBlockParticipantClick,
+    onReportParticipantClick,
   }) => {
     return (
       <div
@@ -529,6 +567,10 @@ export const ChannelView = React.memo<ChannelViewProps>(
             onLeaveConversation={onLeaveConversation}
             onBlockParticipant={onBlockParticipant}
             CustomChannelEmptyState={CustomChannelEmptyState}
+            showDeleteConversation={showDeleteConversation}
+            onDeleteConversationClick={onDeleteConversationClick}
+            onBlockParticipantClick={onBlockParticipantClick}
+            onReportParticipantClick={onReportParticipantClick}
           />
         </Channel>
       </div>

package/src/components/MessagingShell/index.tsx

@@ -27,6 +27,9 @@ export const MessagingShell: React.FC<MessagingShellProps> = ({
   showChannelList = true,
   filters,
   channelListCustomEmptyStateIndicator,
+  onDeleteConversationClick,
+  onBlockParticipantClick,
+  onReportParticipantClick,
 }) => {
   const {
     service,
@@ -53,7 +56,11 @@ export const MessagingShell: React.FC<MessagingShellProps> = ({
 
   const participantPickerRef = useRef<HTMLDialogElement>(null)
 
-  const { participantSource, participantLabel = 'participants' } = capabilities
+  const {
+    participantSource,
+    participantLabel = 'participants',
+    showDeleteConversation = true,
+  } = capabilities
 
   // Create default filters and merge with provided filters
   const channelFilters = React.useMemo(() => {
@@ -465,6 +472,10 @@ export const MessagingShell: React.FC<MessagingShellProps> = ({
                 onLeaveConversation={handleLeaveConversation}
                 onBlockParticipant={handleBlockParticipant}
                 CustomChannelEmptyState={CustomChannelEmptyState}
+                showDeleteConversation={showDeleteConversation}
+                onDeleteConversationClick={onDeleteConversationClick}
+                onBlockParticipantClick={onBlockParticipantClick}
+                onReportParticipantClick={onReportParticipantClick}
               />
             </div>
           ) : (

package/src/types.ts

@@ -44,6 +44,11 @@ export interface MessagingCapabilities {
   showStartConversation?: boolean
   participantSource?: ParticipantSource
   participantLabel?: string // e.g., "followers", "team members"
+  /**
+   * Show the "Delete Conversation" button in channel info dialog.
+   * Defaults to true for backward compatibility.
+   */
+  showDeleteConversation?: boolean
 }
 
 /**
@@ -98,6 +103,24 @@ export interface MessagingShellProps {
    * Useful for showing a custom empty state indicator when the channel list is empty.
    */
   channelListCustomEmptyStateIndicator?: React.ComponentType<EmptyStateIndicatorProps>
+
+  /**
+   * Analytics callback fired when "Delete Conversation" is clicked.
+   * Called before the action is performed.
+   */
+  onDeleteConversationClick?: () => void
+
+  /**
+   * Analytics callback fired when "Block" or "Unblock" is clicked.
+   * Called before the action is performed.
+   */
+  onBlockParticipantClick?: () => void
+
+  /**
+   * Analytics callback fired when "Report" is clicked.
+   * Called before the action is performed.
+   */
+  onReportParticipantClick?: () => void
 }
 
 /**
@@ -126,6 +149,23 @@ export interface ChannelViewProps {
   onBlockParticipant?: (participantId?: string) => void
   className?: string
   CustomChannelEmptyState?: React.ComponentType
+  /**
+   * Show the "Delete Conversation" button in channel info dialog.
+   * Defaults to true for backward compatibility.
+   */
+  showDeleteConversation?: boolean
+  /**
+   * Analytics callback fired when "Delete Conversation" is clicked.
+   */
+  onDeleteConversationClick?: () => void
+  /**
+   * Analytics callback fired when "Block" or "Unblock" is clicked.
+   */
+  onBlockParticipantClick?: () => void
+  /**
+   * Analytics callback fired when "Report" is clicked.
+   */
+  onReportParticipantClick?: () => void
 }
 
 /**