[C-958] Add native tip reaction (#1888)

packages/mobile/src/screens/notifications-screen/Notifications/TipReceivedNotification.tsx

@@ -13,12 +13,11 @@ import type {
   ReactionTypes
 } from '@audius/common'
 import { Image, View } from 'react-native'
-import { useSelector } from 'react-redux'
+import { useDispatch, useSelector } from 'react-redux'
 
 import Checkmark from 'app/assets/images/emojis/white-heavy-check-mark.png'
 import IconTip from 'app/assets/images/iconTip.svg'
 import { Text } from 'app/components/core'
-import { useDispatchWeb } from 'app/hooks/useDispatchWeb'
 import { make } from 'app/services/analytics'
 import { EventNames } from 'app/types/analytics'
 
@@ -53,7 +52,7 @@ const messages = {
 }
 
 const useSetReaction = (tipTxSignature: string) => {
-  const dispatch = useDispatchWeb()
+  const dispatch = useDispatch()
 
   const setReactionValue = useCallback(
     (reaction: Nullable<ReactionTypes>) => {

packages/mobile/src/store/sagas.ts

@@ -40,6 +40,7 @@ import searchBarSagas from 'common/store/search-bar/sagas'
 import smartCollectionPageSagas from 'common/store/smart-collection/sagas'
 import socialSagas from 'common/store/social/sagas'
 import tippingSagas from 'common/store/tipping/sagas'
+import reactionSagas from 'common/store/ui/reactions/sagas'
 import favoritePageSagas from 'common/store/user-list/favorites/sagas'
 import followersPageSagas from 'common/store/user-list/followers/sagas'
 import followingPageSagas from 'common/store/user-list/following/sagas'
@@ -107,6 +108,7 @@ export default function* rootSaga() {
     ...trendingUndergroundSagas(),
     ...savedSagas(),
     ...profileSagas(),
+    ...reactionSagas(),
     ...socialSagas(),
     ...favoritePageSagas(),
     ...followersPageSagas(),

packages/web/src/common/store/ui/reactions/sagas.ts

@@ -4,15 +4,39 @@ import {
   reactionsMap,
   reactionsUIActions,
   reactionsUISelectors,
-  getContext
+  getContext,
+  AudiusBackend,
+  getErrorMessage
 } from '@audius/common'
 import { call, takeEvery, all, put, select } from 'typed-redux-saga'
 
-import { submitReaction } from 'services/audius-backend/Reactions'
 const { fetchReactionValues, setLocalReactionValues, writeReactionValue } =
   reactionsUIActions
 const { makeGetReactionForSignature } = reactionsUISelectors
 
+type SubmitReactionConfig = {
+  reactedTo: string
+  reactionValue: number
+  audiusBackend: AudiusBackend
+}
+
+type SubmitReactionResponse = { success: boolean; error: any }
+
+const submitReaction = async ({
+  reactedTo,
+  reactionValue,
+  audiusBackend
+}: SubmitReactionConfig): Promise<SubmitReactionResponse> => {
+  try {
+    const libs = await audiusBackend.getAudiusLibs()
+    return libs.Reactions.submitReaction({ reactedTo, reactionValue })
+  } catch (err) {
+    const errorMessage = getErrorMessage(err)
+    console.error(errorMessage)
+    return { success: false, error: errorMessage }
+  }
+}
+
 function* fetchReactionValuesAsync({
   payload
 }: ReturnType<typeof fetchReactionValues>) {
@@ -57,9 +81,12 @@ function* writeReactionValueAsync({
     })
   )
 
-  yield call(submitReaction, {
+  const audiusBackend = yield* getContext('audiusBackendInstance')
+
+  yield* call(submitReaction, {
     reactedTo: entityId,
-    reactionValue: newReactionValue ? reactionsMap[newReactionValue] : 0
+    reactionValue: newReactionValue ? reactionsMap[newReactionValue] : 0,
+    audiusBackend
   })
 }