diff --git a/src/app/features/activity-list/activity-list.tsx b/src/app/features/activity-list/activity-list.tsx index a8bde52abc6..594a2894c2a 100644 --- a/src/app/features/activity-list/activity-list.tsx +++ b/src/app/features/activity-list/activity-list.tsx @@ -16,6 +16,7 @@ import { convertBitcoinTxsToListType, convertStacksTxsToListType } from './activ import { NoAccountActivity } from './components/no-account-activity'; import { PendingTransactionList } from './components/pending-transaction-list/pending-transaction-list'; import { SubmittedTransactionList } from './components/submitted-transaction-list/submitted-transaction-list'; +import { TabWrapper } from './components/tab-wrapper'; import { TransactionList } from './components/transaction-list/transaction-list'; // TODO: temporary really ugly fix while we address conditional data problem of @@ -94,12 +95,22 @@ export function ActivityList() { const hasTxs = hasSubmittedTransactions || hasPendingTransactions || hasTransactions; - if (isInitialLoading) return ; + if (isInitialLoading) + return ( + + + + ); - if (!hasTxs) return ; + if (!hasTxs) + return ( + + + + ); return ( - <> + {hasSubmittedTransactions && } {hasPendingTransactions && ( )} - + ); } diff --git a/src/app/features/activity-list/components/no-account-activity.tsx b/src/app/features/activity-list/components/no-account-activity.tsx index 9d239c139fa..4340b859eb4 100644 --- a/src/app/features/activity-list/components/no-account-activity.tsx +++ b/src/app/features/activity-list/components/no-account-activity.tsx @@ -1,11 +1,11 @@ import NoActivity from '@assets/images/no-activity.png'; -import { Stack } from '@stacks/ui'; +import { Stack } from 'leather-styles/jsx'; import { Caption } from '@app/components/typography'; export function NoAccountActivity() { return ( - + No activity yet diff --git a/src/app/features/activity-list/components/tab-wrapper.tsx b/src/app/features/activity-list/components/tab-wrapper.tsx new file mode 100644 index 00000000000..e22e6286ef6 --- /dev/null +++ b/src/app/features/activity-list/components/tab-wrapper.tsx @@ -0,0 +1,15 @@ +import { Box } from 'leather-styles/jsx'; + +interface TabWrapperProps { + children: React.ReactNode; + padContent?: boolean; +} + +export function TabWrapper({ children, padContent = false }: TabWrapperProps) { + return ( + // Height set based on the height of the empty assets screen + + {children} + + ); +} diff --git a/src/app/features/asset-list/asset-list.tsx b/src/app/features/asset-list/asset-list.tsx index 8a63771f5b1..003beb1bbc0 100644 --- a/src/app/features/asset-list/asset-list.tsx +++ b/src/app/features/asset-list/asset-list.tsx @@ -1,8 +1,8 @@ import { Outlet } from 'react-router-dom'; import { useNavigate } from 'react-router-dom'; -import { Box, Stack } from '@stacks/ui'; import { HomePageSelectors } from '@tests/selectors/home.selectors'; +import { Stack } from 'leather-styles/jsx'; import { LEDGER_BITCOIN_ENABLED } from '@shared/environment'; @@ -27,14 +27,14 @@ export function AssetsList() { const navigate = useNavigate(); return ( - + {/* Temporary duplication during Ledger Bitcoin feature dev */} {whenWallet({ software: ( } + icon={} address={btcAddress} /> ), @@ -42,7 +42,7 @@ export function AssetsList() { } + icon={} address={btcAddress} // add conditionally if not bitcoin keys isPressable={!btcAddress}