stream-chat-angular 4.30.0 → 4.31.1

package/lib/custom-templates.service.d.ts

@@ -1,6 +1,6 @@
 import { TemplateRef } from '@angular/core';
 import { BehaviorSubject } from 'rxjs';
-import { AttachmentContext, AttachmentListContext, AttachmentPreviewListContext, AvatarContext, ChannelActionsContext, ChannelHeaderInfoContext, ChannelPreviewContext, CommandAutocompleteListItemContext, CustomAttachmentUploadContext, DeliveredStatusContext, EmojiPickerContext, IconContext, LoadingIndicatorContext, MentionAutcompleteListItemContext, MentionTemplateContext, MessageActionBoxItemContext, MessageActionsBoxContext, MessageContext, MessageInputContext, MessageReactionsContext, ModalContext, NotificationContext, ReadStatusContext, SendingStatusContext, SystemMessageContext, ThreadHeaderContext, TypingIndicatorContext } from './types';
+import { AttachmentContext, AttachmentListContext, AttachmentPreviewListContext, AvatarContext, ChannelActionsContext, ChannelHeaderInfoContext, ChannelPreviewContext, CommandAutocompleteListItemContext, CustomAttachmentUploadContext, DateSeparatorContext, DeliveredStatusContext, EmojiPickerContext, IconContext, LoadingIndicatorContext, MentionAutcompleteListItemContext, MentionTemplateContext, MessageActionBoxItemContext, MessageActionsBoxContext, MessageContext, MessageInputContext, MessageReactionsContext, ModalContext, NotificationContext, ReadStatusContext, SendingStatusContext, SystemMessageContext, ThreadHeaderContext, TypingIndicatorContext } from './types';
 import * as i0 from "@angular/core";
 /**
  * A central location for registering your custom templates to override parts of the chat application.
@@ -184,6 +184,10 @@ export declare class CustomTemplatesService {
      * The template used to display [system messages](https://getstream.io/chat/docs/javascript/silent_messages/?language=javascript&q=system) indise the [message component](../components/MessageComponent.mdx)
      */
     systemMessageTemplate$: BehaviorSubject<TemplateRef<SystemMessageContext> | undefined>;
+    /**
+     * The template used to display the date separator inside the [message list](../components/MessageListComponent.mdx)
+     */
+    dateSeparatorTemplate$: BehaviorSubject<TemplateRef<DateSeparatorContext> | undefined>;
     constructor();
     static ɵfac: i0.ɵɵFactoryDeclaration<CustomTemplatesService, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<CustomTemplatesService>;

package/lib/date-parser.service.d.ts

@@ -0,0 +1,29 @@
+import * as i0 from "@angular/core";
+/**
+ * The `DateParserService` parses dates into user-friendly string representations.
+ */
+export declare class DateParserService {
+    /**
+     * Custom parser to override `parseDate`
+     */
+    customDateParser?: (date: Date) => string;
+    /**
+     * Custom parser to override `parseDateTime`
+     */
+    customDateTimeParser?: (date: Date) => string;
+    constructor();
+    /**
+     * Return a user-friendly string representation of the date (year, month and date)
+     * @param date
+     * @returns The parsed date
+     */
+    parseDate(date: Date): string;
+    /**
+     * Return a user-friendly string representation of the date and time
+     * @param date
+     * @returns The parsed date
+     */
+    parseDateTime(date: Date): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DateParserService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<DateParserService>;
+}

package/lib/message/message.component.d.ts

@@ -6,6 +6,7 @@ import { AttachmentListContext, MentionTemplateContext, MessageActionsBoxContext
 import { CustomTemplatesService } from '../custom-templates.service';
 import { ThemeService } from '../theme.service';
 import { NgxPopperjsTriggers, NgxPopperjsPlacements } from 'ngx-popperjs';
+import { DateParserService } from '../date-parser.service';
 import * as i0 from "@angular/core";
 declare type MessagePart = {
     content: string;
@@ -20,6 +21,7 @@ export declare class MessageComponent implements OnInit, OnChanges, OnDestroy {
     private channelService;
     private customTemplatesService;
     private cdRef;
+    private dateParser;
     /**
      * The message to be displayed
      */
@@ -70,7 +72,7 @@ export declare class MessageComponent implements OnInit, OnChanges, OnDestroy {
     private user;
     private subscriptions;
     private container;
-    constructor(chatClientService: ChatClientService, channelService: ChannelService, customTemplatesService: CustomTemplatesService, cdRef: ChangeDetectorRef, themeService: ThemeService);
+    constructor(chatClientService: ChatClientService, channelService: ChannelService, customTemplatesService: CustomTemplatesService, cdRef: ChangeDetectorRef, themeService: ThemeService, dateParser: DateParserService);
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngOnDestroy(): void;

package/lib/message-list/message-list.component.d.ts

@@ -1,11 +1,12 @@
 import { AfterViewChecked, AfterViewInit, OnChanges, OnDestroy, OnInit, SimpleChanges, TemplateRef } from '@angular/core';
 import { ChannelService } from '../channel.service';
 import { Observable } from 'rxjs';
-import { MessageContext, StreamMessage, TypingIndicatorContext, CustomMessageActionItem } from '../types';
+import { MessageContext, StreamMessage, TypingIndicatorContext, CustomMessageActionItem, DateSeparatorContext } from '../types';
 import { ChatClientService } from '../chat-client.service';
 import { GroupStyle } from './group-styles';
 import { UserResponse } from 'stream-chat';
 import { CustomTemplatesService } from '../custom-templates.service';
+import { DateParserService } from '../date-parser.service';
 import * as i0 from "@angular/core";
 /**
  * The `MessageList` component renders a scrollable list of messages.
@@ -14,6 +15,7 @@ export declare class MessageListComponent implements AfterViewChecked, OnChanges
     private channelService;
     private chatClientService;
     private customTemplatesService;
+    private dateParser;
     /**
      * Determines if the message list should display channel messages or [thread messages](https://getstream.io/chat/docs/javascript/threads/?language=javascript).
      */
@@ -35,7 +37,16 @@ export declare class MessageListComponent implements AfterViewChecked, OnChanges
      * A list of custom message actions to be displayed in the message action box
      */
     customMessageActions: CustomMessageActionItem<any>[];
+    /**
+     * If `true` date separators will be displayed
+     */
+    displayDateSeparator: boolean;
+    /**
+     * If date separators are displayed, you can set the horizontal position of the date text.
+     */
+    dateSeparatorTextPos: 'center' | 'right' | 'left';
     messageTemplate: TemplateRef<MessageContext> | undefined;
+    customDateSeparatorTemplate: TemplateRef<DateSeparatorContext> | undefined;
     messages$: Observable<StreamMessage[]>;
     enabledMessageActions: string[];
     private class;
@@ -62,7 +73,8 @@ export declare class MessageListComponent implements AfterViewChecked, OnChanges
     private usersTypingInChannel$;
     private usersTypingInThread$;
     private isLatestMessageInList;
-    constructor(channelService: ChannelService, chatClientService: ChatClientService, customTemplatesService: CustomTemplatesService);
+    private channelId?;
+    constructor(channelService: ChannelService, chatClientService: ChatClientService, customTemplatesService: CustomTemplatesService, dateParser: DateParserService);
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
@@ -76,6 +88,8 @@ export declare class MessageListComponent implements AfterViewChecked, OnChanges
     scrolled(): void;
     getTypingIndicatorContext(): TypingIndicatorContext;
     getTypingIndicatorText(users: UserResponse[]): string;
+    areOnSeparateDates(message: StreamMessage, nextMessage?: StreamMessage): boolean;
+    parseDate(date: Date): string;
     get replyCountParam(): {
         replyCount: number | undefined;
     };
@@ -89,5 +103,5 @@ export declare class MessageListComponent implements AfterViewChecked, OnChanges
     private scrollToLatestMessage;
     private newMessageReceived;
     static ɵfac: i0.ɵɵFactoryDeclaration<MessageListComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MessageListComponent, "stream-message-list", never, { "mode": "mode"; "direction": "direction"; "messageOptionsTrigger": "messageOptionsTrigger"; "hideJumpToLatestButtonDuringScroll": "hideJumpToLatestButtonDuringScroll"; "customMessageActions": "customMessageActions"; }, {}, never, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MessageListComponent, "stream-message-list", never, { "mode": "mode"; "direction": "direction"; "messageOptionsTrigger": "messageOptionsTrigger"; "hideJumpToLatestButtonDuringScroll": "hideJumpToLatestButtonDuringScroll"; "customMessageActions": "customMessageActions"; "displayDateSeparator": "displayDateSeparator"; "dateSeparatorTextPos": "dateSeparatorTextPos"; }, {}, never, never>;
 }

package/lib/parse-date.d.ts

@@ -0,0 +1 @@
+export declare const parseDate: (date: Date, format?: 'date' | 'date-time') => string;

package/lib/types.d.ts

@@ -236,4 +236,8 @@ export declare type AttachmentContext = {
 export declare type SystemMessageContext = MessageContext & {
     parsedDate: string | undefined;
 };
+export declare type DateSeparatorContext = {
+    date: Date;
+    parsedDate: string;
+};
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "stream-chat-angular",
-  "version": "4.30.0",
+  "version": "4.31.1",
   "description": "Angular components to create chat conversations or livestream style chat",
   "author": "GetStream",
   "homepage": "https://getstream.io/chat/",

package/public-api.d.ts

@@ -17,7 +17,7 @@ export * from './lib/channel-preview/channel-preview.component';
 export * from './lib/channel-list/channel-list.component';
 export * from './lib/channel-list/channel-list-toggle.service';
 export * from './lib/message/message.component';
-export * from './lib/message/parse-date';
+export * from './lib/parse-date';
 export * from './lib/list-users';
 export * from './lib/message-input/message-input.component';
 export * from './lib/message-input/textarea/textarea.component';
@@ -51,4 +51,5 @@ export * from './lib/stream-textarea.module';
 export * from './lib/injection-tokens';
 export * from './lib/custom-templates.service';
 export * from './lib/message-reactions.service';
+export * from './lib/date-parser.service';
 export * from './lib/types';