> ## Documentation Index
> Fetch the complete documentation index at: https://docs.replo.app/llms.txt
> Use this file to discover all available pages before exploring further.
# Kaching Bundles
> Sell Kaching Bundles deals on Replo Sites with nothing more than your Shopify connection.
export const TryPromptButton = ({prompt, imageSrc, imageAlt = "Template preview", imageStyles = {}, buttonCta = "Build in Replo"}) => {
const [isLoading, setIsLoading] = useState(false);
const [error, setError] = useState(null);
const PUBLISHER_API_BASE_URL = "https://publisher.replo.app";
const APP_URL = "https://dashboard.replo.app";
const LoaderIcon = ;
const ChevronIcon = ;
async function postJSON(url, body, headers = {}, timeoutMs = 120000) {
const controller = new AbortController();
const timeoutId = setTimeout(() => controller.abort(), timeoutMs);
try {
const response = await fetch(url, {
method: "POST",
headers: {
"Content-Type": "application/json",
...headers
},
body: JSON.stringify(body ?? ({})),
signal: controller.signal
});
const responseText = await response.text();
if (!response.ok) throw new Error(`API Error: ${response.status}`);
return responseText ? JSON.parse(responseText) : {};
} finally {
clearTimeout(timeoutId);
}
}
async function handleTryPrompt(event) {
event.preventDefault();
event.stopPropagation();
setIsLoading(true);
setError(null);
try {
const body = {
prompt,
file: null
};
const {seed} = await postJSON(`${PUBLISHER_API_BASE_URL}/api/v1/marketing/issue-marketing-site-jwt`, body);
if (!seed) throw new Error("No seed returned from API");
const url = new URL(APP_URL);
url.searchParams.set("type", "agent");
url.hash = `seed=${encodeURIComponent(seed)}`;
window.open(url.toString(), "_blank");
} catch (caughtError) {
console.error("Failed to generate prompt:", caughtError);
setError("Something went wrong. Please try again.");
} finally {
setIsLoading(false);
}
}
return
{}
{imageSrc && }
{}
{}
{}
{error &&
{error}
}
;
};
[Kaching Bundles](https://apps.shopify.com/bundle-deals) adds volume discounts, multi-packs, and quantity breaks to Shopify stores. Once it's installed on your store, Replo can render your Kaching deals on the pages it builds using Kaching's own bundle widget, and Shopify Checkout applies the discount exactly as it does on your theme.
## How it works
There's nothing to connect. Kaching stores its deal configuration on your Shopify store, and Replo reads it through the Shopify connection you already have.
If you haven't already, connect your store in the [Integrations
app](/apps/integrations) and set Shopify as the checkout provider.
Configure and style your bundles in the Kaching app in Shopify admin. Replo
shows them exactly as Kaching renders them.
Open the Shopify integration page to confirm Kaching shows as **Detected**,
then ask Replo to add your Kaching bundles to a product page.
```text theme={null}
Add my Kaching bundle offers to the buy box on this product page
```
## What to expect
* Shoppers pick a bundle in the Kaching widget, and the right products and quantities go to cart.
* The bundle discount is applied by Kaching at Shopify Checkout and shows in the cart as a discount.
* Styling comes from the Kaching app, not from Replo.
Kaching Bundles works with the Shopify checkout provider only. It isn't
available on Replo Products or Stripe checkout, and Replo doesn't use
Kaching's theme snippet on Sites.