Interface MobileChatTopicShowPageProps

interface MobileChatTopicShowPageProps {
    commentInput: {
        isDisabled?: boolean;
        onSubmit?: ((comment) => void);
        placeholder?: 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;
    }[];
    onNavigate: ((url) => void);
    onScrollTop: ((earliestMessageId) => void);
}

Properties

commentInput isLoading messages onNavigate onScrollTop

Properties

commentInput

commentInput: {
    isDisabled?: boolean;
    onSubmit?: ((comment) => void);
    placeholder?: string;
}

Configs for the comment input at the bottom of the page

Type declaration

  • 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 placeholder?: string

    Placeholder text

isLoading

isLoading: boolean

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

messages

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.

Type declaration

  • Optional avatarColor?: "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10"

    Avatar used if no image is provided; if not provided, no avatar shown

  • Optional avatarHref?: string

    Avatar link href (requires onNavigate)

  • Optional avatarUrl?: string

    Avatar picture

  • content: string

    Message bubble content

  • createdAt: string

    Date time the message was created at, as an ISO string Messages will then be grouped by days based on the configured locale via the luxon library

  • id: string

    Identifier for this message (for callbacks)

  • Optional isOwnMessage?: boolean

    Messages that are your own are highlighted

  • Optional title?: string

    Title string (appears above the bubble)

onNavigate

onNavigate: ((url) => void)

On navigate callback

Type declaration

    • (url): void

    • On navigate callback

      Parameters

      • url: string

      Returns void

onScrollTop

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.

Type declaration

    • (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

Settings

Member Visibility

Theme

On This Page

Generated using TypeDoc