Skip to main content

Account List

AccountList represents a list of accounts to be displayed in your UI.

List of Accounts


accountsrequired ArrayAccount[]
Array of account objects passed down to the component to be rendered.
hideIcons boolean
Set to "true" to hide icons on all accounts.
default value: false
as React.ReactNode | HTMLElement | string
HTML Element to use as wrapper for the component.
default value: ul
className string


AnchorBasic usage

import * as React from 'react'
import { gql, useQuery } from '@apollo/client'
import { AccountList } from '@quiltt/components'
const Component = () => {
const GET_ACCOUNTS = gql' \
query { \
accounts { \
name \
type \
lastFourDigits \
id \
metadata \
state \
} \
} \
const { loading, error, data } = useQuery(GET_ACCOUNTS)
if (error) throw error
if (loading || !data.accounts.length) {
return <p>Loading...</p>
const { accounts } = data
return <AccountList account={account} />
export default Component

AnchorAPI Reference


idrequired string
namerequired string
typerequired enum
lastFourDigits string
Must be a 4-digit string
state enum
options: "CLOSED", "OPEN", "PAUSED"
balancerequired ObjectLedgerBalance
transactions ArrayTransaction[]
metadata objectjson


id string
available float
current float
limit float


id string
account ObjectAccount
amount float
date string
description string
entryType enum
options: "CREDIT", "DEBIT"
status enum
metadata objectjson