From 5bf5c773e595904c78374cab6cfd38fcf193ddd8 Mon Sep 17 00:00:00 2001
From: Kamil Pyszkowski <kamil.pyszkowski@akena.co>
Date: Fri, 1 Dec 2023 13:13:13 +0100
Subject: [PATCH 1/5] Resolve `ActivityItem` component issue

Component tried to render without the necessary data causing error when
user disconnects the wallet on Mint/Unmint page.
---
 src/components/tBTC/BridgeActivity.tsx | 18 +++++++++++-------
 1 file changed, 11 insertions(+), 7 deletions(-)

diff --git a/src/components/tBTC/BridgeActivity.tsx b/src/components/tBTC/BridgeActivity.tsx
index 39399a178..e6058e079 100644
--- a/src/components/tBTC/BridgeActivity.tsx
+++ b/src/components/tBTC/BridgeActivity.tsx
@@ -36,7 +36,9 @@ export type BridgeActivityProps = {
 
 type BridgeActivityContextValue = {
   [Property in keyof BridgeActivityProps]-?: BridgeActivityProps[Property]
-} & { isBridgeHistoryEmpty: boolean }
+} & {
+  isWalletConnected: boolean
+}
 
 const BridgeActivityContext = createContext<
   BridgeActivityContextValue | undefined
@@ -59,13 +61,13 @@ export const BridgeActivity: FC<BridgeActivityProps> = ({
   emptyState,
   children,
 }) => {
-  const isBridgeHistoryEmpty = data.length === 0
+  const { active } = useWeb3React()
 
   return (
     <BridgeActivityContext.Provider
       value={{
         data,
-        isBridgeHistoryEmpty,
+        isWalletConnected: active,
         isFetching,
         emptyState: emptyState ?? <EmptyActivity />,
       }}
@@ -85,14 +87,14 @@ export const BridgeAcivityHeader: FC<StackProps> = (props) => {
 }
 
 export const BridgeActivityData: FC<ListProps> = (props) => {
-  const { data, isBridgeHistoryEmpty, isFetching, emptyState } =
+  const { data, isFetching, emptyState, isWalletConnected } =
     useBridgeActivityContext()
 
   return isFetching ? (
     <BridgeActivityLoadingState />
   ) : (
     <List spacing="1" mt="2" {...props}>
-      {isBridgeHistoryEmpty ? emptyState : data.map(renderActivityItem)}
+      {!!data && isWalletConnected ? data.map(renderActivityItem) : emptyState}
     </List>
   )
 }
@@ -181,13 +183,15 @@ export const ActivityItemWrapper: FC = ({ children }) => (
 )
 
 export const BridgeActivityEmptyHistoryImg: FC = () => {
-  const { isBridgeHistoryEmpty, isFetching } = useBridgeActivityContext()
+  const { data, isFetching } = useBridgeActivityContext()
   const epmtyHistoryImg = useColorModeValue(
     emptyHistoryImageSrcLight,
     emptyHistoryImageSrcDark
   )
 
-  return isBridgeHistoryEmpty && !isFetching ? (
+  const shouldRenderEmptyState = !data && !isFetching
+
+  return shouldRenderEmptyState ? (
     <>
       <Image alt="no-history" src={epmtyHistoryImg} mx="auto" mt={16} mb={4} />
       <BodyMd textAlign="center">You have no history yet.</BodyMd>

From 920b31dc96585838db98de4858e6c66001853843 Mon Sep 17 00:00:00 2001
From: Kamil Pyszkowski <kamil.pyszkowski@akena.co>
Date: Fri, 12 Jan 2024 13:23:45 +0100
Subject: [PATCH 2/5] Remove redundant `useEffect` call

Fetching ETH USD price is not needed in Base app
---
 src/App.tsx | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 50e90ef8c..0120c34f9 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -90,10 +90,6 @@ const AppBody = () => {
     }
   }, [connector, dispatch, account])
 
-  useEffect(() => {
-    dispatch(fetchETHPriceUSD())
-  }, [dispatch])
-
   usePosthog()
   useSaveConnectedAddressToStore()
   useSentry()

From 78f10f1efc4611f494e554b812c2dc9dd1e7d2fb Mon Sep 17 00:00:00 2001
From: Kamil Pyszkowski <kamil.pyszkowski@akena.co>
Date: Fri, 12 Jan 2024 17:58:12 +0100
Subject: [PATCH 3/5] Fix `BridgeActivity` history conditional rendering

Updated conditions to include wallet connection.
Fixed typo: `epmty` => `empty`
---
 src/components/tBTC/BridgeActivity.tsx | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/components/tBTC/BridgeActivity.tsx b/src/components/tBTC/BridgeActivity.tsx
index e6058e079..dcfe0d055 100644
--- a/src/components/tBTC/BridgeActivity.tsx
+++ b/src/components/tBTC/BridgeActivity.tsx
@@ -184,16 +184,17 @@ export const ActivityItemWrapper: FC = ({ children }) => (
 
 export const BridgeActivityEmptyHistoryImg: FC = () => {
   const { data, isFetching } = useBridgeActivityContext()
-  const epmtyHistoryImg = useColorModeValue(
+  const { active } = useWeb3React()
+  const emptyHistoryImg = useColorModeValue(
     emptyHistoryImageSrcLight,
     emptyHistoryImageSrcDark
   )
 
-  const shouldRenderEmptyState = !data && !isFetching
+  const shouldRenderEmptyState = !active || (!data && !isFetching)
 
   return shouldRenderEmptyState ? (
     <>
-      <Image alt="no-history" src={epmtyHistoryImg} mx="auto" mt={16} mb={4} />
+      <Image alt="no-history" src={emptyHistoryImg} mx="auto" mt={16} mb={4} />
       <BodyMd textAlign="center">You have no history yet.</BodyMd>
     </>
   ) : (

From cfb65f4de1d1ce28969583c5889e635f5d61cabb Mon Sep 17 00:00:00 2001
From: Kamil Pyszkowski <kamil.pyszkowski@akena.co>
Date: Fri, 12 Jan 2024 18:11:26 +0100
Subject: [PATCH 4/5] Remove `isWalletConnected` from context

Adjust empty state rendering conditions.
---
 src/components/tBTC/BridgeActivity.tsx | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/components/tBTC/BridgeActivity.tsx b/src/components/tBTC/BridgeActivity.tsx
index dcfe0d055..952c1aaee 100644
--- a/src/components/tBTC/BridgeActivity.tsx
+++ b/src/components/tBTC/BridgeActivity.tsx
@@ -37,7 +37,7 @@ export type BridgeActivityProps = {
 type BridgeActivityContextValue = {
   [Property in keyof BridgeActivityProps]-?: BridgeActivityProps[Property]
 } & {
-  isWalletConnected: boolean
+  isBridgeHistoryEmpty: boolean
 }
 
 const BridgeActivityContext = createContext<
@@ -61,13 +61,13 @@ export const BridgeActivity: FC<BridgeActivityProps> = ({
   emptyState,
   children,
 }) => {
-  const { active } = useWeb3React()
+  const isBridgeHistoryEmpty = data.length === 0
 
   return (
     <BridgeActivityContext.Provider
       value={{
         data,
-        isWalletConnected: active,
+        isBridgeHistoryEmpty,
         isFetching,
         emptyState: emptyState ?? <EmptyActivity />,
       }}
@@ -87,14 +87,17 @@ export const BridgeAcivityHeader: FC<StackProps> = (props) => {
 }
 
 export const BridgeActivityData: FC<ListProps> = (props) => {
-  const { data, isFetching, emptyState, isWalletConnected } =
+  const { data, isBridgeHistoryEmpty, isFetching, emptyState } =
     useBridgeActivityContext()
+  const { active } = useWeb3React()
 
   return isFetching ? (
     <BridgeActivityLoadingState />
   ) : (
     <List spacing="1" mt="2" {...props}>
-      {!!data && isWalletConnected ? data.map(renderActivityItem) : emptyState}
+      {active && !isBridgeHistoryEmpty
+        ? data.map(renderActivityItem)
+        : emptyState}
     </List>
   )
 }

From f568babffd8634930f09adfd3ae31a8e6df5b3c6 Mon Sep 17 00:00:00 2001
From: Kamil Pyszkowski <kamil.pyszkowski@akena.co>
Date: Mon, 15 Jan 2024 15:28:50 +0100
Subject: [PATCH 5/5] Finetune empty state rendering condition

Used dedicated boolean flag instead of the data itself
---
 src/components/tBTC/BridgeActivity.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/components/tBTC/BridgeActivity.tsx b/src/components/tBTC/BridgeActivity.tsx
index 952c1aaee..7f6410294 100644
--- a/src/components/tBTC/BridgeActivity.tsx
+++ b/src/components/tBTC/BridgeActivity.tsx
@@ -186,14 +186,15 @@ export const ActivityItemWrapper: FC = ({ children }) => (
 )
 
 export const BridgeActivityEmptyHistoryImg: FC = () => {
-  const { data, isFetching } = useBridgeActivityContext()
+  const { isBridgeHistoryEmpty, isFetching } = useBridgeActivityContext()
   const { active } = useWeb3React()
   const emptyHistoryImg = useColorModeValue(
     emptyHistoryImageSrcLight,
     emptyHistoryImageSrcDark
   )
 
-  const shouldRenderEmptyState = !active || (!data && !isFetching)
+  const shouldRenderEmptyState =
+    !active || (isBridgeHistoryEmpty && !isFetching)
 
   return shouldRenderEmptyState ? (
     <>