With reference to the example in official documentation here, where do I specify the filename of the favicon image when generating it programmatically in Next.js?
// /app/icon.tsx
import { ImageResponse } from 'next/og'
// Route segment config
export const runtime = 'edge'
// Image metadata
export const size = {
width: 32,
height: 32,
}
export const contentType = 'image/png'
// Image generation
export default function Icon() {
return new ImageResponse(
(
// ImageResponse JSX element
<div
style={{
fontSize: 24,
background: 'black',
width: '100%',
height: '100%',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
color: 'white',
}}
>
A
</div>
),
// ImageResponse options
{
/* For convenience, we can re-use the
exported icons size metadata config to
also set the ImageResponse's width and
height. */
...size,
}
)
}
How is it generated? Have I understood this correctly?