flutter_gb_messenger

A comprehensive Flutter package for implementing messaging and chat functionality in GeekBears applications. It provides pre-built BLoCs, services, and UI templates to handle chat room lists and messaging views with ease.

Features

• Chat Room List: Highly customizable template for displaying active and archived chat rooms.
• Messaging View: Threaded message display with support for pagination, message sending, and loading states.
• State Management: Robust BLoC-based architecture for managing messenger state, socket connections, and room operations.
• Theming: Granular styling options for items, bubbles, inputs, and list layouts.
• Dependency Injection: Easy integration with get_it.

Installation

Add the following to your pubspec.yaml:

dependencies:
  flutter_gb_messenger:
    git:
      url: git@github.com:GeekBears/flutter_gb_messenger.git
      ref: master # or a specific tag like v3.0.0

Getting Started

1. Initialize Injection

Configure the messenger's dependency injection in your app's initialization phase. You'll need to provide an ApiEndpointsConfig which defines how the messenger interacts with your backend.

import 'package:flutter_gb_messenger/flutter_gb_messenger.dart';

Future<void> initMessenger() async {
  await configureMessengerInjection(
    AppEnvironment.prod,
    MessengerConfig(
      apiEndpoints: ApiEndpointsConfig(
        getRoomsApiEndpoint: (params) => Uri.parse('...'),
        getRoomCountApiEndpoint: (params) => Uri.parse('...'),
        getRoomByIdApiEndpoint: (id) => Uri.parse('...'),
        getRoomMessagesApiEndpoint: (id) => Uri.parse('...'),
        deleteRoomApiEndpoint: (id) => Uri.parse('...'),
        archiveRoomApiEndpoint: (id) => Uri.parse('...'),
        markRoomAsReadApiEndpoint: (id) => Uri.parse('...'),
        sendMessageToRoomApiEndpoint: (dto) => Uri.parse('...'),
        deleteMessageApiEndpoint: (id) => Uri.parse('...'),
        unArchiveRoomApiEndpoint: (id) => Uri.parse('...'),
      ),
    ),
  );
}

2. Basic Usage

Displaying a Chat Room List

Use the ChatRoomListTemplate to display a list of conversations.

ChatRoomListTemplate(
  appUserId: context.authUser.id,
  config: ChatRoomsListConfig(
    paramBuilder: (searchText) => CommonApiParams(
      filter: {'isActive': true},
      search: searchText,
    ),
  ),
  chatItemStyle: ChatItemStyle(
    onTap: (chatRoom) => Navigator.pushNamed(context, '/chat', arguments: chatRoom.id),
  ),
)

Displaying a Messaging View

Use the ChatRoomViewTemplate for the actual chat conversation.

ChatRoomViewTemplate(
  chatRoomId: widget.chatRoomId,
  appUserId: context.authUser.id,
  config: ChatRoomViewConfig(
    // Optional custom DTO builder for sending messages
    sendMessageDtoBuilder: (dto) => MyCustomMessageDto(
      chatRoomId: widget.chatRoomId,
      message: dto.message,
    ),
  ),
  onEvent: (event) {
    // Handle events like room loaded, message sent, etc.
  },
)

Customization

Styling Chat Items

You can customize the appearance of items in the list using ChatItemStyle:

ChatItemStyle(
  onTap: (chat) => ...,
  itemBuilder: (chat, onTap, avatar, badge) {
    return MyCustomChatItemWidget(chat: chat, onTap: onTap);
  },
  slidableActionsStyle: SlidableActionsStyle(
    enableArchiveRoomAction: true,
    archiveIcon: Icons.archive,
  ),
)

Styling Messages

Customize message bubbles and the layout of the message list:

MessageListStyle(
  itemStyle: MessageItemStyle(
    myMessageTextStyle: TextStyle(color: Colors.white),
    messageBubbleStyle: MessageBubbleStyle(
      padding: EdgeInsets.all(12),
      borderRadius: BorderRadius.circular(8),
    ),
  ),
)

Key Components

• MessengerBloc: Handles global messenger actions (fetch rooms, archive room, etc.).
• ChatRoomListTemplateBloc: Manages the state of a specific chat room list.
• ChatRoomViewTemplateContainerBloc: Manages the state of a specific chat room view (messages, pagination).
• MessengerService: The infrastructure layer handling API calls.

License

BSD 2-Clause License - See LICENSE for details.