import React from 'react' import { Head, Link, usePage } from '@inertiajs/react' import StudioLayout from '../../Layouts/StudioLayout' import NovaCardCanvasPreview from '../../components/nova-cards/NovaCardCanvasPreview' function requestJson(url, { method = 'POST' } = {}) { return fetch(url, { method, credentials: 'same-origin', headers: { Accept: 'application/json', 'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]')?.getAttribute('content') || '', 'X-Requested-With': 'XMLHttpRequest', }, }).then(async (response) => { const payload = await response.json().catch(() => ({})) if (!response.ok) throw new Error(payload?.message || 'Request failed') return payload }) } function StatCard({ label, value, icon }) { return (
{label}
{value}
) } export default function StudioCardsIndex() { const { props } = usePage() const cards = props.cards?.data || [] const stats = props.stats || {} const endpoints = props.endpoints || {} async function duplicateCard(cardId) { const url = (endpoints.duplicatePattern || '').replace('__CARD__', String(cardId)) if (!url) return const payload = await requestJson(url) if (payload?.data?.id) { window.location.assign((endpoints.editPattern || '/studio/cards/__CARD__/edit').replace('__CARD__', String(payload.data.id))) } } return (

Creation surface

Build quote cards, mood cards, and visual text art.

Drafts autosave, templates stay structured, and every published card gets a public preview image ready for discovery and sharing.

New card Browse public cards

Latest work

Your card library

{cards.length === 0 ? (

No cards yet

Start with a square card or jump straight into a story-sized template. Your first draft will be created automatically in the editor.

Create your first card
) : (
{cards.map((card) => (
{card.title}
{card.quote_text}
{card.status}
{card.category?.name || 'Uncategorized'} {card.format}
Edit
))}
)}
) }