Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.tight.com/llms.txt

Use this file to discover all available pages before exploring further.

Overview

The Tight Dashboard is all you need to provide full financials to your users, including:
  • Onboarding-related action items like linking bank accounts and credit cards
  • Monthly financial summaries
  • As-needed action items whenever the business owner’s attention is needed (e.g. the purpose of a bank transaction is unknown)
  • Access to financial reporting (e.g. Profit & Loss, Balance Sheet, etc.)
Tight Dashboard Demo Mobile Tight Dashboard Demo

Embedding the Tight 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 Business Owner Dashboard:
HomeDashboard.tsx
import { BusinessOwnerDashboard, Tight } from "@tight-embedded/react";
import "@tight-embedded/react/index.css";

function HomeDashboard({ accessToken }) {
    return (
      <Tight environment="SANDBOX" accessToken={accessToken} >
        <BusinessOwnerDashboard />
      </Tight>
    )
}

Props

period
object
optional
The time of year for which to show a financial summary, in terms of month and year. If not provided, the period defaults to the current month and year, though the user may navigate between months from the dashboard.Passing in a value for this prop turns this into a controlled component. As such, you must also pass the onChangePeriod prop to set the new value in the parent component.
onChangePeriod
function
optional
A function that is called whenever the user changes the viewed financial period from the dashboard. This function will only be invoked if the period prop is also provided. The callback takes period as its single argument.