> ## Documentation Index
> Fetch the complete documentation index at: https://docs.layerfi.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Solopreneur Overview

> Solopreneur Overview Page.

This view provides an out of the box overview dashboard tailored to solopreneurs.
It leads with cash flow: the summary tiles at the top default to the cashflow reporting variant (money in, money out, and net cash flow), each with a categorized vs. uncategorized breakdown.

The page consists of an onboarding banner (prompting the user to link bank accounts and set up their tax profile), the cashflow summary tiles, and a grid of summary cards for profit & loss, expenses, tax estimates, and mileage tracking.

<img src="https://mintcdn.com/layerfinancialtechnologiesinc/AL47DXJh6sGqDpvZ/images/solopreneur-overview.png?fit=max&auto=format&n=AL47DXJh6sGqDpvZ&q=85&s=8c04d8059719f8b5bcd83e06c9f6aee0" alt="Solopreneur Overview" width="2560" height="2336" data-path="images/solopreneur-overview.png" />

```tsx theme={null}
import { SolopreneurOverview } from '@layerfi/components'

<SolopreneurOverview
    interactionProps={{
        banner: {
            onSetupTaxProfile: () => navigate('../tax-profile'),
        },
        cashflowSummaries: {
            onTransactionsToReviewClick: () => navigate('../bank-transactions'),
        },
    }}
/>
```

### Properties

<ParamField body="chartColorsList" type="string[]">
  List of colors to use for the expenses breakdown chart. Specified in hex strings, i.e. `['#FF0000', '#00FF00', '#0000FF']`.
</ParamField>

<ParamField body="stringOverrides" type="SolopreneurOverviewStringOverrides">
  Customize text and labels throughout the page.

  <Expandable title="SolopreneurOverviewStringOverrides properties">
    <ParamField body="title" type="string">
      Override the page title. Defaults to `'Overview'`.
    </ParamField>

    <ParamField body="profitAndLossSummaries" type="ProfitAndLossSummariesStringOverrides">
      Labels for the summary tiles at the top of the page.

      <Expandable title="ProfitAndLossSummariesStringOverrides properties">
        <ParamField body="revenueLabel" type="string">
          Label for the revenue summary tile.
        </ParamField>

        <ParamField body="expensesLabel" type="string">
          Label for the expenses summary tile.
        </ParamField>

        <ParamField body="netProfitLabel" type="string">
          Label for the net profit summary tile.
        </ParamField>

        <ParamField body="moneyInLabel" type="string">
          Label for the money in summary tile when using the cashflow reporting variant. Defaults to `'Money in'`.
        </ParamField>

        <ParamField body="moneyOutLabel" type="string">
          Label for the money out summary tile when using the cashflow reporting variant. Defaults to `'Money out'`.
        </ParamField>

        <ParamField body="netCashFlowLabel" type="string">
          Label for the net cash flow summary tile when using the cashflow reporting variant. Defaults to `'Net cash flow'`.
        </ParamField>
      </Expandable>
    </ParamField>

    <ParamField body="summaryCards" type="object">
      Titles for the summary cards in the grid below the summary tiles.

      <Expandable title="summaryCards properties">
        <ParamField body="profitAndLoss" type="SummaryCardStringOverrides">
          <Expandable title="SummaryCardStringOverrides properties">
            <ParamField body="title" type="string">
              Override the title of the profit & loss summary card.
            </ParamField>
          </Expandable>
        </ParamField>

        <ParamField body="expenses" type="SummaryCardStringOverrides">
          <Expandable title="SummaryCardStringOverrides properties">
            <ParamField body="title" type="string">
              Override the title of the expenses summary card.
            </ParamField>
          </Expandable>
        </ParamField>

        <ParamField body="taxEstimates" type="SummaryCardStringOverrides">
          <Expandable title="SummaryCardStringOverrides properties">
            <ParamField body="title" type="string">
              Override the title of the tax estimates summary card.
            </ParamField>
          </Expandable>
        </ParamField>

        <ParamField body="mileageTracking" type="SummaryCardStringOverrides">
          <Expandable title="SummaryCardStringOverrides properties">
            <ParamField body="title" type="string">
              Override the title of the mileage tracking summary card.
            </ParamField>
          </Expandable>
        </ParamField>
      </Expandable>
    </ParamField>
  </Expandable>
</ParamField>

<ParamField body="interactionProps" type="SolopreneurOverviewInteractionProps">
  Callbacks invoked when the user interacts with elements of the page.

  <Expandable title="SolopreneurOverviewInteractionProps properties">
    <ParamField body="banner" type="object">
      <Expandable title="banner properties">
        <ParamField body="onSetupTaxProfile" type="() => void">
          A function which navigates to the tax profile setup page of your app. This will be triggered when clicking the "Set up your tax profile" button on the onboarding banner. If omitted, the button is not shown.
        </ParamField>
      </Expandable>
    </ParamField>

    <ParamField body="cashflowSummaries" type="object">
      <Expandable title="cashflowSummaries properties">
        <ParamField body="onTransactionsToReviewClick" type="() => void">
          A function which navigates to the bank transactions to review page of your app. This will be triggered when clicking on the transactions-to-review CTA in the summary tiles.
        </ParamField>
      </Expandable>
    </ParamField>

    <ParamField body="summaryCards" type="object">
      Interaction callbacks for the summary cards in the grid. Each card accepts the same shape.

      <Expandable title="summaryCards properties">
        <ParamField body="profitAndLoss" type="SummaryCardInteractionProps">
          <Expandable title="SummaryCardInteractionProps properties">
            <ParamField body="onClickExpand" type="() => void">
              Called when the user clicks the expand button on the profit & loss summary card. The expand button is only rendered when this callback is provided.
            </ParamField>
          </Expandable>
        </ParamField>

        <ParamField body="expenses" type="SummaryCardInteractionProps">
          <Expandable title="SummaryCardInteractionProps properties">
            <ParamField body="onClickExpand" type="() => void">
              Called when the user clicks the expand button on the expenses summary card. The expand button is only rendered when this callback is provided.
            </ParamField>
          </Expandable>
        </ParamField>

        <ParamField body="taxEstimates" type="SummaryCardInteractionProps">
          <Expandable title="SummaryCardInteractionProps properties">
            <ParamField body="onClickExpand" type="() => void">
              Called when the user clicks the expand button on the tax estimates summary card. The expand button is only rendered when this callback is provided.
            </ParamField>
          </Expandable>
        </ParamField>

        <ParamField body="mileageTracking" type="SummaryCardInteractionProps">
          <Expandable title="SummaryCardInteractionProps properties">
            <ParamField body="onClickExpand" type="() => void">
              Called when the user clicks the expand button on the mileage tracking summary card. The expand button is only rendered when this callback is provided.
            </ParamField>
          </Expandable>
        </ParamField>
      </Expandable>
    </ParamField>
  </Expandable>
</ParamField>

<ParamField body="slotProps" type="object">
  Configuration passed through to components within the page layout.

  <Expandable title="slotProps properties">
    <ParamField body="profitAndLoss" type="object">
      <Expandable title="profitAndLoss properties">
        <ParamField body="summaries" type="ProfitAndLossSummariesSlotProps">
          Configuration for the summary tiles at the top of the page.

          <Expandable title="ProfitAndLossSummariesSlotProps properties">
            <ParamField body="reportingVariant" type="ProfitAndLossSummariesReportingVariant">
              Controls which reporting mode the summary tiles display. On this page, defaults to cashflow.

              <Expandable title="ProfitAndLossSummariesReportingVariant properties">
                <ParamField body="type" type="'profitAndLoss' | 'cashflow'" default="cashflow">
                  With `'cashflow'` (the default on this page), the tiles show money in, money out, and net cash flow.
                  With `'profitAndLoss'`, the tiles show revenue, expenses, and net profit.
                </ParamField>

                <ParamField body="showProfitAndLossBreakdown" type="boolean" default="true">
                  Only applies when `type` is `'cashflow'`. Controls whether the money in and money out
                  tiles include a categorized vs. uncategorized breakdown footer.
                </ParamField>
              </Expandable>
            </ParamField>
          </Expandable>
        </ParamField>
      </Expandable>
    </ParamField>
  </Expandable>
</ParamField>

<ParamField body="plaidHostedLinkConfig" type="PlaidHostedLinkConfig">
  Configuration for using Plaid Hosted Link instead of the embedded Plaid modal when linking bank accounts from the onboarding banner. When provided, account linking opens a Plaid-owned page in the browser rather than displaying an embedded modal.

  <Expandable title="PlaidHostedLinkConfig properties">
    <ParamField body="isMobileApp" type="boolean">
      Set to `true` when the user will open the hosted link in an `ASWebAuthenticationSession` (iOS) or Android Custom Tab. This tells Plaid to use the correct redirect handling for mobile contexts.
    </ParamField>

    <ParamField body="redirectUri" type="string">
      Universal Link (iOS) or App Link (Android) that opens your app. Used when Plaid redirects from a third-party OAuth app (e.g., a bank's app) back to your app during app-to-app authentication.
    </ParamField>

    <ParamField body="completionRedirectUri" type="string">
      URI to redirect to after the user completes the Plaid hosted link flow (e.g., `myapp://plaid-complete`). Recommended for mobile apps to automatically close the hosted link session and return to your app. If not provided, the user sees a "Return to app" message and must navigate back manually.
    </ParamField>

    <ParamField body="navigateToHostedLink" type="(hostedLinkUrl: string) => void | Promise<void>" required>
      Callback function that navigates the user to the Plaid Hosted Link URL. This function receives the Plaid-owned URL and should open it in the device's browser or an in-app browser. Required for all hosted link configurations.
    </ParamField>
  </Expandable>
</ParamField>
