Blocco Subscription upgrade

Il blocco Subscription upgrade è un sub-blocco che si annida dentro Cart items. Invita gli acquirenti a passare una riga una tantum idonea a un abbonamento direttamente dal carrello, trasformando un acquisto una tantum in ricavi ricorrenti nel momento della decisione, e permette agli acquirenti già abbonati di cambiare o annullare il piano su quella riga.

• Appare solo sulle righe idonee. Il blocco legge i selling plan del prodotto e non renderizza nulla su una riga il cui prodotto non ha piani di abbonamento.
• Mai offerto sugli omaggi reward. Abbonarsi a un omaggio concesso automaticamente ne rimuoverebbe lo stato di reward, quindi l’invito è soppresso su quelle righe.
• Su una riga una tantum, mostra la call-to-action di upgrade.
• Su una riga già abbonata, mostra un selettore di piani più l’opzione “downgrade a una tantum”.

• Parent: si annida solo dentro Cart items.
• Massimo: 1 per carrello.
• Non aggiunto di default. Non bloccato, quindi puoi rimuoverlo o nasconderlo.

function CustomTemplate(props) {
  const { view } = props;

  if (view.state === 'upgrade') {
    return (
      <button type="button" onClick={() => props.selectPlan(view.planId)} disabled={props.busy}>
        {view.buttonText}
      </button>
    );
  }

  return (
    <div>
      <select
        aria-label={`Subscription plan — ${props.title}`}
        value={String(view.activePlanId)}
        onChange={props.onChange}
        disabled={props.busy}
      >
        {view.plans.map((plan) => (
          <option key={plan.id} value={String(plan.id)}>
            {plan.name}{plan.discountPercent > 0 ? ` (${plan.discountPercent}% off)` : ''}
          </option>
        ))}
        <option value={props.oneTimeValue}>{props.unsubscribeText}</option>
      </select>
    </div>
  );
}