Is it possible to configure 'Select a Definition'

[rhodee]

Prerequisites

• [x] I have written a descriptive issue title
• [x] I have searched existing issues to ensure the issue has not already been raised

Issue

In spring the swagger docs are capable of supporting multiple definitions which results in a nav bar experience like this:

The Topbar plugin manages this.

I am using a static mode configuration, is it possible to create the same topbar experience using swagger-ui for the v4 experience?

[Eomm]

Yes, but it would require to tweak this file: https://github.com/fastify/fastify-swagger-ui/blob/main/lib/swagger-initializer.js

Reference:

• https://stackoverflow.com/a/44819386/3309466

[rhodee]

@Eomm thank you for your feedback. I work on a team that uses static mode and dynamic generation. We all rely on the same instance of the fastify-swagger-ui plugin. Is there a possibility the plugin can support, in static mode, an array similar to the link you shared? I understand there is complexity doing this in dynamic mode and may need more time to develop an API.

Yes, but it would require to tweak this file: https://github.com/fastify/fastify-swagger-ui/blob/main/lib/swagger-initializer.js

I see the uiConfig object appears to be the right place to pass the urls object, to match the code below:

window.onload = function() {
  // Build a system
  const ui = SwaggerUIBundle({
    urls: [
      {url: "https://path/to/api1.yaml", name: "API One"},
      {url: "https://path/to/api2.yaml", name: "API Two"},
    ],
    "urls.primaryName": "API Two"  // default document (if other than the first)
    ...
  })

Is this what you meant by tweaking the file @Eomm

[Uzlopak]

But we dont need to tweak anything?

You can pass uiConfig directly at plugin registration and it will be passed through to the plugin. Or am I missing something?

Here I modified static-yaml-file.js from the examples folder. The same works for dynamic.

And then I see this:

'use strict'

const Fastify = require('fastify')

  ; (async () => {
  const fastify = Fastify({ logger: true })

  await fastify.register(require('@fastify/swagger'), {
    mode: 'static',
    specification: {
      path: './examples/example-static-specification.yaml',
    },
  })

  await fastify.register(require('../index'), {
    uiConfig: {
      urls: [
        {
          url: 'https://petstore.swagger.io/v2/swagger.json',
          name: 'Petstore API 1',
        },
        {
          url: 'https://petstore.swagger.io/v2/swagger.json',
          name: 'Petstore API 2',
        },
      ],
    }
  })

  fastify.listen({ port: 3000 }, (err, addr) => {
    if (err) throw err
    fastify.log.info(`Visit the documentation at ${addr}/documentation/`)
  })
})()