Skip to content

Commit 6d44abf

Browse files
authored
chore: add order label to the historical transaction list (#99)
* feat: add order label to the historical transaction table
1 parent 6a861af commit 6d44abf

File tree

5 files changed

+32
-4
lines changed

5 files changed

+32
-4
lines changed

src/features/accounts/components/account-transaction-history.tsx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import { useCallback, useMemo } from 'react'
55
import { getAccountTransactionsTableSubRows } from '../utils/get-account-transactions-table-sub-rows'
66
import { InnerTransaction, Transaction } from '@/features/transactions/models'
77
import { transactionsTableColumns } from '@/features/transactions/components/transactions-table-columns'
8+
import { ListingOrderLabel } from '@/features/common/components/listing-order-label'
89

910
type Props = {
1011
address: Address
@@ -14,5 +15,10 @@ export function AccountTransactionHistory({ address }: Props) {
1415
const createLoadablePage = useMemo(() => createLoadableAccountTransactionsPage(address), [address])
1516
const getSubRows = useCallback((row: Transaction | InnerTransaction) => getAccountTransactionsTableSubRows(address, row), [address])
1617

17-
return <LazyLoadDataTable columns={transactionsTableColumns} getSubRows={getSubRows} createLoadablePage={createLoadablePage} />
18+
return (
19+
<div>
20+
<LazyLoadDataTable columns={transactionsTableColumns} getSubRows={getSubRows} createLoadablePage={createLoadablePage} />
21+
<ListingOrderLabel oldestToNewest={false} />
22+
</div>
23+
)
1824
}

src/features/applications/components/application-transaction-history.tsx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import { InnerTransaction, Transaction } from '@/features/transactions/models'
55
import { useCallback, useMemo } from 'react'
66
import { getApplicationTransactionsTableSubRows } from '../utils/get-application-transactions-table-sub-rows'
77
import { transactionsTableColumns } from '@/features/transactions/components/transactions-table-columns'
8+
import { ListingOrderLabel } from '@/features/common/components/listing-order-label'
89

910
type Props = {
1011
applicationId: ApplicationId
@@ -23,5 +24,10 @@ export function ApplicationTransactionHistory({ applicationId }: Props) {
2324
[applicationId]
2425
)
2526

26-
return <LazyLoadDataTable columns={transactionsTableColumns} getSubRows={getSubRows} createLoadablePage={createLoadablePage} />
27+
return (
28+
<div>
29+
<LazyLoadDataTable columns={transactionsTableColumns} getSubRows={getSubRows} createLoadablePage={createLoadablePage} />
30+
<ListingOrderLabel />
31+
</div>
32+
)
2733
}

src/features/assets/components/asset-transaction-history.tsx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import { Transaction, InnerTransaction } from '@/features/transactions/models'
55
import { useCallback, useMemo } from 'react'
66
import { getAssetTransactionsTableSubRows } from '../utils/get-asset-transactions-table-sub-rows'
77
import { transactionsTableColumns } from '@/features/transactions/components/transactions-table-columns'
8+
import { ListingOrderLabel } from '@/features/common/components/listing-order-label'
89

910
type Props = {
1011
assetId: AssetId
@@ -14,5 +15,10 @@ export function AssetTransactionHistory({ assetId }: Props) {
1415
const createLoadablePage = useMemo(() => createLoadableAssetTransactionsPage(assetId), [assetId])
1516
const getSubRows = useCallback((row: Transaction | InnerTransaction) => getAssetTransactionsTableSubRows(assetId, row), [assetId])
1617

17-
return <LazyLoadDataTable columns={transactionsTableColumns} getSubRows={getSubRows} createLoadablePage={createLoadablePage} />
18+
return (
19+
<div>
20+
<LazyLoadDataTable columns={transactionsTableColumns} getSubRows={getSubRows} createLoadablePage={createLoadablePage} />
21+
<ListingOrderLabel />
22+
</div>
23+
)
1824
}
Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
type Props = {
2+
oldestToNewest?: boolean
3+
}
4+
export function ListingOrderLabel({ oldestToNewest = true }: Props) {
5+
return (
6+
<div className="mt-3">
7+
<small>Note: This listing is {oldestToNewest ? 'oldest to newest' : 'newest to oldest'}.</small>
8+
</div>
9+
)
10+
}

src/index.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -154,6 +154,6 @@
154154
}
155155

156156
small {
157-
@apply text-sm font-medium leading-none;
157+
@apply text-sm text-muted-foreground leading-none;
158158
}
159159
}

0 commit comments

Comments
 (0)