reopt designreopt design
DocsExploreToolsPricingBuilder
Login
Explore/
opt-ui165opt-charts33opt-datagrid6opt-editor5opt-calendar4opt-filemanager4opt-chat6opt-shell14brandapp-ui8Examples12Builder Blocks
reopt designreopt design

A design system for the AI era

  • Docs
  • Pricing
  • Releases
  • GitHub
  • Terms of Service
  • Privacy Policy

reopt Inc.Business registration no. 217-88-02453contact@reopt.ai

© 2026 reopt Inc. All rights reserved.

Explore/brandapp-ui/Reopt Record Table
Data Tablebrandapp-ui example

Reopt Record Table

EAV record table surface wiring a server-side sdk.eav proxy to opt-ui DataTable with auto-inferred columns.

eavdatatablebrandapp-sdk
opt surface add reopt-record-table
ReoptRecordTable
1024px

EAV 레코드 — customers

레코드세그먼트유입상태생성일
봄 컬렉션 런칭캠페인127활성2026-03-12
친구 초대 이벤트리퍼럴84활성2026-03-09
얼리버드 할인프로모션213보관2026-02-28
신규 가입 웰컴온보딩56초안2026-03-15
VIP 사전 예약로열티31활성2026-03-01
재입고 알림리텐션98초안2026-03-14

Server route (required)

sdk.eav는 clientSecret이 필요한 서버 전용 클라이언트입니다. 서버 라우트가 records(entityId).list()를 프록시하면 Surface는 그 endpoint를 fetch해 DataTable로 렌더합니다.

// app/api/records/route.ts
import { createReoptSDK } from "@reopt-ai/brandapp-sdk";

const sdk = createReoptSDK({
  clientId: process.env.BRANDAPP_CLIENT_ID!,
  clientSecret: process.env.BRANDAPP_CLIENT_SECRET!,
  brandappId: process.env.BRANDAPP_ID!,
});

export async function GET(req: Request) {
  const entityId = new URL(req.url).searchParams.get("entityId");
  if (!entityId) return Response.json({ data: [] });
  const page = await sdk.eav.records(entityId).list({ page: 1, pageSize: 50 });
  return Response.json(page); // { data: EavRecord[], total, page, pageSize }
}
이 데모는 mock 레코드로 렌더한 로컬 시뮬레이션입니다. 실제 Surface는 recordsEndpoint를 fetch하며, columns 미지정 시 레코드 values 키로 컬럼을 자동 추론합니다.

Related Examples

brandapp-ui

BrandApp Control Center

brandapp-ui - Control

Examples
createReoptEavClientcreateReoptTermsClient
brandapp-ui

Reopt AI Chat

brandapp-ui - AI Chat

Examples
ReoptAiChat
brandapp-ui

Reopt AI Image Studio

brandapp-ui - AI Image

Examples
ReoptAiImageStudio
PreviousReopt AI Image Studio