|
|
|
@@ -1,8 +1,9 @@
|
|
|
|
|
<script lang="ts">
|
|
|
|
|
import { onMount } from 'svelte';
|
|
|
|
|
import Modal from '../components/Modal.svelte';
|
|
|
|
|
import { app, handleError } from '../lib/app.svelte';
|
|
|
|
|
import { app, handleError, showToast } from '../lib/app.svelte';
|
|
|
|
|
import { gateway } from '../lib/gateway';
|
|
|
|
|
import { platformSubtype } from '../lib/platform';
|
|
|
|
|
import { t, i18n, type MessageKey } from '../lib/i18n/index.svelte';
|
|
|
|
|
import { executionContext, formatAmount, needsWebSpendWarning, type SpendContext } from '../lib/wallet';
|
|
|
|
|
import { isGooglePlayBuild } from '../lib/distribution';
|
|
|
|
@@ -25,6 +26,9 @@
|
|
|
|
|
|
|
|
|
|
const context: SpendContext = executionContext();
|
|
|
|
|
const gpBuild = isGooglePlayBuild();
|
|
|
|
|
// Money purchases are not permitted inside the VK iOS app (Apple ToS); the pack CTA is shown
|
|
|
|
|
// muted and taps explain why, rather than hiding the storefront.
|
|
|
|
|
const purchaseBlocked = context === 'vk' && platformSubtype() === 'ios';
|
|
|
|
|
|
|
|
|
|
const values = $derived(catalog?.products.filter((p) => p.kind === 'value') ?? []);
|
|
|
|
|
const packs = $derived(catalog?.products.filter((p) => p.kind === 'pack') ?? []);
|
|
|
|
@@ -162,7 +166,16 @@
|
|
|
|
|
<div class="row product" data-testid="product" data-kind="pack" data-pid={p.productId}>
|
|
|
|
|
<span class="name">{p.title}</span>
|
|
|
|
|
<span class="price">{formatAmount(p.moneyAmount, p.moneyCurrency)} {currencyLabel(p.moneyCurrency)}</span>
|
|
|
|
|
<button class="buy" data-testid="buy-pack" disabled={busy} onclick={() => onOrder(p)}>{t('wallet.buy')}</button>
|
|
|
|
|
<button
|
|
|
|
|
class="buy"
|
|
|
|
|
class:blocked={purchaseBlocked}
|
|
|
|
|
data-testid="buy-pack"
|
|
|
|
|
disabled={busy}
|
|
|
|
|
onclick={() => {
|
|
|
|
|
if (purchaseBlocked) showToast(t('wallet.platformNoBuy'));
|
|
|
|
|
else void onOrder(p);
|
|
|
|
|
}}>{t('wallet.buy')}</button
|
|
|
|
|
>
|
|
|
|
|
</div>
|
|
|
|
|
{/each}
|
|
|
|
|
{#if packs.length > 0}
|
|
|
|
@@ -244,6 +257,9 @@
|
|
|
|
|
opacity: 0.5;
|
|
|
|
|
cursor: default;
|
|
|
|
|
}
|
|
|
|
|
.buy.blocked {
|
|
|
|
|
opacity: 0.5;
|
|
|
|
|
}
|
|
|
|
|
.empty,
|
|
|
|
|
.stub {
|
|
|
|
|
margin: 0;
|
|
|
|
|