From f4902ef4ee8af15dcf895d9e058f61fb5e623328 Mon Sep 17 00:00:00 2001
From: Hien Le <leduyhien152@gmail.com>
Date: Wed, 6 Mar 2024 17:25:51 +0700
Subject: [PATCH] fix: recap tip button event

---
 .../components/Profile/RecapSection.tsx        | 18 +++++++++++++++++-
 1 file changed, 17 insertions(+), 1 deletion(-)

diff --git a/apps/mochi-web/components/Profile/RecapSection.tsx b/apps/mochi-web/components/Profile/RecapSection.tsx
index d089a1d6c..3b1e618cb 100644
--- a/apps/mochi-web/components/Profile/RecapSection.tsx
+++ b/apps/mochi-web/components/Profile/RecapSection.tsx
@@ -36,6 +36,9 @@ import { useTheme } from '~hooks/useTheme'
 import clsx from 'clsx'
 import { useState } from 'react'
 import { useFetchTotalBalance } from '~hooks/profile/useFetchTotalBalance'
+import { ROUTES } from '~constants/routes'
+import { useRouter } from 'next/router'
+import events from '~constants/events'
 
 const intervals = [
   {
@@ -120,6 +123,14 @@ const UserSection = ({ type, statTx }: Props) => {
       />
     )
 
+  const { pathname, push } = useRouter()
+  const redirectToTipWidget = async () => {
+    if (pathname !== ROUTES.HOME) {
+      await push(ROUTES.HOME)
+    }
+    window.dispatchEvent(new Event(events.TIP_WIDGET.FOCUS_AMOUNT))
+  }
+
   if (type === 'sent' && !statTx) {
     return (
       <div className="flex items-center py-4 space-x-2">
@@ -128,7 +139,12 @@ const UserSection = ({ type, statTx }: Props) => {
           <Typography level="p5" color="textTertiary">
             To send money
           </Typography>
-          <Button variant="link" color="neutral" className="pr-0 pl-0 h-auto">
+          <Button
+            variant="link"
+            color="neutral"
+            className="pr-0 pl-0 h-auto"
+            onClick={redirectToTipWidget}
+          >
             <TipSolid className="w-4 h-4" />
             tip
           </Button>