Reactions - Reactions store

The ReactionsStore is one of the key interfaces that encapsulates all logic needed to maintain internal state of the reaction elements (get latest state and onChange callback events), including different types of Actions required to perform on the store (getReactions, toggleReaction on/off, adding a new reaciton, getting detailed reaction upon hovering the emoji icon). It serves as one of the key props passed to the connected HoC used in Reactions: (ConnectedReactionPicker and ConnectedReactions).


You can instantiate an instance of the ReactionsStore object using the built in MemoryReactionsStore class object that contains all logic required to communicate with the store. It provides all the methods to interact with the store and the API calls to the server, including loggingUFO.

Usage

import { MemoryReactionsStore, State, ReactionServiceClient } from '@atlaskit/reactions'; const apiConfig = { baseUrl: 'http://www.example.org', // optional, generate token from asap, check \`pf-emoji-service\` for more info authHeader: 'Bearer token', }; // Create a client object fetching the reactions data from the specified url const client = new ReactionServiceClient(apiConfig.baseUrl, apiConfig.authHeader); // Define the initial state object const intialState: State = { reactions: {}, flash: {} }; // Define the store object that will handle all the reactions data (get/set/remove) and the API calls to the server const store = new MemoryReactionsStore(client, intialState, { subproduct: 'atlaskit', });

Store Type

getReactions function required

Retrieve reaction collection api @param containerId the container for reactions/ari in the page @param aris collection of Asset ids in the container

function
containerId,
aris
=> undefined

toggleReaction function required

Select/deselect a rection callback

function
containerAri,
ari,
emojiId,
onSuccess
=> undefined

addReaction function required

Add a new reation api

function
containerAri,
ari,
emojiId,
onSuccess
=> undefined

getDetailedReaction function required

Hover an existing reaction emoji api

function
containerAri,
ari,
emojiId,
onSuccess
=> undefined

getState function required

Get current state of the stor

=>
reactions object required
[key: string] required One of
status required ReactionStatus.notLoaded
,
status required ReactionStatus.loading
,
status required ReactionStatus.ready
reactions arrayType required Array
ari string required
containerAri string required
emojiId string required
count number required
reacted boolean required
users arrayType Array
id string required
displayName string required
profilePicture
path string required
accountId string
optimisticallyUpdated boolean
,
status required ReactionStatus.error
message string required
flash object required
[key: string] object required
[emojiId: string] boolean required
particleEffectByEmoji object required
[key: string] object required
[emojiId: string] boolean required

onChange function required deprecated

Register a callbsack event on change to the store instance state data @param callback event to register initially implemented by the MemoryReactionsStore class and kept. This will be removed in a future release

callback => undefined

removeOnChangeListener function required deprecated

Deregister any callback event on changes to the store instance state data @param callback event to de-register initially implemented by the MemoryReactionsStore class and kept. This will be removed in a future release

callback => undefined

setCreateAnalyticsEvent function deprecated

Add Atlaskit analytics events to different operations in the store @param createAnalyticsEvent analytics event trigger initially implemented by the MemoryReactionsStore class and kept. This will be removed in a future release

createAnalyticsEvent => undefined

Actions type

getReactions function required

Retrieve reaction collection api @param containerId the container for reactions/ari in the page @param aris collection of Asset ids in the container

function
containerId,
aris
=> undefined

toggleReaction function required

Select/deselect a rection callback

function
containerAri,
ari,
emojiId,
onSuccess
=> undefined

addReaction function required

Add a new reation api

function
containerAri,
ari,
emojiId,
onSuccess
=> undefined

getDetailedReaction function required

Hover an existing reaction emoji api

function
containerAri,
ari,
emojiId,
onSuccess
=> undefined