Need Prettier Support

[jazimabbas]

I want to format the code using the Prettier API. I am using Next.js Server Component. I am trying to implement it within the beforeHighlight function in the extensions hook. However, the issue arises because the Prettier format function returns a promise, whereas beforeHighlight does not expect a promise.
How can I resolve this problem? I prefer not to place the Prettier logic in the client component. Can anyone please assist me with this?

Isn't nice if somehow beforeHighlight function resolve the promise, then the problem would be solved very easily.

[pomber]

maybe wrap it in your own server component?

import { Code } from "bright"

async function MyCode(props) {
  const newProps = await format(props)
  return <Code {...newProps} />
}

[jazimabbas]

I am trying to add Tabs. So this is the code I wrote:

async function TabContent(props) {
  const formattedCode = await format(props.code, props.lang);
  return <Code.Pre {...props} code={formattedCode} />
}

If I console log the formattedCode, I'm getting the correct formatting but it is showing the unformatted code in the browser. Am I missing something ??