Interface DesktopChatPageProps

interface DesktopChatPageProps {
    chatView: {
        commentInput?: {
            isDisabled?: boolean;
            onSubmit?: ((comment) => void);
        };
        heading?: {
            avatar?: AvatarProps;
            buttonHref: string;
        };
        isLoading?: boolean;
        messages: {
            avatarColor?: "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10";
            avatarHref?: string;
            avatarUrl?: string;
            content: string;
            createdAt: string;
            id: string;
            isOwnMessage?: boolean;
            title?: string;
        }[];
        onScrollTop?: ((earliestMessageId) => void);
    };
    labels: {
        chatViewHeadingButtonText?: string;
        chatViewHeadingText?: string;
        noTopicsEmptyStateText: string;
        pageTitleText: string;
        selectTopicText: string;
    };
    onNavigate: ((url) => void);
    placeholders: {
        commentInput: string;
    };
    selectedTopicId?: string;
    topicsList: {
        isLoading?: boolean;
        onScrollBottom?: (() => void);
        topics: {
            avatar?: AvatarProps;
            content?: string;
            dateTime?: string;
            href?: string;
            id: string;
            title: string;
            unreadCount?: number;
        }[];
    };
}

Properties

chatView labels onNavigate placeholders selectedTopicId? topicsList

Properties

chatView

chatView: {
    commentInput?: {
        isDisabled?: boolean;
        onSubmit?: ((comment) => void);
    };
    heading?: {
        avatar?: AvatarProps;
        buttonHref: string;
    };
    isLoading?: boolean;
    messages: {
        avatarColor?: "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10";
        avatarHref?: string;
        avatarUrl?: string;
        content: string;
        createdAt: string;
        id: string;
        isOwnMessage?: boolean;
        title?: string;
    }[];
    onScrollTop?: ((earliestMessageId) => void);
}

Chat panel configuration

Type declaration

  • Optional commentInput?: {
        isDisabled?: boolean;
        onSubmit?: ((comment) => void);
    }

    Configs for the comment input at the bottom of the page

    • Optional isDisabled?: boolean

      Disables input (while submitting or similar)

    • Optional onSubmit?: ((comment) => void)

      Callback when submitting a comment via the bottom text input.

        • (comment): void

        • Callback when submitting a comment via the bottom text input.

          Parameters

          • comment: string

          Returns void

  • Optional heading?: {
        avatar?: AvatarProps;
        buttonHref: string;
    }

    Configuration for the chat view heading above the chat view

  • Optional isLoading?: boolean

    Loading state for either overall view or for previous methods (depends on whether messages is empty)

  • messages: {
        avatarColor?: "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10";
        avatarHref?: string;
        avatarUrl?: string;
        content: string;
        createdAt: string;
        id: string;
        isOwnMessage?: boolean;
        title?: string;
    }[]

    The list of messages to show in the chat view Messages should always be provided newest-first. They will be displayed with the newest at the bottom.

    When the latest message id changes, the user scroll will be updated automatically if the user is currently at the bottom, otherwise they will remain where they are.

  • Optional onScrollTop?: ((earliestMessageId) => void)

    Callback when the user has scrolled up and reached the top of the chat view This can be used to fetch more messages from the server.

      • (earliestMessageId): void

      • Callback when the user has scrolled up and reached the top of the chat view This can be used to fetch more messages from the server.

        Parameters

        • earliestMessageId: string

        Returns void

labels

labels: {
    chatViewHeadingButtonText?: string;
    chatViewHeadingText?: string;
    noTopicsEmptyStateText: string;
    pageTitleText: string;
    selectTopicText: string;
}

Label text configuration

Type declaration

  • Optional chatViewHeadingButtonText?: string
  • Optional chatViewHeadingText?: string
  • noTopicsEmptyStateText: string
  • pageTitleText: string
  • selectTopicText: string

onNavigate

onNavigate: ((url) => void)

Navigation callback (required for href)

Type declaration

    • (url): void

    • Navigation callback (required for href)

      Parameters

      • url: string

      Returns void

placeholders

placeholders: {
    commentInput: string;
}

Placeholder text configuration

Type declaration

  • commentInput: string

Optional selectedTopicId

selectedTopicId?: string

Selected topic id - configures left and right panels

topicsList

topicsList: {
    isLoading?: boolean;
    onScrollBottom?: (() => void);
    topics: {
        avatar?: AvatarProps;
        content?: string;
        dateTime?: string;
        href?: string;
        id: string;
        title: string;
        unreadCount?: number;
    }[];
}

Topics list configuration

Type declaration

  • Optional isLoading?: boolean

    Show loading state for topics list

  • Optional onScrollBottom?: (() => void)

    Callback when the bottom of the list is reached

      • (): void

      • Callback when the bottom of the list is reached

        Returns void

  • topics: {
        avatar?: AvatarProps;
        content?: string;
        dateTime?: string;
        href?: string;
        id: string;
        title: string;
        unreadCount?: number;
    }[]

    Topic rows configuration

Settings

Member Visibility

Theme

On This Page

Generated using TypeDoc