Zatražite rani pristup

Unesite ime te adresu e-pošte ili telefonski broj. Poslat ćemo vam pojedinosti o pristupu platformi Tajo.

Referenca prikaznih mjesta

Prikazna mjesta (viewports) određuju gdje se komponente sučelja vaše Stripe aplikacije pojavljuju unutar Stripe Dashboarda. Svako prikazno mjesto odgovara određenoj stranici ili lokaciji u Dashboardu na kojoj vaša aplikacija može prikazati prikaz.

Kako prikazna mjesta funkcioniraju

Kada u manifestu aplikacije deklarirate prikaz, React komponentu pridružujete prikaznom mjestu:

{
  "ui_extension": {
    "views": [
      {
        "viewport": "stripe.dashboard.customer.detail",
        "component": "CustomerDetailView"
      }
    ]
  }
}

Komponenta se prikazuje u ladici aplikacije (bočnoj ploči) kada korisnik otvori odgovarajuću stranicu Dashboarda i pokrene vašu aplikaciju.

Prikazna mjesta za cijeli Dashboard nasuprot onima vezanima uz stranicu

Prikazna mjesta za cijeli Dashboard

Ova prikazna mjesta dostupna su na svakoj stranici Stripe Dashboarda:

ID prikaznog mjesta	Opis
`stripe.dashboard.drawer.default`	Zadani prikaz u ladici, dostupan s bilo koje stranice Dashboarda putem ikone aplikacije
`stripe.dashboard.home.overview`	Pregled na početnoj stranici, prikazan na ulaznoj stranici Dashboarda
`stripe.dashboard.settings`	Stranica s postavkama aplikacije, dostupna iz izbornika postavki aplikacije
`stripe.dashboard.onboarding`	Tijek uvođenja, prikazan nakon instalacije aplikacije

Tip

Prikazno mjesto drawer.default služi kao rezervna opcija. Ako korisnik otvori vašu aplikaciju na stranici za koju niste deklarirali posebno prikazno mjesto, umjesto toga prikazuje se prikaz drawer.default.

Prikazna mjesta vezana uz stranicu

Ova prikazna mjesta prikazuju se samo kada je korisnik na odgovarajućoj stranici Dashboarda:

Plaćanja

ID prikaznog mjesta	Stranica	Uzorak URL-a	Vrsta objekta
`stripe.dashboard.payment.list`	Popis plaćanja	`/payments`
`stripe.dashboard.payment.detail`	Detalji plaćanja	`/payments/:id`	PaymentIntent
`stripe.dashboard.charge.detail`	Detalji naplate	`/payments/:id` (zastarjelo)	Charge

Kupci

ID prikaznog mjesta	Stranica	Uzorak URL-a	Vrsta objekta
`stripe.dashboard.customer.list`	Popis kupaca	`/customers`
`stripe.dashboard.customer.detail`	Detalji kupca	`/customers/:id`	Customer

Proizvodi i cijene

ID prikaznog mjesta	Stranica	Uzorak URL-a	Vrsta objekta
`stripe.dashboard.product.list`	Popis proizvoda	`/products`
`stripe.dashboard.product.detail`	Detalji proizvoda	`/products/:id`	Product
`stripe.dashboard.price.detail`	Detalji cijene	`/prices/:id`	Price

Računi

ID prikaznog mjesta	Stranica	Uzorak URL-a	Vrsta objekta
`stripe.dashboard.invoice.list`	Popis računa	`/invoices`
`stripe.dashboard.invoice.detail`	Detalji računa	`/invoices/:id`	Invoice

Pretplate

ID prikaznog mjesta	Stranica	Uzorak URL-a	Vrsta objekta
`stripe.dashboard.subscription.list`	Popis pretplata	`/subscriptions`
`stripe.dashboard.subscription.detail`	Detalji pretplate	`/subscriptions/:id`	Subscription

Plaćanje

ID prikaznog mjesta	Stranica	Uzorak URL-a	Vrsta objekta
`stripe.dashboard.checkout.session.list`	Popis Checkout sesija	`/checkout/sessions`
`stripe.dashboard.checkout.session.detail`	Detalji Checkout sesije	`/checkout/sessions/:id`	CheckoutSession
`stripe.dashboard.payment-link.list`	Popis poveznica za plaćanje	`/payment-links`
`stripe.dashboard.payment-link.detail`	Detalji poveznice za plaćanje	`/payment-links/:id`	PaymentLink

Connect

ID prikaznog mjesta	Stranica	Uzorak URL-a	Vrsta objekta
`stripe.dashboard.connect.account.list`	Popis povezanih računa	`/connect/accounts`
`stripe.dashboard.connect.account.detail`	Detalji povezanog računa	`/connect/accounts/:id`	Account
`stripe.dashboard.transfer.list`	Popis prijenosa	`/connect/transfers`
`stripe.dashboard.transfer.detail`	Detalji prijenosa	`/connect/transfers/:id`	Transfer

Naplata

ID prikaznog mjesta	Stranica	Uzorak URL-a	Vrsta objekta
`stripe.dashboard.coupon.list`	Popis kupona	`/coupons`
`stripe.dashboard.coupon.detail`	Detalji kupona	`/coupons/:id`	Coupon
`stripe.dashboard.quote.list`	Popis ponuda	`/quotes`
`stripe.dashboard.quote.detail`	Detalji ponude	`/quotes/:id`	Quote
`stripe.dashboard.credit-note.detail`	Detalji odobrenja	`/credit-notes/:id`	CreditNote

Isplate

ID prikaznog mjesta	Stranica	Uzorak URL-a	Vrsta objekta
`stripe.dashboard.payout.list`	Popis isplata	`/payouts`
`stripe.dashboard.payout.detail`	Detalji isplate	`/payouts/:id`	Payout

Sporovi

ID prikaznog mjesta	Stranica	Uzorak URL-a	Vrsta objekta
`stripe.dashboard.dispute.list`	Popis sporova	`/disputes`
`stripe.dashboard.dispute.detail`	Detalji spora	`/disputes/:id`	Dispute

Terminal

ID prikaznog mjesta	Stranica	Uzorak URL-a	Vrsta objekta
`stripe.dashboard.terminal.reader.list`	Popis čitača	`/terminal/readers`
`stripe.dashboard.terminal.reader.detail`	Detalji čitača	`/terminal/readers/:id`	TerminalReader
`stripe.dashboard.terminal.location.list`	Popis lokacija	`/terminal/locations`
`stripe.dashboard.terminal.location.detail`	Detalji lokacije	`/terminal/locations/:id`	TerminalLocation

Issuing

ID prikaznog mjesta	Stranica	Uzorak URL-a	Vrsta objekta
`stripe.dashboard.issuing.card.list`	Popis kartica	`/issuing/cards`
`stripe.dashboard.issuing.card.detail`	Detalji kartice	`/issuing/cards/:id`	IssuingCard
`stripe.dashboard.issuing.cardholder.list`	Popis vlasnika kartica	`/issuing/cardholders`
`stripe.dashboard.issuing.cardholder.detail`	Detalji vlasnika kartice	`/issuing/cardholders/:id`	IssuingCardholder
`stripe.dashboard.issuing.transaction.list`	Popis transakcija	`/issuing/transactions`
`stripe.dashboard.issuing.authorization.list`	Popis autorizacija	`/issuing/authorizations`

Pristup kontekstu objekta

Kada se vaša aplikacija prikaže na prikaznom mjestu s detaljima, kao kontekst prima odgovarajući Stripe objekt:

import type { ExtensionContextValue } from '@stripe/ui-extension-sdk/context';

const CustomerDetailView = ({ environment }: ExtensionContextValue) => {
  const { objectContext } = environment;

  // objectContext contains the current Stripe object
  const customerId = objectContext?.id; // "cus_xxxxx"
  const customerEmail = objectContext?.email;

  return (
    <Box>
      <Inline>Customer: {customerEmail}</Inline>
      <Inline>Brevo Sync Status: checking...</Inline>
    </Box>
  );
};

Kontekst popisa nasuprot kontekstu detalja

Vrsta prikaznog mjesta	Kontekst objekta	Primjer uporabe
Popis (npr. `customer.list`)	Nije dostupan, nijedan objekt nije odabran	Prikaz zbirnih podataka, sažetaka ili skupnih radnji
Detalji (npr. `customer.detail`)	Cjeloviti Stripe objekt za trenutnu stranicu	Prikaz podataka, radnji i integracija vezanih uz objekt

Preporučena prikazna mjesta za Tajo Brevo integraciju

Za aplikaciju Tajo Brevo integracije najkorisnija su ova prikazna mjesta:

{
  "ui_extension": {
    "views": [
      {
        "viewport": "stripe.dashboard.customer.detail",
        "component": "CustomerDetailView"
      },
      {
        "viewport": "stripe.dashboard.customer.list",
        "component": "CustomerListView"
      },
      {
        "viewport": "stripe.dashboard.payment.detail",
        "component": "PaymentDetailView"
      },
      {
        "viewport": "stripe.dashboard.subscription.detail",
        "component": "SubscriptionDetailView"
      },
      {
        "viewport": "stripe.dashboard.home.overview",
        "component": "OverviewView"
      },
      {
        "viewport": "stripe.dashboard.drawer.default",
        "component": "DrawerView"
      },
      {
        "viewport": "stripe.dashboard.settings",
        "component": "SettingsView"
      },
      {
        "viewport": "stripe.dashboard.onboarding",
        "component": "OnboardingView"
      }
    ]
  }
}

Komponenta	Namjena
CustomerDetailView	Prikazuje Brevo podatke o kontaktu, status sinkronizacije i podatke o angažmanu za određenog kupca
CustomerListView	Prikazuje kontrole za skupnu sinkronizaciju i zbirnu statistiku Brevo sinkronizacije
PaymentDetailView	Prikazuje koji su Brevo događaji pokrenuti ovim plaćanjem
SubscriptionDetailView	Prikazuje status Brevo automatizacije za ovu pretplatu
OverviewView	Widget na početnoj stranici Dashboarda sa stanjem sinkronizacije i ključnim Brevo metrikama
DrawerView	Opća ladica aplikacije s brzim radnjama i pregledom statusa
SettingsView	Konfiguracija Brevo API ključa, postavki sinkronizacije i mapiranja polja
OnboardingView	Vodi nove korisnike kroz povezivanje njihovog Brevo računa

Dostupnost prikaznih mjesta

Nisu sva prikazna mjesta dostupna u svim načinima rada Stripe Dashboarda:

Način rada	Dostupna prikazna mjesta
Live mode	Sva prikazna mjesta
Test mode	Sva prikazna mjesta (koristi testne podatke)
Sandbox	Sva prikazna mjesta (ako je `sandbox_install_compatible: true`)

Caution

Ako vaš manifest deklarira prikazno mjesto koje ne postoji, provjera pri prijenosu aplikacije neće uspjeti. Uvijek provjerite ID-jeve prikaznih mjesta prema ovoj referenci.