Code snippet to configure a swagger instance in react.

swagger.tsx

const Swagger = ({...props}) => {
  useEffect(() => {
    const ui = SwaggerUI({
      dom_id: '#swagger-custom-ui',
      spec: swaggerData,
      displayRequestDuration: true,
      syntaxHighlight: {
        activate: true,
        theme: 'monokai'
      },
      persistAuthorization: true,
      deepLinking: true,
      filter: '',
      docExpansion: 'none',
      showCommonExtensions: true,
    });
    ui.preauthorizeApiKey('api_key', config.api_key);
  }, []);

  return <div id='swagger-custom-ui' {...props} />;
}