Skip to main content

Getting Started

The LikeMinds Flutter Chat SDK provides a wrapper layer around the built-in functionalities to provide a seamless integration experience within a single sitting without much configuration needed out of the box.

Although, we do provide a high level customisation of all the widgets, screens, and flows being used to power the experience that can be tuned according to the look and feel of your existing apps.

Prerequisites​

Before getting started, ensure you have:

  1. Generated API key from LikeMinds dashboard
  2. The likeminds_chat_flutter_core dependency, which can be found here

Step-by-Step Integration Guide​

Follow these steps to integrate the LikeMinds Chat SDK into your Flutter application:

Step 1 - Installation​

Open the terminal, and run the following command in your Flutter project's directory.

flutter pub add likeminds_chat_flutter_core

Step 2 - Setup LikeMinds Chat​

Setup the LMChatCore package in the main function with the following code

main(){
// Call setup function before the runApp() function
await LMChatCore.instance.initialize();
...
runApp(YourApp());
}

Step 3 - Initiate User Session​

When integrating the LikeMinds Chat SDK into your application, you have the option to initiate a user session using one of two approaches:

1. With API Key (Client Side Authentication)​

This approach should be used when you want to manage LikeMinds authentication tokens on frontend. In this case you provide API Key directly to LikeMinds Chat SDK, which will be used to initiate a user session by calling showChatWithApiKey() method from LMChatCore.

// initiate user session, use the response to check for any errors
 LMResponse<void> response = await LMChatCore.instance.showChatWithApiKey(
  apiKey : "YOUR_API_KEY",
  uuid : "USER_ID",
  userName : "USER_NAME",
);

2. Without API Key (Server Side Authentication)​

This approach should be used when you want to manage LikeMinds authentication tokens on your backend server. In this case you eliminate the need to expose your API Key to your client app and your backend server is responsible for calling the initiate API to obtain the accessToken and refreshToken.

  1. Create a function to get accessToken and refreshToken from your backend using initiate API
Future<(String, String)> getTokens() async {
...
// implementation
...
return (accessToken, refreshToken);
}
  1. Set up the LMChatCore package in the main function with the following code and pass LMChatCoreCallback
info

LMChatCoreCallback has two callbacks:

  1. onAccessTokenExpiredAndRefreshed: This callback is triggered when the provided accessToken expires and is refreshed internally using the refreshToken.

  2. onRefreshTokenExpired: This callback is triggered when the provided refreshToken expires. In this case, you need to provide a new accessToken and refreshToken from your backend function using our initiate API. :::

main(){
// Call setup function before the runApp() function
await LMChatCore.instance.initialize(
  lmChatCallback: LMChatCoreCallback(
    onAccessTokenExpiredAndRefreshed: (accessToken, refreshToken) {
      debugPrint("Access token expired and refreshed");
    },
    onRefreshTokenExpired: () async {
      // get accessToken, refreshToken from your backend
      final (accessToken, refreshToken) = await getTokens();
      // return `LMAuthToken` with `accessToken` and `refreshToken` received from your backend
      return (LMAuthTokenBuilder()
            ..accessToken(accessToken!)
            ..refreshToken(refreshToken!))
          .build();
    },
  ),
);
...
runApp(YourApp());
}
  1. Use the getTokens() function Use the getTokens() function, to fetch the tokens to login without API Key. Upon receiving the accessToken and refreshToken, call LMChatCore.instance.showChatWithoutApiKey() function with these tokens.
// get accessToken, refreshToken from your backend
final (accessToken, refreshToken) = await getTokens();
LMResponse response =
    await LMChatCore.instance.showChatWithoutApiKey(
      accessToken : "YOUR_ACCESS_TOKEN",
      refreshToken : "YOUR_REFRESH_TOKEN",
    );

Step 4 - Navigation to Chat​

On successful response of the above snippet you can simply navigate to the LMChatHomeScreen, and start using Chat in your app

if (response.success) {
  MaterialPageRoute route = MaterialPageRoute(
    builder: (context) => const LMChatHomeScreen(),
  );

  Navigator.pushReplacement(context, route);
}

By choosing the appropriate method based on your backend infrastructure and security preferences, you can seamlessly integrate the Chat SDK into your application while ensuring secure and efficient session management. :::

Congratulations! Your integration is now complete.​


congratulations