We provide a set of custom hooks which could be categorised based on their objective and functionalities.
The purpose of these hooks is to provide you UI state or reactive resources which could be used by UI components. These resources could be:
- UI specific states - eg: UI state flag which drives showing or hiding gif picker.
- LiveLike resource entity - eg: LiveLike chat messages, reaction packs, sticker packs, reaction space, user reactions, widgets etc.
Few examples of resource based hooks are:
These hooks when invoked either introduces some side effects which in turn drives UI state resources or provide an API for you to manually drive such side effect. This side effects could either be creating subscriptions to update resources or initial loading of resources. Mostly these hooks would be invoked once per UI lifecycle based on its dependencies and thus we recommend to use these side effect hook at the top level of your UI component hierarchy. To identify side effect based hook, we suffix the hook name with
useChatMessagesEffect-> Based on provided
roomId, this hook subscribes to Livelike channels for updating chat message list resource in real time. Since its a subscription side effect, we recommend invoking
useChatMessagesEffectat the top level component to have minimum subscriptions and unsubscriptions.
useLoadReactions-> Based on provided
reactionSpaceId, this hooks fetches and updates reaction pack resource.
useUserReactionEffect-> Based on provided
reactionSpaceId, this hook subscribes to Reaction space channel for updating user reaction state resources.
These hooks exports action handlers or API which could be used by UI component to update the state resources. More or less its like
setState based API functions.
Few examples of action based hooks:
deleteChatMessageaction handlers that add and remove a chat message from the chat message list resource respectively.
addBannerItemaction handler that add a banner item to
Updated 6 months ago