search

strapi / nextjs-corporate-starter

Strapi Demo application for Corporate Websites using Next.js
MIT License
966 stars 287 forks source link

Add preview mode #18

Open pepijn-vanvlaanderen opened 1 year ago

pepijn-vanvlaanderen commented 1 year ago

Would be interesting to have a preview/draft mode included in this starter as well.

abrorAbdullaev commented 1 year ago

Even if we implement the preview feature in UI, can we extend the admin and add there a preview button somewhere without modifying the base module of @strapi/strapi?

pepijn-vanvlaanderen commented 1 year ago

Even if we implement the preview feature in UI, can we extend the admin and add there a preview button somewhere without modifying the base module of @strapi/strapi?

Yes, there are already numerous Strapi plugins that do that, this one seems closest:

PaulBratslavsky commented 1 year ago

That is a great idea. Will add it to the list.

rrubio commented 11 months ago

@pepijn-vanvlaanderen were you successfull adding the preview buttom to this demo? i'm the getting some erorrs at my end. 

Unhandled Runtime Error
Error: Cannot read properties of undefined (reading 'attributes')

Source
src/app/[lang]/[...slug]/page.tsx (18:22) @ attributes

  16 | const page = await getPageBySlug(params.slug, params.lang);
  17 | 
> 18 | if (!page.data[0].attributes?.seo) return FALLBACK_SEO;
     |                  ^
  19 | const metadata = page.data[0].attributes.seo
  20 | 
  21 | return {
pepijn-vanvlaanderen commented 11 months ago

@rrubio it is actually very straightforward when you follow the guide here: https://nextjs.org/docs/app/building-your-application/configuring/draft-mode

You just need a custom /api/preview/route.ts where the draftMode gets enabled, after that cookie is set al your pages are dynamically rendered and you have your preview.

PaulBratslavsky commented 8 months ago

I am going to keep this issue open for anyone wanting to add this as a PR. In terms of items on my list, this has lower priority.😅