Events

This will add the events Object type to your Bucket.

This will add the EventCard.tsx, EventsList.tsx, and SingleEvent.tsx files to cosmic/blocks/events.

Add a new file located at app/events/page.tsx with the following:

Add a new file located at app/events/[slug]/page.tsx with the following:

See the pagination Block for installation steps and view the full examples below.

Enable draft preview by setting the status property on the Block. View the draft preview content by setting the ?status=any in the URL. Note: This is a basic example. It is advisable to consider a security strategy if you intend to keep your preview private.

To add the draft preview link in the dashboard, go to Events Object type > Settings and add your preview link in the dashboard under Additional Settings. For example adding the link http://localhost:3000/events/[object_slug]?status=any will add a Preview button to each event.

Add numbered pagination with the pagination Block.

Use the load more pagination Block to fetch additional events using a Server Action.

First, enable localization in the dashboard by going to Events Object type > Settings under Additional Settings. Then set the locale on your specific Object. Finally, pass the locale parameter into the query to fetch your localized content. Then go to any page with localization set, for example: https://localhost:3000/es/events or https://localhost:3000/en/events.