Skip to main content

​
Overview

The Bill Dashboard is all you need to provide full bill pay to your users, with a full user experience allowing your users to:
  • Pay bills, including:
    • Choosing payment mechanism (e.g. ACH, Credit Card, Check)
    • Scheduling future payment dates
    • Set recurring payments
  • Have bills automatically reconciled against bank deposits
  • See payment status of bills
  • Generate Aged AP reporting

​
Embedding the Bill Dashboard

To initialize the Tight Embedded experience in your React project, follow the instructions on Embedding Tight’s white-labeled UI. Below is an example embedding of the Bill Dashboard:
BillDashboard.tsx
import { BillDashboard, Tight } from "@tight-embedded/react";
import "@tight-embedded/react/index.css";

function BillDash({ accessToken }) {
    return (
      <Tight environment="SANDBOX" accessToken={accessToken} >
        <BillDashboard />
      </Tight>
    )
}

​
Props

​
filters
object
optional
The set of filters to apply to the dashboard.Passing in a value for this prop turns this into a controlled component. As such, you must also pass the onChangeFilters prop to adjust the filters for user input.
​
onChangeFilters
function
optional
A function that is called whenever the user changes the filters from the dashboard. This function will only be invoked if the filters prop is also provided. The callback takes filters as its single argument.
​
pageSize
number
default:25
max: 250
optional
The number of transactions to show on a single page of the Bill Dashboard.