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

# Payment methods and invoices

> Add or replace the card on file, find past invoices, and open the hosted billing portal.

export const UiPath = ({children}) => {
  const parts = String(children).split(/\s*(?:→|>)\s*/).filter(Boolean);
  return <span className="pl-path">
      {parts.map((part, index) => <span key={`${index}-${part}`}>
          {index > 0 && <span className="pl-path__sep">→</span>}
          {part}
        </span>)}
    </span>;
};

export const Screenshot = ({id, alt, caption, frame = 'browser', url, marks = [], lang = 'en', workspace = 'northwind-outbound'}) => {
  const src = `/images/screenshots/${lang}/${id}.png`;
  const chrome = url ? `app.pipelime.ai/${workspace}${url}` : 'app.pipelime.ai';
  return <figure className={`pl-shot pl-shot--${frame} not-prose`}>
      <div className="pl-shot__frame">
        {frame !== 'bare' && <div className="pl-shot__bar">
            <span className="pl-shot__dots">
              <span className="pl-shot__dot" />
              <span className="pl-shot__dot" />
              <span className="pl-shot__dot" />
            </span>
            <span className="pl-shot__url">{chrome}</span>
          </div>}
        <div className="pl-shot__media">
          <img src={src} alt={alt} loading="lazy" />
          {marks.map(mark => <span key={mark.n} className="pl-shot__mark" style={{
    left: `${mark.x}%`,
    top: `${mark.y}%`
  }} aria-hidden="true">
              {mark.n}
            </span>)}
        </div>
      </div>
      {caption && <figcaption className="pl-shot__caption">{caption}</figcaption>}
    </figure>;
};

By the end of this page you can find the card on file, add or replace it, get to any past invoice, and open the hosted billing portal for anything else.

<div className="pl-availability">
  <div className="pl-availability__row">
    <div className="pl-availability__label">Where</div>
    <div className="pl-availability__value"><span className="pl-path">Your avatar<span className="pl-path__sep">→</span>Billing</span></div>
  </div>

  <div className="pl-availability__row">
    <div className="pl-availability__label">Partner-branded workspaces</div>
    <div className="pl-availability__value">Not shown in partner-branded workspaces.</div>
  </div>
</div>

## Before you begin

* The card and the invoice list are your own account's, whichever workspace is active. **Manage billing** is the exception: it opens the billing portal for the account that owns the workspace you are in, so in a workspace you do not own it is that owner's portal, not yours.
* Adding or replacing a card needs a subscription on your account. Without one the header offers **Subscribe** instead, and the card form cannot be opened at all: see [Change plan, add-ons or cancel](/en/billing/change-plan-or-cancel) to start a plan first.

## Steps

<Steps>
  <Step title="Open the Billing page">
    Choose <UiPath>Your avatar → Billing</UiPath>. The **Payment method** panel's header (1)
    always carries **Manage billing**, plus one more action that depends on whether your
    account has a subscription. The **Invoices** table (2) below it lists your own invoices,
    however many workspaces you belong to.

    <Screenshot id="billing/payment-methods-and-invoices--billing" url="/user/billing" alt="The Billing page with no card on file and Subscribe as the header action, a Total paid, Invoices and Last payment stat row, and an Invoices table listing three paid invoices with reference, status, date, amount and receipt columns" caption="A representative example: invoices come straight from Stripe, so this list is captured against a simulated response. The panel above it is real. The header reads Subscribe, not Add card, because this account has no subscription." marks={[{ n: 1, x: 82, y: 11 }, { n: 2, x: 50, y: 80 }]} />
  </Step>

  <Step title="Add or replace the card on file">
    With a subscription on the account, the header carries **Add card**, or **Update card**
    once one is already saved, in place of **Subscribe**. Choose it to open a card form
    inline, fill it in, and choose **Save**. While no card is saved, the empty card panel
    offers that same **Add card** button. Choose **Cancel** to close the form without saving.

    A "Payment method updated" toast confirms it. The card face then shows the last four
    digits with a **Default** badge, and beside it a **Card** row with the network and those
    same digits, a **Billed to** row showing your account's email rather than a workspace
    name, and a **Status** row reading **Charged automatically**.
  </Step>

  <Step title="Open the hosted billing portal">
    Choose **Manage billing** to open Stripe's own billing portal, in this tab rather than a
    new one: it covers payment methods, invoices, plan changes and cancellation in one
    place. Leaving it sends you back to the **Subscription** tab, not this one.
  </Step>

  <Step title="Find and download a past invoice">
    The list is newest first. Each row carries a **Reference** (the invoice number, or the
    invoice's internal id when it has no number, which happens on some drafts), a **Status**
    chip reading Paid, Open, Draft, Uncollectible or Void, then the **Date** and the
    **Amount**. Under **Receipt**, hover an icon for its name: **View invoice** opens the
    hosted invoice and **Download PDF** opens its file, both in a new tab. Each icon appears
    only when the invoice carries that link, so a row can show one, both or neither.
  </Step>
</Steps>

<Note>
  The panel carries this line whether or not a card is saved: "Card details are stored and
  encrypted by Stripe. We never see your full card number."
</Note>

## What happens next

<Check>
  The card panel shows the network and last four digits with a **Default** badge, and a
  **Status** row reading **Charged automatically**.
</Check>

That card is now the default on your account. The next piece of managed infrastructure you
buy, a mailbox or a domain, is charged to it directly instead of sending you out to a hosted
checkout page, and buying a credit package no longer stops to ask for a card.

The invoice list is fetched once, when the page opens, so an invoice issued while you sit
here shows up on the next load.

## Troubleshooting

<AccordionGroup>
  <Accordion title="There's no Add card or Update card button">
    That header only offers a card action once there is a subscription on your account. With
    none, it offers **Subscribe** instead, which sends you to the plan picker.
  </Accordion>

  <Accordion title="Saving a card fails">
    The reason shows as a toast: either what the card was rejected for, or what the save
    itself failed on. The form stays open with what you typed, so fix it and choose **Save**
    again. Nothing is saved until it succeeds, so the card you had on file, if any, is still
    there.
  </Accordion>

  <Accordion title="Manage billing doesn't open anything">
    A toast names what went wrong, or reads "Could not open the billing portal" if the
    request failed without a specific message. Nothing on this page changes. Reload and try
    again.
  </Accordion>
</AccordionGroup>

## Related

<CardGroup cols={2}>
  <Card title="Change plan, add-ons or cancel" icon="credit-card" href="/en/billing/change-plan-or-cancel">
    The subscription page end to end: plan, usage, add-ons, changing plan and cancelling.
  </Card>

  <Card title="Paying through a checkout link from your account rep" icon="handshake" href="/en/billing/checkout-link-from-your-rep">
    What the secure checkout page shows when you pay through a link instead of this page.
  </Card>
</CardGroup>