docs(swagger-ui-react): hint on usage with Next.js (#8696)

Co-authored-by: Vladimír Gorej <[email protected]>

Refs #7970
Refs #8245

flavors/swagger-ui-react/README.md

@@ -177,6 +177,49 @@ Redirect url given as parameter to the oauth2 provider. Default the url refers t
 ⚠️ This prop is currently only applied once, on mount. Changes to this prop's value will not be propagated to the underlying Swagger UI instance. A future version of this module will remove this limitation, and the change will not be considered a breaking change.
 
 
+## Next.js
+
+When using [Next.js](https://nextjs.org/), following options are available for seamless integration of `swagger-ui-react`:
+
+#### 1. Make sure to enable transpilation for following dependencies `next.config.js`.
+
+```js
+const nextConfig = {
+  transpilePackages: [
+    'swagger-ui-react',
+    'swagger-client',
+    'react-syntax-highlighter',    
+  ],
+}
+```
+or 
+```js
+const withTM = require('next-transpile-modules')([
+  'swagger-ui-react',
+  'swagger-client'
+  'react-syntax-highlighter',  
+]);
+
+const nextConfig = {
+  reactStrictMode: true,
+}
+
+module.exports = withTM(nextConfig);
+```
+
+#### 2. Use dynamic import
+
+```js
+import dynamic from "next/dynamic";
+
+const SwaggerUI = dynamic(import('swagger-ui-react'), {ssr: false})
+
+const Test = () => <SwaggerUI spec={data}/>
+export default Test
+```
+
+More information about Next.js integration can be found in [#7970](https://github.com/swagger-api/swagger-ui/issues/7970) and (#8245)[https://github.com/swagger-api/swagger-ui/issues/8245].
+
 
 ## Limitations