update

Author: devchenyan

packages/neuron-ui/src/components/MultisigAddress/hooks.ts

@@ -300,44 +300,44 @@ const useApproveAction = () => {
 
 const useDaoDepositAction = () => {
   const [isDialogOpen, setIsDialogOpen] = useState(false)
-  const [sendFromMultisig, setSendFromMultisig] = useState<MultisigConfig | undefined>()
-  const onOpenSendDialog = useCallback(
+  const [depositFromMultisig, setDepositFromMultisig] = useState<MultisigConfig | undefined>()
+  const onOpenDialog = useCallback(
     (option: MultisigConfig) => {
       setIsDialogOpen(true)
-      setSendFromMultisig(option)
+      setDepositFromMultisig(option)
     },
-    [setIsDialogOpen, setSendFromMultisig]
+    [setIsDialogOpen, setDepositFromMultisig]
   )
   const closeDialog = useCallback(() => {
     setIsDialogOpen(false)
   }, [setIsDialogOpen])
 
   return {
-    action: onOpenSendDialog,
+    action: onOpenDialog,
     closeDialog,
-    sendFromMultisig,
+    depositFromMultisig,
     isDialogOpen,
   }
 }
 
 const useDaoWithdrawAction = () => {
   const [isDialogOpen, setIsDialogOpen] = useState(false)
-  const [sendFromMultisig, setSendFromMultisig] = useState<MultisigConfig | undefined>()
-  const onOpenSendDialog = useCallback(
+  const [withdrawFromMultisig, setWithdrawFromMultisig] = useState<MultisigConfig | undefined>()
+  const onOpenDialog = useCallback(
     (option: MultisigConfig) => {
       setIsDialogOpen(true)
-      setSendFromMultisig(option)
+      setWithdrawFromMultisig(option)
     },
-    [setIsDialogOpen, setSendFromMultisig]
+    [setIsDialogOpen, setWithdrawFromMultisig]
   )
   const closeDialog = useCallback(() => {
     setIsDialogOpen(false)
   }, [setIsDialogOpen])
 
   return {
-    action: onOpenSendDialog,
+    action: onOpenDialog,
     closeDialog,
-    sendFromMultisig,
+    withdrawFromMultisig,
     isDialogOpen,
   }
 }

packages/neuron-ui/src/components/MultisigAddress/index.tsx

@@ -6,13 +6,18 @@ import {
   useExitOnWalletChange,
   useGoBack,
   useOnWindowResize,
+  calculateFee,
+  useClearGeneratedTx,
 } from 'utils'
-import { useState as useGlobalState } from 'states'
+import appState from 'states/init/app'
+import { useState as useGlobalState, useDispatch, showPageNotice } from 'states'
 import MultisigAddressCreateDialog from 'components/MultisigAddressCreateDialog'
 import MultisigAddressInfo from 'components/MultisigAddressInfo'
 import SendFromMultisigDialog from 'components/SendFromMultisigDialog'
 import { MultisigConfig, changeMultisigSyncStatus, openExternal } from 'services/remote'
 import ApproveMultisigTxDialog from 'components/ApproveMultisigTxDialog'
+import DepositDialog from 'components/DepositDialog'
+import MultisigAddressNervosDAODialog from 'components/MultisigAddressNervosDAODialog'
 import Dialog from 'widgets/Dialog'
 import Table from 'widgets/Table'
 import Tooltip from 'widgets/Tooltip'
@@ -37,9 +42,11 @@ import AttentionCloseDialog from 'widgets/Icons/Attention.png'
 import { HIDE_BALANCE, NetworkType } from 'utils/const'
 import { onEnter } from 'utils/inputDevice'
 import getMultisigSignStatus from 'utils/getMultisigSignStatus'
+import useGetCountDownAndFeeRateStats from 'utils/hooks/useGetCountDownAndFeeRateStats'
 import Button from 'widgets/Button'
 import SetStartBlockNumberDialog from 'components/SetStartBlockNumberDialog'
 import { type TFunction } from 'i18next'
+import hooks from 'components/NervosDAO/hooks'
 import {
   useSearch,
   useConfigManage,
@@ -97,14 +104,19 @@ const MultisigAddress = () => {
   const [t] = useTranslation()
   useExitOnWalletChange()
   const {
-    wallet: { id: walletId, addresses },
+    app: {
+      send = appState.send,
+      loadings: { sending = false },
+    },
+    wallet,
     chain: {
-      syncState: { bestKnownBlockNumber },
+      syncState: { bestKnownBlockNumber, bestKnownBlockTimestamp },
       networkID,
       connectionStatus,
     },
     settings: { networks = [] },
   } = useGlobalState()
+  const { id: walletId, addresses, balance } = wallet
   const isMainnet = isMainnetUtil(networks, networkID)
   const isLightClient = useMemo(
     () => networks.find(n => n.id === networkID)?.type === NetworkType.Light,
@@ -134,6 +146,11 @@ const MultisigAddress = () => {
     deleteConfigById,
   })
   const [showDeleteDialog, setShowDeleteDialog] = useState(false)
+  const { suggestFeeRate } = useGetCountDownAndFeeRateStats()
+  const clearGeneratedTx = useClearGeneratedTx()
+  const dispatch = useDispatch()
+  const [globalAPC, setGlobalAPC] = useState(0)
+  const [genesisBlockTimestamp, setGenesisBlockTimestamp] = useState<number | undefined>(undefined)
 
   const onClickItem = useCallback(
     (multisigConfig: MultisigConfig) => (e: React.SyntheticEvent<HTMLButtonElement>) => {
@@ -237,6 +254,42 @@ const MultisigAddress = () => {
   }, [updateTipPosition])
   useOnWindowResize(updateTipPosition)
 
+  const genesisBlockHash = useMemo(() => networks.find(v => v.id === networkID)?.genesisHash, [networkID, networks])
+  hooks.useInitData({
+    clearGeneratedTx,
+    dispatch,
+    wallet,
+    setGenesisBlockTimestamp,
+    genesisBlockHash,
+  })
+  hooks.useUpdateGlobalAPC({ bestKnownBlockTimestamp, genesisBlockTimestamp, setGlobalAPC })
+
+  const fee = `${shannonToCKBFormatter(
+    send.generatedTx ? send.generatedTx.fee || calculateFee(send.generatedTx) : '0'
+  )} CKB`
+
+  const onDepositSuccess = useCallback(() => {
+    daoDepositAction.closeDialog()
+    showPageNotice('nervos-dao.deposit-submitted')(dispatch)
+  }, [dispatch, daoDepositAction.closeDialog])
+
+  const MemoizedDepositDialog = useMemo(() => {
+    return (
+      <DepositDialog
+        balance={balance}
+        walletID={walletId}
+        show={daoDepositAction.isDialogOpen}
+        fee={fee}
+        onCloseDepositDialog={daoDepositAction.closeDialog}
+        isDepositing={sending}
+        isTxGenerated={!!send.generatedTx}
+        suggestFeeRate={suggestFeeRate}
+        globalAPC={globalAPC}
+        onDepositSuccess={onDepositSuccess}
+      />
+    )
+  }, [balance, walletId, fee, sending, send.generatedTx, suggestFeeRate, globalAPC, daoDepositAction])
+
   return (
     <div>
       <Dialog
@@ -541,19 +594,12 @@ const MultisigAddress = () => {
         />
       ) : null}
 
-      {daoDepositAction.sendFromMultisig && daoDepositAction.isDialogOpen ? (
-        <SendFromMultisigDialog
-          closeDialog={daoDepositAction.closeDialog}
-          multisigConfig={daoDepositAction.sendFromMultisig}
-          balance={sendTotalBalance}
-        />
-      ) : null}
+      {MemoizedDepositDialog}
 
-      {daoWithdrawAction.sendFromMultisig && daoWithdrawAction.isDialogOpen ? (
-        <SendFromMultisigDialog
+      {daoWithdrawAction.withdrawFromMultisig && daoWithdrawAction.isDialogOpen ? (
+        <MultisigAddressNervosDAODialog
           closeDialog={daoWithdrawAction.closeDialog}
-          multisigConfig={daoWithdrawAction.sendFromMultisig}
-          balance={sendTotalBalance}
+          multisigConfig={daoWithdrawAction.withdrawFromMultisig}
         />
       ) : null}
     </div>