From 9ee472595a7d4f9a53bc5b173aed91a921269ea8 Mon Sep 17 00:00:00 2001
From: WRadoslaw <92513933+WRadoslaw@users.noreply.github.com>
Date: Tue, 26 Sep 2023 16:40:42 +0200
Subject: [PATCH] =?UTF-8?q?=F0=9F=A7=87=20Unlock=20revenue=20share=20(#490?=
 =?UTF-8?q?6)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Bump types package

* Create a transaction for exiting revenue split

* Add proxy
---
 .../RevenueShareWidget/RevenueShareWidget.tsx | 36 ++++++++++++++++---
 .../atlas/src/joystream-lib/extrinsics.ts     |  8 +++--
 packages/atlas/src/joystream-lib/types.ts     |  3 ++
 3 files changed, 39 insertions(+), 8 deletions(-)

diff --git a/packages/atlas/src/components/_crt/RevenueShareWidget/RevenueShareWidget.tsx b/packages/atlas/src/components/_crt/RevenueShareWidget/RevenueShareWidget.tsx
index cc5cb30754..35d815f333 100644
--- a/packages/atlas/src/components/_crt/RevenueShareWidget/RevenueShareWidget.tsx
+++ b/packages/atlas/src/components/_crt/RevenueShareWidget/RevenueShareWidget.tsx
@@ -1,4 +1,4 @@
-import { ReactElement } from 'react'
+import { ReactElement, useCallback } from 'react'
 
 import { SvgActionCalendar, SvgJoyTokenMonochrome16 } from '@/assets/icons'
 import { Avatar } from '@/components/Avatar'
@@ -8,35 +8,61 @@ import { NumberFormat } from '@/components/NumberFormat'
 import { Text } from '@/components/Text'
 import { Button } from '@/components/_buttons/Button'
 import { InfoBox, Wrapper } from '@/components/_crt/RevenueShareWidget/RevenueShareWidget.styles'
+import { useJoystream } from '@/providers/joystream'
+import { useSnackbar } from '@/providers/snackbars'
+import { useTransaction } from '@/providers/transactions/transactions.hooks'
+import { useUser } from '@/providers/user/user.hooks'
 import { formatDateTime } from '@/utils/time'
 
 export type RevenueShareWidgetProps = {
+  tokenId: string
   tokenName: string
   userShare: number
   userTokens: number
   shareEndDate: Date
-  onAction?: () => void
+  onClaimShare?: () => void
   status: 'active' | 'upcoming' | 'locked' | 'unlocked'
 }
 export const RevenueShareWidget = ({
   userShare,
   userTokens,
   tokenName,
-  onAction,
+  onClaimShare,
   shareEndDate,
   status,
+  tokenId,
 }: RevenueShareWidgetProps) => {
+  const { joystream, proxyCallback } = useJoystream()
+  const handleTransaction = useTransaction()
+  const { memberId } = useUser()
+  const { displaySnackbar } = useSnackbar()
+  const unlockStake = useCallback(async () => {
+    if (!joystream || !memberId) {
+      return
+    }
+    handleTransaction({
+      txFactory: async (updateStatus) =>
+        (await joystream.extrinsics).exitRevenueSplit(tokenId, memberId, proxyCallback(updateStatus)),
+      onTxSync: async (data) => {
+        displaySnackbar({
+          title: `${data.amount} $${tokenName} unlocked`,
+          iconType: 'success',
+        })
+      },
+    })
+  }, [joystream, memberId, handleTransaction, tokenId, proxyCallback, displaySnackbar, tokenName])
+
   const actionNode = () => {
     switch (status) {
       case 'active':
         return (
-          <Button fullWidth onClick={onAction}>
+          <Button fullWidth onClick={onClaimShare}>
             Claim your share
           </Button>
         )
       case 'unlocked':
         return (
-          <Button fullWidth onClick={onAction}>
+          <Button fullWidth onClick={unlockStake}>
             Unlock tokens
           </Button>
         )
diff --git a/packages/atlas/src/joystream-lib/extrinsics.ts b/packages/atlas/src/joystream-lib/extrinsics.ts
index 5a1f08450b..28ff9f6c88 100644
--- a/packages/atlas/src/joystream-lib/extrinsics.ts
+++ b/packages/atlas/src/joystream-lib/extrinsics.ts
@@ -39,6 +39,7 @@ import {
   ChannelInputBuckets,
   ChannelInputMetadata,
   CommentReaction,
+  ExitRevenueSplitResult,
   ExtrinsicResult,
   ExtrinsicStatus,
   ExtrinsicStatusCallbackFn,
@@ -1017,14 +1018,15 @@ export class JoystreamLibExtrinsics {
     return this.api.tx.projectToken.exitRevenueSplit(parseInt(tokenId), parseInt(memberId))
   }
 
-  exitRevenueSplit: PublicExtrinsic<typeof this.exitRevenueSplitTx, ExtrinsicResult> = async (
+  exitRevenueSplit: PublicExtrinsic<typeof this.exitRevenueSplitTx, ExitRevenueSplitResult> = async (
     tokenId,
     memberId,
     cb
   ) => {
     const tx = await this.exitRevenueSplitTx(tokenId, memberId)
-    const { block } = await this.sendExtrinsic(tx, cb)
-    return { block }
+    const { block, getEventData } = await this.sendExtrinsic(tx, cb)
+    const amount = getEventData('projectToken', 'RevenueSplitLeft')[2]
+    return { block, amount: amount.toString() }
   }
 
   participateInSplitTx = async (tokenId: TokenId, memberId: MemberId, amount: StringifiedNumber) => {
diff --git a/packages/atlas/src/joystream-lib/types.ts b/packages/atlas/src/joystream-lib/types.ts
index 95be3b2513..0f590f5146 100644
--- a/packages/atlas/src/joystream-lib/types.ts
+++ b/packages/atlas/src/joystream-lib/types.ts
@@ -153,6 +153,9 @@ export type VideoExtrinsicResult = ExtrinsicResult<{
 export type MemberExtrinsicResult = ExtrinsicResult<{ memberId: MemberId }>
 export type NftExtrinsicResult = ExtrinsicResult
 export type MetaprotcolExtrinsicResult = ExtrinsicResult<{ metaprotocol: true; transactionHash: string }>
+export type ExitRevenueSplitResult = {
+  amount: string
+} & ExtrinsicResult
 
 type TxMethodsFromClass<T> = T extends `${infer _}Tx` ? T : never