How to Integrate the Ruut Flutter SDK

Overview

The Ruut Flutter SDK allows you to seamlessly integrate the Ruut chat widget into your Flutter application. Follow the steps below to get started with installation, permissions, usage, and more.

Installation

To integrate the Ruut Flutter SDK into your Flutter project, follow these steps:

Open your pubspec.yaml file.
Add ruut as a dependency. Your file should look like this: ensure to use the latest flutter package as at when you are reading this.
```
dependencies:
  flutter:
    sdk: flutter
  ruut: ^0.0.7
```
Save the file and run flutter pub get to install the package.

Permissions

Android

You need to add specific permissions to your Android app. Follow these steps:

Open android/app/src/main/AndroidManifest.xml.

Add the following lines inside the <manifest> tag:

<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>

Inside the <application> tag, add:

<application android:usesCleartextTraffic="true"

iOS

For iOS, you need to modify the Info.plist file:

Open ios/Runner/Info.plist.
Add the following keys:

<key>NSPhotoLibraryUsageDescription</key>
<string>This app requires access to the photo library for image uploads.</string>
<key>NSCameraUsageDescription</key>
<string>This app requires access to the camera for image captures.</string>

Setup

After logging in, follow the process to create a new workspace. You can find detailed instructions on creating a workspace here.

Usage

Here's how you can use the Ruut SDK in your Flutter application:

Import the Ruut package:

import 'package:flutter/material.dart';
import 'package:ruut/ruut.dart';

Create a widget to display the Ruut chat:

class MyRuutScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Ruut Chat')),
      body: Ruut(
        ruutToken: 'YOUR_RUUT_TOKEN',
        user: RuutUser(
          id: 'USER_ID',
          email: '[email protected]',
          fullName: 'John Doe',
          // Add other user details here
        ),
        onReady: () {
          print('Ruut is ready');
        },
      ),
    );
  }
}

Features

Setting User Details

To set or update user details, use:

Ruut.setUser(RuutUser(
  id: 'USER_ID',
  email: '[email protected]',
  fullName: 'John Doe',
  // Add other user details here
));

Custom Attributes

To set custom attributes for the user:

Ruut.setCustomAttributes({'plan': 'Premium', 'tier': 'Tier 2'});

Resetting User

To reset the user data:

Ruut.resetUser();

Deleting Custom Attributes

To delete a specific custom attribute:

Ruut.deleteCustomAttribute('customAttributeKey');

RuutUser Model

The RuutUser model includes:

id (required): The user's unique identifier
email: User's email address
avatarUrl: URL to the user's avatar image
fullName: User's full name
phone: User's phone number
identifierHash: Identifier hash for the user
description: A brief description of the user
countryCode: Two-letter country code
city: User's city
companyName: User's company name
socialProfiles: Social profile information (Twitter, Facebook, GitHub, LinkedIn)

Troubleshooting

If you encounter issues:

Verify that all required permissions are added to your app’s manifest files.
Ensure your Ruut token is correct and valid.
Confirm you have a stable internet connection.
Ensure you added the website token to the App.

For detailed support, contact our support team.