---
title: Usage alert
description: Show measured usage and its limit without changing quotas or subscription state.
---

This application recipe uses the [shared transactional layout](/ui/components#shared-recipe-layout). It returns a rendering Effect containing HTML and plain text; it does not submit email or implement the business operation.

```ts
import { renderReactEmail } from "@corven/email-sdk/react";
import { transactionalEmailLayout } from "./react-layout.js";

export const usageAlertEmail = (input: { usage: string; limit: string; reviewUrl: string }) =>
  renderReactEmail(
    transactionalEmailLayout({
      heading: "Review your usage",
      preview: "Your account is approaching a usage limit.",
      paragraphs: [
        `Current usage: ${input.usage}. Limit: ${input.limit}.`,
        "Review usage and available options.",
      ],
      action: { href: input.reviewUrl, label: "View usage" },
    }),
  );
```

## Supply authorized data

Compute usage and thresholds in your application and suppress duplicate alerts for the same logical event. Do not infer that sending an alert changes a quota or subscription.

Keep URLs and template inputs under host control. React text escaping is not URL validation or a consent check. Treat the rendered body as private message content.

## Send the rendered body

Yield the rendering Effect in your application, then supply its body to `Email.send` with explicit sender and recipients. Apply ordinary [provider validation](/providers/capabilities), [submission policy](/reference/options) and any required approval. The [React integration](/integrations/react) shows this composition.

These recipes are application examples, not additional template exports from the SDK. Rendering and compilation do not establish delivery or compatibility with every email client.
