Mastering Reactions: Adding and Removing them in React Native

User engagement is key and one of the ways to enhance this engagement is through reactions on posts. This tutorial will delve into the functionality of adding and removing reactions on posts using TypeScript.

We will explore the addReaction and removeReaction functions provided by Social+. These functions enable users to express their feelings towards a post in a more nuanced way and also give them the flexibility to change their reactions over time. So, whether you're a seasoned developer or a newbie, join us as we dive into the world of reactions in TypeScript applied to React Native.

Pre-requisites
Before we dive into the tutorial, ensure you have the following requirements:

1. Basic knowledge of TypeScript
2. An installed and configured TypeScript environment
3. The Social+ SDK installed in your project
4. An Social+ Portal account
5. An Social+ Console Account

Note: If you haven’t already registered for an Social+ account, we recommend following our comprehensive step-by-step guide in the Social+ Portal to create your new network.

Step 1: Understanding the addReaction Function

The addReaction function allows users to add a reaction to a post. The function takes the name of the reaction as a parameter, with a maximum length of 100 characters. The reaction name is case-sensitive, which means that "like" and "Like" are treated as two different reactions.

Here’s how you can use the addReaction function in TypeScript:

‍

In the above code, we’re importing the ReactionRepository from the Social SDK and using its addReaction method to add a reaction to a post. The method takes three parameters: the type of the reference (in this case, 'post'), the ID of the post, and the name of the reaction.

Step 2: Adding a Reaction

To add a reaction, simply call the addPostReaction function with the appropriate parameters. For example:

‍

If the reaction is successfully added, the function will return true. Otherwise, it will return false or an error.

Step 3: Understanding the removeReaction Function

The removeReaction function allows users to remove a previously added reaction from a post. This provides users with greater control over their engagement with the content and allows them to change their mind or update their reaction to the post over time.

Here’s how you can use the removeReaction function in TypeScript:

‍

In the above code, we’re using the removeReaction method of the ReactionRepository to remove a reaction from a post. The method takes the same parameters as the addReaction method.

Step 4: Removing a Reaction

To remove a reaction, simply call the removePostReaction function with the appropriate parameters. For example:

‍

If the reaction is successfully removed, the function will return true. Otherwise, it will return false or an error.

‍

Final Thoughts
Adding and removing reactions in TypeScript is a straightforward process thanks to Social+. With the addReaction and removeReaction functions, you can enhance user engagement on your platform by allowing users to express their feelings towards a post in a more nuanced way. Remember, the reaction name is case-sensitive, so "like" and "Like" are treated as two different reactions. Feel free to give it a try with Social+!