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

# Приклади (Hydrogen)

> Мінімальні приклади redirect на plata checkout з Remix / Hydrogen.

Приклади схематичні — підставте свої хелпери cart і env.

## Remix / Hydrogen Loader або Action

```tsx theme={null}
import { redirect } from "@shopify/remix-oxygen";

const CHECKOUT_URL = "https://checkout.plata-app.com";

export async function action({ context, request }: ActionFunctionArgs) {
  const cart = await context.cart.get(); // ваш спосіб отримати cart
  const cartToken = cart?.id /* або token — те, що приймає Storefront на бекенді plata */;
  const shop = context.env.PUBLIC_STORE_DOMAIN; // your-store.myshopify.com

  if (!cartToken) {
    return redirect("/cart");
  }

  const url = new URL("/c/start", CHECKOUT_URL);
  url.searchParams.set("shop", shop);
  url.searchParams.set("cart", cartToken);

  // опційно: UTM
  const incoming = new URL(request.url);
  for (const key of ["utm_source", "utm_medium", "utm_campaign"]) {
    const value = incoming.searchParams.get(key);
    if (value) url.searchParams.set(key, value);
  }

  return redirect(url.toString());
}
```

## Кнопка-посилання (клієнт)

```tsx theme={null}
export function PlataCheckoutButton({
  shop,
  cartToken,
}: {
  shop: string;
  cartToken: string;
}) {
  const href = `https://checkout.plata-app.com/c/start?shop=${encodeURIComponent(
    shop
  )}&cart=${encodeURIComponent(cartToken)}`;

  return (
    <a href={href} className="checkout-button">
      Оформити замовлення
    </a>
  );
}
```

## Перевірка в DevTools

1. Клік на кнопку → Network: document navigation на `/c/start`.
2. Далі 302/redirect на `/c/<token>`.
3. У HTML чекауту — ті самі line items, що в Hydrogen cart.

Якщо бачите сторінку «Не вдалося відкрити оформлення» — текст помилки підкаже причину (`Shop not connected`, `Missing cart token`, `Cart is empty`, `Failed to load cart`). Див. [Траблшутинг](/hydrogen/troubleshooting).