feat(renterd): refactor

.changeset/cold-keys-wash.md

@@ -0,0 +1,5 @@
+---
+'@siafoundation/renterd-types': patch
+---
+
+Host and contract responses are now Nullable rather than Maybe, since empty responses return null.

.changeset/cuddly-balloons-raise.md

@@ -0,0 +1,7 @@
+---
+'hostd': patch
+'renterd': patch
+'walletd': patch
+---
+
+Fixed a bug where the transaction list would show pending transactions when viewing pages other than the first page.

.changeset/fluffy-snails-hope.md

@@ -0,0 +1,5 @@
+---
+'@siafoundation/react-core': minor
+---
+
+Added maybeFromNullishArrayResponse for casting null empty array responses to [].

.changeset/hip-years-sin.md

@@ -0,0 +1,5 @@
+---
+'@siafoundation/design-system': minor
+---
+
+Refactored useDatasetState to include a noneOnPage state, a renamed loaded state, and a more explicit API.

.changeset/nice-maps-dress.md

@@ -0,0 +1,5 @@
+---
+'@siafoundation/design-system': minor
+---
+
+PaginationMarker now explicitly takes a nextMarker and does not disable down navigation.

.changeset/old-planes-happen.md

@@ -0,0 +1,5 @@
+---
+'renterd': patch
+---
+
+Fixed a bug where pagination did now work on the file explorer all files mode.

.changeset/slow-tools-cheat.md

@@ -0,0 +1,5 @@
+---
+'@siafoundation/design-system': minor
+---
+
+Added EmptyState component for handling all dataset empty states with custom or default components.

.changeset/spotty-fans-shave.md

@@ -0,0 +1,7 @@
+---
+'hostd': minor
+'renterd': minor
+'walletd': minor
+---
+
+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

@@ -1,7 +1,12 @@
 import { test, expect } from '@playwright/test'
 import { navigateToContracts } from '../fixtures/navigate'
 import { afterTest, beforeTest } from '../fixtures/beforeTest'
-import { getContractRows, getContractRowsAll } from '../fixtures/contracts'
+import {
+  getContractRowById,
+  getContractRowByIndex,
+  getContractRows,
+  getContractRowsAll,
+} from '../fixtures/contracts'
 
 test.beforeEach(async ({ page }) => {
   await beforeTest(page, {
@@ -35,3 +40,17 @@ test('new contracts do not show a renewed from or to contract', async ({
   await expect(getContractRows(page).getByTestId('renewedFrom')).toBeHidden()
   await expect(getContractRows(page).getByTestId('renewedTo')).toBeHidden()
 })
+
+test('viewing a page with no data shows the correct empty state', async ({
+  page,
+}) => {
+  await page.goto('/contracts?offset=100')
+  // Check that the empty state is correct.
+  await expect(
+    page.getByText('No data on this page, reset pagination to continue.')
+  ).toBeVisible()
+  await expect(page.getByText('Back to first page')).toBeVisible()
+  await page.getByText('Back to first page').click()
+  // Ensure we are now seeing rows of data.
+  await getContractRowByIndex(page, 0, true)
+})

apps/renterd/components/Wallet/WalletFilterBar.tsx

@@ -9,7 +9,6 @@ export function WalletFilterBar() {
   const { isSynced, syncPercent, isWalletSynced, walletScanPercent } =
     useSyncStatus()
   const { offset, limit, pageCount, datasetState } = useTransactions()
-  console.log(pageCount)
   return (
     <div className="flex gap-2 w-full">
       <WalletSyncWarning

apps/walletd/components/Wallet/index.tsx

@@ -6,7 +6,7 @@ import { StateError } from './StateError'
 
 export function Wallet() {
   const {
-    dataset,
+    datasetPage,
     datasetState,
     columns,
     cellContext,
@@ -30,7 +30,7 @@ export function Wallet() {
           />
         }
         pageSize={6}
-        data={dataset}
+        data={datasetPage}
         context={cellContext}
         columns={columns}
         sortableColumns={sortableColumns}

apps/walletd/components/WalletsList/WalletsFiltersBar.tsx

@@ -4,7 +4,7 @@ import { useWallets } from '../../contexts/wallets'
 import { pluralize } from '@siafoundation/units'
 
 export function WalletsFiltersBar() {
-  const { pageCount: datasetCount, unlockedCount } = useWallets()
+  const { datasetCount, unlockedCount } = useWallets()
 
   return (
     <div className="flex gap-2 w-full">

apps/walletd/contexts/events/index.tsx

@@ -172,7 +172,7 @@ export function useEventsMain() {
     error: responseEvents.error,
     pageCount: datasetPage?.length || 0,
     columns: filteredTableColumns,
-    dataset: datasetPage,
+    datasetPage,
     cellContext,
     configurableColumns,
     enabledColumns,

apps/walletd/contexts/wallets/index.tsx

@@ -52,7 +52,7 @@ function useWalletsMain() {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [])
 
-  const dataset = useMemo<Maybe<WalletData[]>>(() => {
+  const _dataset = useMemo<Maybe<WalletData[]>>(() => {
     if (!response.data) {
       return undefined
     }
@@ -102,7 +102,7 @@ function useWalletsMain() {
     cacheWalletMnemonic,
   ])
 
-  const wallet = dataset?.find((w) => w.id === (router.query.id as string))
+  const wallet = _dataset?.find((w) => w.id === (router.query.id as string))
 
   const { filters, setFilter, removeFilter, removeLastFilter, resetFilters } =
     useClientFilters<WalletData>()
@@ -127,8 +127,8 @@ function useWalletsMain() {
     defaultSortField,
   })
 
-  const datasetPage = useClientFilteredDataset({
-    dataset,
+  const dataset = useClientFilteredDataset({
+    dataset: _dataset,
     filters,
     sortField,
     sortDirection,
@@ -143,7 +143,7 @@ function useWalletsMain() {
   )
 
   const datasetState = useDatasetState({
-    datasetPage,
+    datasetPage: dataset,
     isValidating: response.isValidating,
     error: response.error,
     filters,
@@ -160,10 +160,10 @@ function useWalletsMain() {
   return {
     datasetState,
     error: response.error,
-    pageCount: datasetPage?.length || 0,
+    datasetCount: dataset?.length || 0,
     unlockedCount: cachedMnemonicCount,
     columns: filteredTableColumns,
-    datasetPage,
+    dataset,
     context,
     wallet,
     configurableColumns,

libs/design-system/src/components/EmptyState/StateError.tsx

@@ -1,4 +1,4 @@
-import { Text } from '@siafoundation/design-system'
+import { Text } from '../../core/Text'
 import { MisuseOutline32 } from '@siafoundation/react-icons'
 import { SWRError } from '@siafoundation/react-core'
 

libs/design-system/src/components/EmptyState/StateNoData.tsx

@@ -1,4 +1,4 @@
-import { Text } from '@siafoundation/design-system'
+import { Text } from '../../core/Text'
 import { ChartArea32 } from '@siafoundation/react-icons'
 
 export function StateNoData() {

libs/design-system/src/components/EmptyState/StateNoneMatching.tsx

@@ -1,4 +1,4 @@
-import { Text } from '@siafoundation/design-system'
+import { Text } from '../../core/Text'
 import { Filter32 } from '@siafoundation/react-icons'
 
 export function StateNoneMatching() {

libs/design-system/src/components/EmptyState/StateNoneOnPage.tsx

@@ -1,4 +1,5 @@
-import { Button, Text } from '@siafoundation/design-system'
+import { Button } from '../../core/Button'
+import { Text } from '../../core/Text'
 import { usePagesRouter } from '@siafoundation/next'
 import { Reset32 } from '@siafoundation/react-icons'
 import { useCallback } from 'react'

libs/design-system/src/components/EmptyState/StateNoneYet.tsx

@@ -1,4 +1,4 @@
-import { Text } from '@siafoundation/design-system'
+import { Text } from '../../core/Text'
 import { DataBase32 } from '@siafoundation/react-icons'
 
 export function StateNoneYet() {

libs/design-system/src/components/EmptyState/index.tsx

@@ -1,9 +1,9 @@
-import { DatasetState } from '@siafoundation/design-system'
 import { StateNoneMatching } from './StateNoneMatching'
 import { StateNoneYet } from './StateNoneYet'
 import { StateError } from './StateError'
 import { StateNoneOnPage } from './StateNoneOnPage'
 import React from 'react'
+import { DatasetState } from '../../hooks/useDatasetState'
 
 export function EmptyState({
   datasetState,

libs/design-system/src/components/PaginatorMarker.tsx

@@ -60,17 +60,14 @@ export function PaginatorMarker({
         size="small"
         variant="gray"
         className="rounded-none"
-        onClick={() => {
-          console.log('xxx', {
-            marker: nextMarker,
-          })
+        onClick={() =>
           router.push({
             query: {
               ...router.query,
               marker: nextMarker,
             },
           })
-        }}
+        }
       >
         <CaretRight16 />
       </Button>