diff options
Diffstat (limited to 'packages/demobank-ui/src/pages/admin/AccountList.tsx')
| -rw-r--r-- | packages/demobank-ui/src/pages/admin/AccountList.tsx | 32 |
1 files changed, 30 insertions, 2 deletions
diff --git a/packages/demobank-ui/src/pages/admin/AccountList.tsx b/packages/demobank-ui/src/pages/admin/AccountList.tsx index d8c129507..811c3e37a 100644 --- a/packages/demobank-ui/src/pages/admin/AccountList.tsx +++ b/packages/demobank-ui/src/pages/admin/AccountList.tsx @@ -62,8 +62,10 @@ export function AccountList({ } } + const onGoStart = result.isFirstPage ? undefined : result.loadFirst + const onGoNext = result.isLastPage ? undefined : result.loadNext - const { accounts } = result.data.body; + const accounts = result.result; return ( <Fragment> <div class="px-4 sm:px-6 lg:px-8 mt-4"> @@ -93,7 +95,9 @@ export function AccountList({ <div class="-mx-4 -my-2 overflow-x-auto sm:-mx-6 lg:-mx-8"> <div class="inline-block min-w-full py-2 align-middle sm:px-6 lg:px-8"> {!accounts.length ? ( - <div></div> + <div> + {/* FIXME: ADDD empty list */} + </div> ) : ( <table class="min-w-full divide-y divide-gray-300"> <thead> @@ -208,6 +212,30 @@ export function AccountList({ </table> )} </div> + <nav + class="flex items-center justify-between border-t border-gray-200 bg-white px-4 py-3 sm:px-6 rounded-lg" + aria-label="Pagination" + > + <div class="flex flex-1 justify-between sm:justify-end"> + <button + name="first page" + class="relative disabled:bg-gray-100 disabled:text-gray-500 inline-flex items-center rounded-md bg-white px-3 py-2 text-sm font-semibold text-gray-900 ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus-visible:outline-offset-0" + disabled={!onGoStart} + onClick={onGoStart} + > + <i18n.Translate>First page</i18n.Translate> + </button> + <button + name="next page" + class="relative disabled:bg-gray-100 disabled:text-gray-500 ml-3 inline-flex items-center rounded-md bg-white px-3 py-2 text-sm font-semibold text-gray-900 ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus-visible:outline-offset-0" + disabled={!onGoNext} + onClick={onGoNext} + > + <i18n.Translate>Next</i18n.Translate> + </button> + </div> + </nav> + </div> </div> </div> |