Quick Show
QuickShow opens a modal or side panel displaying an entity’s details without navigating to the full detail page.
Import
import { QuickShow } from "@phpcreation/frontend-crud-react-nextjs-bundle/components/QuickShow";Usage
import { QuickShow } from "...";
function RowActions({ entity }) {
const [open, setOpen] = useState(false);
return (
<>
<Button variant="ghost" onClick={() => setOpen(true)}>View</Button>
<QuickShow
open={open}
onOpenChange={setOpen}
entityId={entity.id}
entityConfig={entityConfig}
detailFields={entityDetailFields}
/>
</>
);
}Props
| Prop | Type | Description |
|---|---|---|
open | boolean | Modal open state |
onOpenChange | (open: boolean) => void | Open state handler |
entityId | string | number | Entity ID to fetch and display |
entityConfig | EntityConfig | Entity configuration |
detailFields | FieldConfig[] | Fields to display |
Related
Last updated on