Skip to content

Commit 18f6d61

Browse files
alexfreskaalexfreska
committed
refactor: dataset and datastate
1 parent c7ac767 commit 18f6d61

File tree

91 files changed

+1059
-565
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

91 files changed

+1059
-565
lines changed

‎.changeset/cold-keys-wash.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'@siafoundation/renterd-types': patch
3+
---
4+
5+
Host and contract responses are now Nullable rather than Maybe, since empty responses return null.

‎.changeset/cuddly-balloons-raise.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
---
2+
'hostd': patch
3+
'renterd': patch
4+
'walletd': patch
5+
---
6+
7+
Fixed a bug where the transaction list would show pending transactions when viewing pages other than the first page.

‎.changeset/fluffy-owls-tan.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'renterd': patch
3+
---
4+
5+
Fixed a bug where pagination did now work on the file uploads list.

‎.changeset/fluffy-snails-hope.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'@siafoundation/react-core': minor
3+
---
4+
5+
Added maybeFromNullishArrayResponse for casting null empty array responses to [].

‎.changeset/hip-years-sin.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'@siafoundation/design-system': minor
3+
---
4+
5+
Refactored useDatasetState to include a noneOnPage state, a renamed loaded state, and a more explicit API.

‎.changeset/nice-maps-dress.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'@siafoundation/design-system': minor
3+
---
4+
5+
PaginationMarker now takes an explicit nextMarker and also an optional marker. If the current marker is not passed at all, previous page navigation is always enabled.

‎.changeset/old-planes-happen.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'renterd': patch
3+
---
4+
5+
Fixed a bug where pagination did not work on the file explorer.

‎.changeset/slow-tools-cheat.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'@siafoundation/design-system': minor
3+
---
4+
5+
Added EmptyState component for handling all dataset empty states with custom or default components.

‎.changeset/spotty-fans-shave.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
---
2+
'hostd': minor
3+
'renterd': minor
4+
'walletd': minor
5+
---
6+
7+
Data tables now show an empty state when viewing a page greater than the first page with no data.

‎apps/hostd-e2e/src/specs/contracts.spec.ts

Lines changed: 19 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,11 @@
11
import { test, expect } from '@playwright/test'
22
import { navigateToContracts } from '../fixtures/navigate'
33
import { afterTest, beforeTest } from '../fixtures/beforeTest'
4-
import { getContractRows, getContractRowsAll } from '../fixtures/contracts'
4+
import {
5+
getContractRowByIndex,
6+
getContractRows,
7+
getContractRowsAll,
8+
} from '../fixtures/contracts'
59

610
test.beforeEach(async ({ page }) => {
711
await beforeTest(page, {
@@ -35,3 +39,17 @@ test('new contracts do not show a renewed from or to contract', async ({
3539
await expect(getContractRows(page).getByTestId('renewedFrom')).toBeHidden()
3640
await expect(getContractRows(page).getByTestId('renewedTo')).toBeHidden()
3741
})
42+
43+
test('viewing a page with no data shows the correct empty state', async ({
44+
page,
45+
}) => {
46+
await page.goto('/contracts?offset=100')
47+
// Check that the empty state is correct.
48+
await expect(
49+
page.getByText('No data on this page, reset pagination to continue.')
50+
).toBeVisible()
51+
await expect(page.getByText('Back to first page')).toBeVisible()
52+
await page.getByText('Back to first page').click()
53+
// Ensure we are now seeing rows of data.
54+
await getContractRowByIndex(page, 0, true)
55+
})

‎apps/hostd/components/Contracts/ContractsFiltersBar.tsx

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,17 +3,16 @@ import { useContracts } from '../../contexts/contracts'
33
import { ContractsFilterMenu } from './ContractsFilterMenu'
44

55
export function ContractsFiltersBar() {
6-
const { offset, limit, totalCount, pageCount, dataState } = useContracts()
6+
const { offset, limit, datasetFilteredTotal, datasetState } = useContracts()
77

88
return (
99
<div className="flex gap-2 justify-between w-full">
1010
<ContractsFilterMenu />
1111
<PaginatorKnownTotal
1212
offset={offset}
1313
limit={limit}
14-
isLoading={dataState === 'loading'}
15-
datasetTotal={totalCount}
16-
pageTotal={pageCount}
14+
isLoading={datasetState === 'loading'}
15+
total={datasetFilteredTotal}
1716
/>
1817
</div>
1918
)

‎apps/hostd/components/Contracts/index.tsx

Lines changed: 9 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Table } from '@siafoundation/design-system'
1+
import { EmptyState, Table } from '@siafoundation/design-system'
22
import { useContracts } from '../../contexts/contracts'
33
import { StateNoneMatching } from './StateNoneMatching'
44
import { StateNoneYet } from './StateNoneYet'
@@ -13,7 +13,7 @@ export function Contracts() {
1313
sortableColumns,
1414
toggleSort,
1515
limit,
16-
dataState,
16+
datasetState,
1717
cellContext,
1818
} = useContracts()
1919

@@ -22,15 +22,14 @@ export function Contracts() {
2222
<Table
2323
testId="contractsTable"
2424
context={cellContext}
25-
isLoading={dataState === 'loading'}
25+
isLoading={datasetState === 'loading'}
2626
emptyState={
27-
dataState === 'noneMatchingFilters' ? (
28-
<StateNoneMatching />
29-
) : dataState === 'noneYet' ? (
30-
<StateNoneYet />
31-
) : dataState === 'error' ? (
32-
<StateError />
33-
) : null
27+
<EmptyState
28+
datasetState={datasetState}
29+
noneMatching={<StateNoneMatching />}
30+
noneYet={<StateNoneYet />}
31+
error={<StateError />}
32+
/>
3433
}
3534
pageSize={limit}
3635
data={datasetPage}

‎apps/hostd/components/Volumes/Layout.tsx

Lines changed: 3 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,18 @@
1-
import { Button, Text, Separator } from '@siafoundation/design-system'
1+
import { Button } from '@siafoundation/design-system'
22
import { Add20 } from '@siafoundation/react-icons'
3-
import { humanBytes } from '@siafoundation/units'
43
import {
54
HostdAuthedLayout,
65
HostdAuthedPageLayoutProps,
76
} from '../HostdAuthedLayout'
87
import { useDialog } from '../../contexts/dialog'
98
import { HostdSidenav } from '../HostdSidenav'
109
import { routes } from '../../config/routes'
11-
import { useVolumes } from '../../contexts/volumes'
1210
import { VolumesViewDropdownMenu } from './VolumesViewDropdownMenu'
11+
import { VolumesFiltersBar } from './VolumesFiltersBar'
1312

1413
export const Layout = HostdAuthedLayout
1514
export function useLayoutProps(): HostdAuthedPageLayoutProps {
1615
const { openDialog } = useDialog()
17-
18-
const { dataset } = useVolumes()
19-
20-
const total = dataset?.reduce((acc, i) => acc + i.totalBytes, 0)
21-
const used = dataset?.reduce((acc, i) => acc + i.usedBytes, 0)
22-
const free = total - used
2316
return {
2417
title: 'Volumes',
2518
routes,
@@ -34,20 +27,6 @@ export function useLayoutProps(): HostdAuthedPageLayoutProps {
3427
<VolumesViewDropdownMenu />
3528
</>
3629
),
37-
stats: (
38-
<div className="flex gap-4">
39-
<Text size="12" font="mono" weight="medium">{`${humanBytes(
40-
used
41-
)} used`}</Text>
42-
<Separator variant="vertical" />
43-
<Text size="12" font="mono" weight="medium">{`${humanBytes(
44-
free
45-
)} free`}</Text>
46-
<Separator variant="vertical" />
47-
<Text size="12" font="mono" weight="medium">{`${humanBytes(
48-
total
49-
)} total`}</Text>
50-
</div>
51-
),
30+
stats: <VolumesFiltersBar />,
5231
}
5332
}

‎apps/hostd/components/Volumes/VolumesFiltersBar.tsx

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
import { PaginatorKnownTotal } from '@siafoundation/design-system'
2+
import { Text, Separator } from '@siafoundation/design-system'
3+
import { humanBytes } from '@siafoundation/units'
4+
import { useVolumes } from '../../contexts/volumes'
5+
6+
export function VolumesFiltersBar() {
7+
const { dataset, datasetState, datasetFilteredTotal, offset, limit } =
8+
useVolumes()
9+
10+
const total = dataset?.reduce((acc, i) => acc + i.totalBytes, 0)
11+
const used = dataset?.reduce((acc, i) => acc + i.usedBytes, 0)
12+
const free = total - used
13+
14+
return (
15+
<div className="flex gap-2 justify-between w-full">
16+
<div className="flex gap-4">
17+
<Text size="12" font="mono" weight="medium">{`${humanBytes(
18+
used
19+
)} used`}</Text>
20+
<Separator variant="vertical" />
21+
<Text size="12" font="mono" weight="medium">{`${humanBytes(
22+
free
23+
)} free`}</Text>
24+
<Separator variant="vertical" />
25+
<Text size="12" font="mono" weight="medium">{`${humanBytes(
26+
total
27+
)} total`}</Text>
28+
</div>
29+
<PaginatorKnownTotal
30+
offset={offset}
31+
limit={limit}
32+
isLoading={datasetState === 'loading'}
33+
total={datasetFilteredTotal}
34+
/>
35+
</div>
36+
)
37+
}

‎apps/hostd/components/Volumes/index.tsx

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
import { Table } from '@siafoundation/design-system'
1+
import { EmptyState, Table } from '@siafoundation/design-system'
22
import { useVolumes } from '../../contexts/volumes'
33
import { StateNoneYet } from './StateNoneYet'
44

55
export function Volumes() {
6-
const { dataset, isLoading, columns } = useVolumes()
6+
const { dataset, datasetState, isLoading, columns } = useVolumes()
77
return (
88
<div className="p-6 min-w-fit">
99
<Table
@@ -12,7 +12,9 @@ export function Volumes() {
1212
pageSize={20}
1313
data={dataset}
1414
columns={columns}
15-
emptyState={<StateNoneYet />}
15+
emptyState={
16+
<EmptyState datasetState={datasetState} noneYet={<StateNoneYet />} />
17+
}
1618
/>
1719
</div>
1820
)

‎apps/hostd/components/Wallet/WalletFilterBar.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import { useTransactions } from '../../contexts/transactions'
88
export function WalletFilterBar() {
99
const { isSynced, syncPercent, isWalletSynced, walletScanPercent } =
1010
useSyncStatus()
11-
const { offset, limit, pageCount, dataState } = useTransactions()
11+
const { offset, limit, datasetPageTotal, datasetState } = useTransactions()
1212
return (
1313
<div className="flex gap-2 w-full">
1414
<WalletSyncWarning
@@ -21,8 +21,8 @@ export function WalletFilterBar() {
2121
<PaginatorUnknownTotal
2222
offset={offset}
2323
limit={limit}
24-
pageTotal={pageCount}
25-
isLoading={dataState === 'loading'}
24+
pageTotal={datasetPageTotal}
25+
isLoading={datasetState === 'loading'}
2626
/>
2727
</div>
2828
)

‎apps/hostd/components/Wallet/index.tsx

Lines changed: 15 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,8 @@
1-
import { BalanceEvolution, Table } from '@siafoundation/design-system'
1+
import {
2+
BalanceEvolution,
3+
EmptyState,
4+
Table,
5+
} from '@siafoundation/design-system'
26
import { useTransactions } from '../../contexts/transactions'
37
import { StateNoneMatching } from './StateNoneMatching'
48
import { StateNoneYet } from './StateNoneYet'
@@ -8,8 +12,8 @@ export function Wallet() {
812
const {
913
balances,
1014
metrics,
11-
dataset,
12-
dataState,
15+
datasetPage,
16+
datasetState,
1317
columns,
1418
cellContext,
1519
sortableColumns,
@@ -29,18 +33,17 @@ export function Wallet() {
2933
) : null}
3034
<Table
3135
testId="eventsTable"
32-
isLoading={dataState === 'loading'}
36+
isLoading={datasetState === 'loading'}
3337
emptyState={
34-
dataState === 'noneMatchingFilters' ? (
35-
<StateNoneMatching />
36-
) : dataState === 'noneYet' ? (
37-
<StateNoneYet />
38-
) : dataState === 'error' ? (
39-
<StateError />
40-
) : null
38+
<EmptyState
39+
datasetState={datasetState}
40+
noneMatching={<StateNoneMatching />}
41+
noneYet={<StateNoneYet />}
42+
error={<StateError />}
43+
/>
4144
}
4245
pageSize={defaultPageSize}
43-
data={dataset}
46+
data={datasetPage}
4447
context={cellContext}
4548
columns={columns}
4649
sortableColumns={sortableColumns}

0 commit comments

Comments
 (0)