stream-chat 9.5.1 → 9.6.1

package/dist/types/index.d.ts

@@ -10,6 +10,7 @@ export * from './insights';
 export * from './messageComposer';
 export * from './middleware';
 export * from './moderation';
+export * from './notifications';
 export * from './pagination';
 export * from './permissions';
 export * from './poll';

package/dist/types/messageComposer/messageComposer.d.ts

@@ -29,9 +29,10 @@ export type LocalMessageWithLegacyThreadId = LocalMessage & {
 export type CompositionContext = Channel | Thread | LocalMessageWithLegacyThreadId;
 export type MessageComposerState = {
     id: string;
-    quotedMessage: LocalMessageBase | null;
-    pollId: string | null;
     draftId: string | null;
+    pollId: string | null;
+    quotedMessage: LocalMessageBase | null;
+    showReplyInChannel: boolean;
 };
 export type MessageComposerOptions = {
     client: StreamChat;
@@ -54,12 +55,12 @@ export declare class MessageComposer extends WithSubscriptions {
     pollComposer: PollComposer;
     customDataManager: CustomDataManager;
     constructor({ composition, config, compositionContext, client, }: MessageComposerOptions);
-    static evaluateContextType(compositionContext: CompositionContext): "channel" | "thread" | "legacy_thread" | "message";
+    static evaluateContextType(compositionContext: CompositionContext): "message" | "channel" | "thread" | "legacy_thread";
     static constructTag(compositionContext: CompositionContext): `${ReturnType<typeof MessageComposer.evaluateContextType>}_${string}`;
     get config(): MessageComposerConfig;
     updateConfig(config: DeepPartial<MessageComposerConfig>): void;
-    get contextType(): "channel" | "thread" | "legacy_thread" | "message";
-    get tag(): `channel_${string}` | `thread_${string}` | `legacy_thread_${string}` | `message_${string}`;
+    get contextType(): "message" | "channel" | "thread" | "legacy_thread";
+    get tag(): `message_${string}` | `channel_${string}` | `thread_${string}` | `legacy_thread_${string}`;
     get threadId(): string | null;
     get client(): StreamChat;
     get id(): string;
@@ -67,6 +68,7 @@ export declare class MessageComposer extends WithSubscriptions {
     get lastChange(): LastComposerChange;
     get quotedMessage(): LocalMessageBase | null;
     get pollId(): string | null;
+    get showReplyInChannel(): boolean;
     get hasSendableData(): boolean;
     get compositionIsEmpty(): boolean;
     get lastChangeOriginIsLocal(): boolean;
@@ -91,6 +93,7 @@ export declare class MessageComposer extends WithSubscriptions {
     private subscribeMessageComposerStateChanged;
     private subscribeMessageComposerConfigStateChanged;
     setQuotedMessage: (quotedMessage: LocalMessage | null) => void;
+    toggleShowReplyInChannel: () => void;
     clear: () => void;
     restore: () => void;
     compose: () => Promise<MessageComposerMiddlewareValue["state"] | undefined>;

package/dist/types/messageComposer/middleware/messageComposer/userDataInjection.d.ts

@@ -0,0 +1,3 @@
+import type { MessageComposer } from '../../messageComposer';
+import type { MessageCompositionMiddleware } from './types';
+export declare const createUserDataInjectionMiddleware: (composer: MessageComposer) => MessageCompositionMiddleware;

package/dist/types/notifications/configuration.d.ts

@@ -0,0 +1,2 @@
+import type { NotificationManagerConfig } from './types';
+export declare const DEFAULT_NOTIFICATION_MANAGER_CONFIG: NotificationManagerConfig;

package/dist/types/notifications/types.d.ts

@@ -28,38 +28,77 @@ export type Notification = {
      * The identifier then can be recognized by notification consumers to act upon specific origin values.
      */
     origin: NotificationOrigin;
-    /** Optional timestamp when notification should expire */
-    expiresAt?: number;
-    /** Whether notification should automatically close after duration. Defaults to true */
-    autoClose?: boolean;
     /** Array of action buttons for the notification */
     actions?: NotificationAction[];
+    /**
+     * Optional code that can be used to group the notifications of the same type, e.g. attachment-upload-blocked.
+     * Format: domain:entity:operation:result
+     *   domain: where the error occurred (api, validation, permission, etc)
+     *   entity: what was being operated on (poll, attachment, message, etc)
+     *   operation: what was being attempted (create, upload, validate, etc)
+     *   result: what happened (failed, blocked, invalid, etc)
+     *
+     *   Poll related errors
+     *   'api:poll:create:failed'           // API call to create poll failed
+     *   'validation:poll:create:invalid'   // Poll creation validation failed
+     *
+     *   Attachment related errors
+     *   'validation:attachment:file:missing'     // Required file is missing
+     *   'permission:attachment:upload:blocked'   // Upload blocked due to permissions
+     *   'api:attachment:upload:failed'          // API upload call failed
+     *   'validation:attachment:type:unsupported' // Unsupported file type
+     *   'validation:attachment:size:exceeded'    // File size too large
+     *   'validation:attachment:count:exceeded'   // Too many attachments
+     *
+     *   Message related errors
+     *   'api:message:send:failed'          // Message send failed
+     *   'validation:message:content:empty' // Message content validation failed
+     *
+     *   Channel related errors
+     *   'api:channel:join:failed'          // Channel join failed
+     *   'permission:channel:access:denied' // Channel access denied
+     *
+     *   Authentication related errors
+     *   'auth:token:expired'               // Auth token expired
+     *   'auth:token:invalid'               // Invalid auth token
+     *
+     *   Network related errors
+     *   'network:request:timeout'          // Request timed out
+     *   'network:request:failed'           // Network request failed
+     *
+     *    Rate limiting
+     *   'rate:limit:exceeded'              // Rate limit exceeded
+     *
+     *   System errors
+     *   'system:internal:error'            // Internal system error
+     *   'system:resource:unavailable';     // System resource unavailable
+     */
+    type?: string;
+    /** Optional timestamp when notification should expire */
+    expiresAt?: number;
     /** Optional metadata to attach to the notification */
     metadata?: Record<string, unknown>;
+    /** In case of error notification the instance of the originally thrown error */
+    originalError?: Error;
 };
 /** Configuration options when creating a notification */
-export type NotificationOptions = {
-    /** The severity level. Defaults to 'info' */
-    severity?: NotificationSeverity;
-    /** How long notification should display in milliseconds */
+export type NotificationOptions = Partial<Pick<Notification, 'type' | 'severity' | 'actions' | 'metadata' | 'originalError'>> & {
+    /** How long a notification should be displayed in milliseconds */
     duration?: number;
-    /** Whether notification should auto-close after duration. Defaults to true */
-    autoClose?: boolean;
-    /** Array of action buttons for the notification */
-    actions?: NotificationAction[];
-    /** Optional metadata to attach to the notification */
-    metadata?: Record<string, unknown>;
 };
-/** State shape for the notification store */
+/**
+ * State shape for the notification store
+ * @deprcated use NotificationManagerState
+ */
 export type NotificationState = {
     /** Array of current notification objects */
     notifications: Notification[];
 };
+/** State shape for the notification store */
+export type NotificationManagerState = NotificationState;
 export type NotificationManagerConfig = {
     durations: Record<NotificationSeverity, number>;
 };
-export type AddNotificationPayload = {
-    message: string;
-    origin: NotificationOrigin;
+export type AddNotificationPayload = Pick<Notification, 'message' | 'origin'> & {
     options?: NotificationOptions;
 };

package/dist/types/poll_manager.d.ts

@@ -11,7 +11,7 @@ export declare class PollManager extends WithSubscriptions {
     get data(): Map<string, Poll>;
     fromState: (id: string) => Poll | undefined;
     registerSubscriptions: () => void;
-    createPoll: (poll: CreatePollData) => Promise<Poll>;
+    createPoll: (poll: CreatePollData) => Promise<Poll | undefined>;
     getPoll: (id: string) => Promise<Poll | undefined>;
     queryPolls: (filter: QueryPollsFilters, sort?: PollSort, options?: QueryPollsOptions) => Promise<{
         polls: (Poll | undefined)[];

package/dist/types/utils/WithSubscriptions.d.ts

@@ -10,14 +10,19 @@ export declare abstract class WithSubscriptions {
      * overriding `unregisterSubscriptions` call the base method and return
      * its unique symbol value.
      */
-    private static symbol;
+    protected static symbol: symbol;
+    private refCount;
     abstract registerSubscriptions(): void;
     /**
      * Returns a boolean, provides information of whether `registerSubscriptions`
      * method has already been called for this instance.
      */
     get hasSubscriptions(): boolean;
-    addUnsubscribeFunction(unsubscribeFunction: Unsubscribe): void;
+    protected addUnsubscribeFunction(unsubscribeFunction: Unsubscribe): void;
+    /**
+     * Increments `refCount` by one and returns new value.
+     */
+    protected incrementRefCount(): number;
     /**
      * If you re-declare `unregisterSubscriptions` method within your class
      * make sure to run the original too.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "stream-chat",
-  "version": "9.5.1",
+  "version": "9.6.1",
   "description": "JS SDK for the Stream Chat API",
   "homepage": "https://getstream.io/chat/",
   "author": {

package/src/index.ts

@@ -10,6 +10,7 @@ export * from './insights';
 export * from './messageComposer';
 export * from './middleware';
 export * from './moderation';
+export * from './notifications';
 export * from './pagination';
 export * from './permissions';
 export * from './poll';

package/src/messageComposer/attachmentManager.ts

@@ -386,12 +386,11 @@ export class AttachmentManager {
       this.client.notifications.addError({
         message: 'File is required for upload attachment',
         origin: { emitter: 'AttachmentManager', context: { attachment } },
+        options: { type: 'validation:attachment:file:missing' },
       });
       return;
     }
 
-    // todo: document this
-    // the following is substitute for: if (noFiles && !isImage) return att
     if (!this.fileUploadFilter(attachment)) return;
 
     const newAttachment = await this.fileToLocalUploadAttachment(
@@ -453,8 +452,17 @@ export class AttachmentManager {
     if (localAttachment.localMetadata.uploadState === 'blocked') {
       this.upsertAttachments([localAttachment]);
       this.client.notifications.addError({
-        message: 'Error uploading attachment',
-        origin: { emitter: 'AttachmentManager', context: { attachment } },
+        message: `The attachment upload was blocked`,
+        origin: {
+          emitter: 'AttachmentManager',
+          context: { attachment, blockedAttachment: localAttachment },
+        },
+        options: {
+          type: 'validation:attachment:upload:blocked',
+          metadata: {
+            reason: localAttachment.localMetadata.uploadPermissionCheck?.reason,
+          },
+        },
       });
       return localAttachment;
     }
@@ -473,21 +481,7 @@ export class AttachmentManager {
     try {
       response = await this.doUploadRequest(localAttachment.localMetadata.file);
     } catch (error) {
-      let finalError: Error = {
-        message: 'Error uploading attachment',
-        name: 'Error',
-      };
-      if (typeof (error as Error).message === 'string') {
-        finalError = error as Error;
-      } else if (typeof error === 'object') {
-        finalError = Object.assign(finalError, error);
-      }
-
-      this.client.notifications.addError({
-        message: finalError.message,
-        origin: { emitter: 'AttachmentManager', context: { attachment } },
-      });
-
+      const reason = error instanceof Error ? error.message : 'unknown error';
       const failedAttachment: LocalUploadAttachment = {
         ...attachment,
         localMetadata: {
@@ -496,6 +490,19 @@ export class AttachmentManager {
         },
       };
 
+      this.client.notifications.addError({
+        message: 'Error uploading attachment',
+        origin: {
+          emitter: 'AttachmentManager',
+          context: { attachment, failedAttachment },
+        },
+        options: {
+          type: 'api:attachment:upload:failed',
+          metadata: { reason },
+          originalError: error instanceof Error ? error : undefined,
+        },
+      });
+
       this.updateAttachment(failedAttachment);
       return failedAttachment;
     }

package/src/messageComposer/messageComposer.ts

@@ -42,9 +42,10 @@ export type CompositionContext = Channel | Thread | LocalMessageWithLegacyThread
 
 export type MessageComposerState = {
   id: string;
-  quotedMessage: LocalMessageBase | null;
-  pollId: string | null;
   draftId: string | null;
+  pollId: string | null;
+  quotedMessage: LocalMessageBase | null;
+  showReplyInChannel: boolean;
 };
 
 export type MessageComposerOptions = {
@@ -82,10 +83,11 @@ const initState = (
 ): MessageComposerState => {
   if (!composition) {
     return {
+      draftId: null,
       id: MessageComposer.generateId(),
-      quotedMessage: null,
       pollId: null,
-      draftId: null,
+      quotedMessage: null,
+      showReplyInChannel: false,
     };
   }
 
@@ -104,15 +106,14 @@ const initState = (
   return {
     draftId,
     id,
+    pollId: message.poll_id ?? null,
     quotedMessage: quotedMessage
       ? formatMessage(quotedMessage as MessageResponseBase)
       : null,
-    pollId: message.poll_id ?? null,
+    showReplyInChannel: false,
   };
 };
 
-const noop = () => undefined;
-
 export class MessageComposer extends WithSubscriptions {
   readonly channel: Channel;
   readonly state: StateStore<MessageComposerState>;
@@ -274,6 +275,10 @@ export class MessageComposer extends WithSubscriptions {
     return this.state.getLatestValue().pollId;
   }
 
+  get showReplyInChannel() {
+    return this.state.getLatestValue().showReplyInChannel;
+  }
+
   get hasSendableData() {
     return !!(
       (!this.attachmentManager.uploadsInProgressCount &&
@@ -356,23 +361,23 @@ export class MessageComposer extends WithSubscriptions {
   }
 
   public registerSubscriptions = (): UnregisterSubscriptions => {
-    if (this.hasSubscriptions) {
-      // Already listening for events and changes
-      return noop;
+    if (!this.hasSubscriptions) {
+      this.addUnsubscribeFunction(this.subscribeMessageComposerSetupStateChange());
+      this.addUnsubscribeFunction(this.subscribeMessageUpdated());
+      this.addUnsubscribeFunction(this.subscribeMessageDeleted());
+
+      this.addUnsubscribeFunction(this.subscribeTextComposerStateChanged());
+      this.addUnsubscribeFunction(this.subscribeAttachmentManagerStateChanged());
+      this.addUnsubscribeFunction(this.subscribeLinkPreviewsManagerStateChanged());
+      this.addUnsubscribeFunction(this.subscribePollComposerStateChanged());
+      this.addUnsubscribeFunction(this.subscribeCustomDataManagerStateChanged());
+      this.addUnsubscribeFunction(this.subscribeMessageComposerStateChanged());
+      this.addUnsubscribeFunction(this.subscribeMessageComposerConfigStateChanged());
     }
-    this.addUnsubscribeFunction(this.subscribeMessageComposerSetupStateChange());
-    this.addUnsubscribeFunction(this.subscribeMessageUpdated());
-    this.addUnsubscribeFunction(this.subscribeMessageDeleted());
-
-    this.addUnsubscribeFunction(this.subscribeTextComposerStateChanged());
-    this.addUnsubscribeFunction(this.subscribeAttachmentManagerStateChanged());
-    this.addUnsubscribeFunction(this.subscribeLinkPreviewsManagerStateChanged());
-    this.addUnsubscribeFunction(this.subscribePollComposerStateChanged());
-    this.addUnsubscribeFunction(this.subscribeCustomDataManagerStateChanged());
-    this.addUnsubscribeFunction(this.subscribeMessageComposerStateChanged());
-    this.addUnsubscribeFunction(this.subscribeMessageComposerConfigStateChanged());
-
-    return this.unregisterSubscriptions.bind(this);
+
+    this.incrementRefCount();
+
+    return () => this.unregisterSubscriptions();
   };
 
   private subscribeMessageUpdated = () => {
@@ -580,6 +585,10 @@ export class MessageComposer extends WithSubscriptions {
     this.state.partialNext({ quotedMessage });
   };
 
+  toggleShowReplyInChannel = () => {
+    this.state.partialNext({ showReplyInChannel: !this.showReplyInChannel });
+  };
+
   clear = () => {
     this.initState();
   };
@@ -664,16 +673,22 @@ export class MessageComposer extends WithSubscriptions {
     const composition = await this.pollComposer.compose();
     if (!composition || !composition.data.id) return;
     try {
-      const { poll } = await this.client.createPoll(composition.data);
-      this.state.partialNext({ pollId: poll.id });
-      this.pollComposer.initState();
+      const poll = await this.client.polls.createPoll(composition.data);
+      this.state.partialNext({ pollId: poll?.id });
     } catch (error) {
-      this.client.notifications.add({
+      this.client.notifications.addError({
         message: 'Failed to create the poll',
         origin: {
           emitter: 'MessageComposer',
           context: { composer: this },
         },
+        options: {
+          type: 'api:poll:create:failed',
+          metadata: {
+            reason: (error as Error).message,
+          },
+          originalError: error instanceof Error ? error : undefined,
+        },
       });
       throw error;
     }

package/src/messageComposer/middleware/messageComposer/MessageComposerMiddlewareExecutor.ts

@@ -30,6 +30,7 @@ import {
   createCustomDataCompositionMiddleware,
   createDraftCustomDataCompositionMiddleware,
 } from './customData';
+import { createUserDataInjectionMiddleware } from './userDataInjection';
 import { createPollOnlyCompositionMiddleware } from './pollOnly';
 
 export class MessageComposerMiddlewareExecutor extends MiddlewareExecutor<
@@ -41,6 +42,7 @@ export class MessageComposerMiddlewareExecutor extends MiddlewareExecutor<
     // todo: document how to add custom data to a composed message using middleware
     //  or adding custom composer components (apart from AttachmentsManager, TextComposer etc.)
     this.use([
+      createUserDataInjectionMiddleware(composer),
       createPollOnlyCompositionMiddleware(composer),
       createTextComposerCompositionMiddleware(composer),
       createAttachmentsCompositionMiddleware(composer),

package/src/messageComposer/middleware/messageComposer/cleanData.ts

@@ -29,7 +29,6 @@ export const createCompositionDataCleanupMiddleware = (
           ...composer.editedMessage,
           ...state.localMessage,
           ...common,
-          user: composer.client.user,
         }),
         message: {
           ...editedMessagePayloadToBeSent,

package/src/messageComposer/middleware/messageComposer/messageComposerState.ts

@@ -17,7 +17,10 @@ export const createMessageComposerStateCompositionMiddleware = (
       state,
       next,
     }: MiddlewareHandlerParams<MessageComposerMiddlewareState>) => {
-      const payload: Pick<LocalMessage, 'poll_id' | 'quoted_message_id'> = {};
+      const payload: Pick<
+        LocalMessage,
+        'poll_id' | 'quoted_message_id' | 'show_in_channel'
+      > = {};
       if (composer.quotedMessage) {
         payload.quoted_message_id = composer.quotedMessage.id;
       }
@@ -25,6 +28,10 @@ export const createMessageComposerStateCompositionMiddleware = (
         payload.poll_id = composer.pollId;
       }
 
+      if (composer.showReplyInChannel) {
+        payload.show_in_channel = true;
+      }
+
       return next({
         ...state,
         localMessage: {
@@ -50,7 +57,10 @@ export const createDraftMessageComposerStateCompositionMiddleware = (
       state,
       next,
     }: MiddlewareHandlerParams<MessageDraftComposerMiddlewareValueState>) => {
-      const payload: Pick<LocalMessage, 'poll_id' | 'quoted_message_id'> = {};
+      const payload: Pick<
+        LocalMessage,
+        'poll_id' | 'quoted_message_id' | 'show_in_channel'
+      > = {};
       if (composer.quotedMessage) {
         payload.quoted_message_id = composer.quotedMessage.id;
       }
@@ -58,6 +68,10 @@ export const createDraftMessageComposerStateCompositionMiddleware = (
         payload.poll_id = composer.pollId;
       }
 
+      if (composer.showReplyInChannel) {
+        payload.show_in_channel = true;
+      }
+
       return next({
         ...state,
         draft: {

package/src/messageComposer/middleware/messageComposer/userDataInjection.ts

@@ -0,0 +1,43 @@
+import type { MessageComposer } from '../../messageComposer';
+import type {
+  MessageComposerMiddlewareState,
+  MessageCompositionMiddleware,
+} from './types';
+import type { MiddlewareHandlerParams } from '../../../middleware';
+import type { OwnUserResponse } from '../../../types';
+
+export const createUserDataInjectionMiddleware = (
+  composer: MessageComposer,
+): MessageCompositionMiddleware => ({
+  id: 'stream-io/message-composer-middleware/user-data-injection',
+  handlers: {
+    compose: ({
+      state,
+      next,
+      forward,
+    }: MiddlewareHandlerParams<MessageComposerMiddlewareState>) => {
+      if (!composer.client.user) {
+        return forward();
+      }
+      // Exclude the following properties from client.user as they can be large objects
+      // that provide no value for localMessage (and will never exist within message.user).
+      // This way we make sure that our localMessage is enriched with data as close as
+      // possible to the actual user.
+      // The reason why we need to explicitly cast is because OwnUserResponse only takes
+      // precedence after we connectUser the first time and we get the connection health
+      // check event. Due to how liberal the type of client.user is, we have to do it this
+      // way to maintain type safety.
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars
+      const { channel_mutes, devices, mutes, ...messageUser } = composer.client
+        .user as OwnUserResponse;
+      return next({
+        ...state,
+        localMessage: {
+          ...state.localMessage,
+          user: messageUser,
+          user_id: messageUser.id,
+        },
+      });
+    },
+  },
+});

package/src/notifications/NotificationManager.ts

@@ -6,13 +6,8 @@ import type {
   NotificationManagerConfig,
   NotificationState,
 } from './types';
-
-const DURATIONS: NotificationManagerConfig['durations'] = {
-  error: 10000,
-  warning: 5000,
-  info: 3000,
-  success: 3000,
-} as const;
+import { mergeWith } from '../utils/mergeWith';
+import { DEFAULT_NOTIFICATION_MANAGER_CONFIG } from './configuration';
 
 export class NotificationManager {
   store: StateStore<NotificationState>;
@@ -21,10 +16,7 @@ export class NotificationManager {
 
   constructor(config: Partial<NotificationManagerConfig> = {}) {
     this.store = new StateStore<NotificationState>({ notifications: [] });
-    this.config = {
-      ...config,
-      durations: config.durations || DURATIONS,
-    };
+    this.config = mergeWith(DEFAULT_NOTIFICATION_MANAGER_CONFIG, config);
   }
 
   get notifications() {
@@ -50,24 +42,27 @@ export class NotificationManager {
   add({ message, origin, options = {} }: AddNotificationPayload): string {
     const id = generateUUIDv4();
     const now = Date.now();
+    const severity = options.severity || 'info';
+    const duration = options.duration ?? this.config.durations[severity];
 
     const notification: Notification = {
       id,
       message,
       origin,
-      severity: options.severity || 'info',
+      type: options?.type,
+      severity,
       createdAt: now,
-      expiresAt: options.duration ? now + options.duration : undefined,
-      autoClose: options.autoClose ?? true,
+      expiresAt: now + duration,
       actions: options.actions,
       metadata: options.metadata,
+      originalError: options.originalError,
     };
 
     this.store.partialNext({
       notifications: [...this.store.getLatestValue().notifications, notification],
     });
 
-    if (notification.autoClose && notification.expiresAt) {
+    if (notification.expiresAt) {
       const timeout = setTimeout(() => {
         this.remove(id);
       }, options.duration || this.config.durations[notification.severity]);

package/src/notifications/configuration.ts

@@ -0,0 +1,12 @@
+import type { NotificationManagerConfig } from './types';
+
+const DURATION_MS = 3000 as const;
+
+export const DEFAULT_NOTIFICATION_MANAGER_CONFIG: NotificationManagerConfig = {
+  durations: {
+    error: DURATION_MS,
+    info: DURATION_MS,
+    success: DURATION_MS,
+    warning: DURATION_MS,
+  },
+};