# Pending orders (https://docs.salla.dev/twilight/react/routes/pending-orders)



<Callout title="Framework: TanStack Start">
  This page is written for TanStack Start, the default and currently supported framework. [See what depends on the framework](https://docs.salla.dev/twilight/react/start/frameworks).
</Callout>

The customer never sees a page here: both URLs redirect to the [orders list](https://docs.salla.dev/twilight/react/routes/account-orders) filtered to orders waiting for payment. The second URL exists because the Salla user menu links "Pending orders" to `/account/pending_orders`. Customise it only to send customers somewhere else.

## URL [#url]

| URL                          | Redirects to                        |
| ---------------------------- | ----------------------------------- |
| `/pending-orders`            | `/ar/account/orders?status=pending` |
| `/en/pending-orders`         | `/en/account/orders?status=pending` |
| `/account/pending_orders`    | `/ar/account/orders?status=pending` |
| `/en/account/pending_orders` | `/en/account/orders?status=pending` |

The only param is the optional `locale`. When the URL has none, the redirect uses `ar`, not the store's default language, so put the language in your own links.

## Route file [#route-file]

The engine writes two files with the same content apart from the path into its own `.twilight/` folder, not into `app/routes/`:

```tsx title="pending-orders.tsx (served by the engine)"
// @auto-generated
import { createFileRoute } from '@tanstack/react-router';
import { pendingOrdersRedirectLoader } from '@salla.sa/twilight-theme-engine/routes/seo-redirects';

export const Route = createFileRoute('/{-$locale}/pending-orders')({
  loader: ({ params }) =>
    pendingOrdersRedirectLoader({
      params: { locale: params.locale },
    }),
});
```

`account.pending_orders.tsx` is identical, with the path `/{-$locale}/account/pending_orders`. To take one over, add a file of the same name to `app/routes/` without the `// @auto-generated` line, and the build uses yours. See [Fork a built-in route](https://docs.salla.dev/twilight/react/recipes/fork-a-built-in-route).

### A customised version [#a-customised-version]

Send customers to a different status, using the router's own `redirect`:

```tsx title="app/routes/pending-orders.tsx"
import { createFileRoute, redirect } from '@tanstack/react-router';

export const Route = createFileRoute('/{-$locale}/pending-orders')({
  loader: ({ params }) => {
    throw redirect({ to: `/${params.locale ?? 'ar'}/account/orders?status=processing` });
  },
});
```

## What it loads [#what-it-loads]

Nothing. The loader throws a redirect straight away, and there is no head. No token is checked at this step.

## Edge cases [#edge-cases]

* **Signed out.** The redirect still happens; the orders page then sends the guest to sign in.
* **Query string.** Extra query parameters on the incoming URL are dropped.

## See also [#see-also]

* [Account orders](https://docs.salla.dev/twilight/react/routes/account-orders), where the redirect lands
* [SEO redirects](https://docs.salla.dev/twilight/react/routes/seo-redirects), the other redirect-only routes
* [Account layout](https://docs.salla.dev/twilight/react/routes/account)
