> ## 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.

# Mileage Dashboard

> Track and manage business mileage for tax deductions

## Overview

The Mileage Dashboard is all you need to provide full mileage tracking to your users, with a full user experience allowing your users to:

* Add drives, with auto-complete start and end addresses, route calculation/visualization, and reverse geocoding
* View drives/routes/addresses
* Classify drive purpose (business vs. personal)
* Define favorite locations
* Assign drives to dimensions

## Embedding the Mileage Dashboard

To initialize the Tight Embedded experience in your React project, follow the instructions on [Embedding Tight's white-labeled UI](/embeddable-ui/react/patterns/embedding).

Below is an example embedding of the Mileage Dashboard:

```TSX MileageDashboard.tsx theme={null}
import { MileageDashboard, Tight } from "@tight-embedded/react";
import "@tight-embedded/react/index.css";

function MileageDash({ accessToken }) {
    return (
      <Tight environment="SANDBOX" accessToken={accessToken} >
        <MileageDashboard />
      </Tight>
    )
}
```

## Props

<ParamField body={"filters"} type={"object"} post={["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.

  <Expandable title={"filters"}>
    <ParamField body={"category"}>
      Category filter

      <Expandable title={"child attributes"}>
        <ParamField body={"id"} type={"object"}>
          Id filter - returns all entities with the following attachments.

          <Expandable title={"child attributes"}>
            <ParamField body={"in"} type={"string[]"}>
              List of values to include.
            </ParamField>
          </Expandable>
        </ParamField>
      </Expandable>
    </ParamField>

    <ParamField body={"dimensionValues"}>
      Dimension value filter

      <Expandable title={"child attributes"}>
        <ParamField body={"id"} type={"object"}>
          Id filter - returns all entities with the following attachments.

          <Expandable title={"child attributes"}>
            <ParamField body={"in"} type={"string[]"}>
              List of values to include.
            </ParamField>
          </Expandable>
        </ParamField>
      </Expandable>
    </ParamField>

    <ParamField body={"date"}>
      <Expandable title={"child attributes"}>
        <ParamField body={"equal"} type={"string"}>
          Value - returns all records with specified field equal to this value.
        </ParamField>

        <ParamField body={"notEqual"} type={"string"}>
          Value - returns all records with specified field not equal to this value.
        </ParamField>

        <ParamField body={"greaterThan"} type={"string"}>
          Value - returns all records with specified field greater than to this value.
        </ParamField>

        <ParamField body={"greaterThanEqual"} type={"string"}>
          Value - returns all records with specified field greater than or equal to this value.
        </ParamField>

        <ParamField body={"lessThan"} type={"string"}>
          Value - returns all records with specified field less than to this value.
        </ParamField>

        <ParamField body={"lessThanEqual"} type={"string"}>
          Value - returns all records with specified field less than or equal to this value.
        </ParamField>
      </Expandable>
    </ParamField>

    <ParamField body={"reviewStatus"}>
      Review status filter

      <Expandable title={"child attributes"}>
        <ParamField body={"in"} type={"string[]"}>
          List of values to include.

          Available options: `RECONCILIATION_DISCREPANCY`, `USER_REVIEW_REQUIRED`, `ACCOUNTANT_REVIEW_REQUIRED`,
          `PARTNER_REVIEW_REQUIRED`, `AWAITING_MATCH`, `STAGED`, `RECONCILED`
        </ParamField>

        <ParamField body={"notIn"} type={"string[]"}>
          List of values to exclude.

          Available options: `RECONCILIATION_DISCREPANCY`,
          `USER_REVIEW_REQUIRED`,
          `ACCOUNTANT_REVIEW_REQUIRED`,
          `PARTNER_REVIEW_REQUIRED`,
          `AWAITING_MATCH`,
          `STAGED`,
          `RECONCILED`
        </ParamField>
      </Expandable>
    </ParamField>

    <ParamField body={"type"}>
      The type of drive to filter by

      <Expandable title={"child attributes"}>
        <ParamField body={"in"} type={"string[]"}>
          List of values to include.

          Available options: `BUSINESS`,
          `PERSONAL`,
        </ParamField>

        <ParamField body={"notIn"} type={"string[]"}>
          List of values to exclude.

          Available options: `BUSINESS`,
          `PERSONAL`,
        </ParamField>
      </Expandable>
    </ParamField>
  </Expandable>
</ParamField>

<ParamField body={"onChangeFilters"} type={"function"} post={["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.
</ParamField>

<ParamField body={"pageSize"} type={"number"} default={25} post={["max: 250", "optional"]}>
  The number of transactions to show on a single page of the dashboard.
</ParamField>