๐Ÿ“ฆ view360_chat

view360_chat is a Flutter package designed for seamless integration of View360's real-time chat system into your applications.
It enables customer support chat functionality with features like live socket communication, file sharing, and message delivery tracking โ€” ideal for apps requiring responsive customer interaction.


๐Ÿงฉ Features

  • ๐Ÿ”Œ Real-time Socket Connection โ€” Instantly connect to View360โ€™s chat server.
  • ๐Ÿ’ฌ Send Messages โ€” Send messages with optional file attachments.
  • ๐Ÿ“ฅ Retrieve Chat History โ€” Access the full conversation history.
  • ๐Ÿงพ Customer Information Handling โ€” Easily pass customer name, email, and phone number.
  • โš™๏ธ Simple Setup โ€” Configure quickly with your base URL and App ID.
  • ๐Ÿ“ฒ Push Notifications โ€” Receive notifications directly from View360.

๐Ÿ› ๏ธ Connecting the Socket

First, connect the socket to start receiving messages from the agent side.

Parameters:

  • baseUrl: View360 server URL.
  • onMessage: Callback triggered when a message is received from the agent.

Inside the onMessage callback:

  • content: Message from the agent.
  • createdAt: Timestamp of the message.
  • senderType: Sender info (always the agent).
  • filePaths: Any file attachments from the agent.

Example

import 'package:view360_chat/view360_chat.dart';

final socketManager = SocketManager();

socketManager.connect(
  baseUrl: 'https://yourdomain.com',
  onMessage: ({
    required content,
    required createdAt,
    required response,
    required senderType,
    filePaths,
  }) {
    print('๐Ÿ“ฉ New message: \$content');
  },
);


โœ‰๏ธ Create Chat Session

The createChatSession function is used to initiate a new chat session. During registration, you must provide either the customerPhone or the customerEmail. You may also provide both if available.

If no agent is currently available, the success status will still be true, and the isInQueue flag will be set to true.

Example

import 'package:view360_chat/view360_chat.dart';

final chatService = ChatService(
  baseUrl: 'https://yourdomain.com',
  appId: 'your-app-id',
);

final response = await chatService.createChatSession(
  chatContent: 'Hello from View360!',
  customerName: 'John Doe',
  customerEmail: 'john@example.com',
  customerPhone: '1234567890',
);

if (response.success) {
  print('โœ… Chat session created successfully');
} else {
  print('โŒ Failed to create chat session: ${response.error}');
}


โœ‰๏ธ Sending Messages

The sendChatMessage function is used to send messages to the agent.

After sending a message:

  • A success response indicates that the message was sent successfully.
import 'package:view360_chat/view360_chat.dart';

final response = await chatService.sendChatMessage(
  filePath: [], // optional
  chatContent: 'Hello from View360!',
);

๐Ÿ“Ž Supported File Attachments

You can optionally attach files while sending a message. The following file types are supported:

  • Images: .jpg, .jpeg, .png, .gif
  • Documents: .pdf, .xlsx, .csv
  • Videos: .mp4

โœ… Ensure that the file path(s) you pass in filePath end with one of the supported extensions.

๐Ÿ“œ Fetching Message History

The fetchMessages function is used to retrieve the current list of chat messages.

Example

import 'package:view360_chat/view360_chat.dart';

final history = await chatService.fetchMessages();

if (history.success) {
  print('๐Ÿ’ฌ Chat History: \${history.messages}');
} else {
  print('โŒ Error: \${history.error}');
}

๐Ÿ“ฒ Push Notifications on iOS

To enable push notifications on iOS, the app must request notification permission from the user. Without this, Firebase Cloud Messaging (FCM) won't work. You need to call requestPermission() to prompt the user for permission.

Steps to Request Notification Permission on iOS

  1. Add Permission Descriptions in Info.plist:
    First, make sure to add the following entries in your Info.plist file:

    <key>UIBackgroundModes</key>
    <array>
      <string>fetch</string>
      <string>remote-notification</string>
    </array>
    <key>UIUserTrackingUsageDescription</key>
    <string>Your description of why you need to track the user.</string>
    

Libraries

view360_chat