Ajukan akses awal

Masukkan nama depan serta email atau nomor telepon Anda. Kami akan menghubungi Anda dengan detail akses Tajo.

Di halaman ini

Viewports और UI Components

Viewports Stripe Dashboard में वो specific locations हैं जहाँ आपका app UI render कर सकता है।

Available Viewports

Dashboard Views

Viewport	Location	Use Case
`stripe.dashboard.customer.detail`	Customer detail page	Per-customer Brevo sync status
`stripe.dashboard.home.overview`	Dashboard home	Overall integration health
`stripe.dashboard.payment.detail`	Payment detail page	Payment-triggered campaign info
`stripe.dashboard.invoice.detail`	Invoice detail page	Invoice-based email campaigns

Customer Detail Viewport

यह Tajo Brevo integration का primary viewport है।

import {
  Box,
  Button,
  Badge,
  Inline,
  Banner,
} from '@stripe/ui-extension-sdk/ui';
import type { ExtensionContextValue } from '@stripe/ui-extension-sdk/context';

const CustomerDetailView = ({ environment, userContext }: ExtensionContextValue) => {
  const customerId = environment.objectContext?.id;

  return (
    <Box css={{ padding: 'large' }}>
      <Inline css={{ fontWeight: 'bold', marginBottom: 'medium' }}>
        Brevo Contact Sync
      </Inline>

      <Banner
        title="Synced to Brevo"
        description="यह customer Brevo में synced है।"
        variant="default"
      />

      <Button
        type="primary"
        css={{ marginTop: 'medium' }}
        onPress={() => {/* sync trigger */}}
      >
        Brevo में Sync करें
      </Button>
    </Box>
  );
};

export default CustomerDetailView;

Home Overview Viewport

const HomeView = ({ environment }: ExtensionContextValue) => {
  return (
    <Box css={{ padding: 'large' }}>
      <Inline css={{ fontWeight: 'bold', marginBottom: 'medium' }}>
        Tajo, Brevo Integration
      </Inline>
      <Box css={{ marginTop: 'medium' }}>
        <Inline>Synced Contacts: 1,234</Inline>
        <Inline>Campaigns Triggered: 56</Inline>
        <Inline>Last Sync: 5 minutes ago</Inline>
      </Box>
    </Box>
  );
};

Tip

stripe.dashboard.customer.detail viewport से शुरू करें। यह Tajo Brevo integration के लिए सबसे useful viewport है और review के दौरान best first impression देता है।

अगले कदम

Embedded Apps, App embedding patterns
Post-Install, Installation के बाद onboarding