How do I manually order the endpoints displayed on Swagger UI?

Question

I'm using Docket to configure my Swagger 2 instance. But the only Options I currently see are to sort by Type (POST, GET, etc.) or by endpoint name (a-z).

There is a logical order to my endpoints and I'd like to display them in that order

What I want:

POST /start
POST /uplaod
POST /finalize
POST /checkStatus

Instead I get something like this:

POST /checkStatus
POST /finalize
POST /start
POST /upload

Code:

    @Bean
    public Docket api() {
        return new Docket(DocumentationType.SWAGGER_2)
                .host(swaggerHost)
                .pathProvider(new RelativePathProvider(servletContext) {

                    @Override
                    public String getApplicationBasePath() {
                        return swaggerBasePath;
                    }
                })
                .select()
                .apis(RequestHandlerSelectors.withClassAnnotation(Api.class))
                .build()
                .apiInfo(apiInfo())
                .securitySchemes(Collections.singletonList(securitySchema()))
                .securityContexts(Collections.singletonList(securityContext()));
    }

This might be a duplicate of https://stackoverflow.com/q/41801387/8929501 — Matt Berteaux, Aug 16 '19 at 17:16
Did you see this answer? https://stackoverflow.com/a/52760718/8929501 That answer states that you can use `operationOrdering()` to manually order — Matt Berteaux, Aug 16 '19 at 17:20
That sorts it alphabetically by method name, not by a manual order. — user11058144, Aug 16 '19 at 17:32
Additional clarification, "method" in this context is POST/GET/etc. it is not the Java method name. — user11058144, Aug 16 '19 at 17:36
You will have to implement your custom ordering inside that `public int compare(Operation left, Operation right)` method. It's similar to implementing a sort order with the `compareTo` of `Comparable` — Matt Berteaux, Aug 16 '19 at 17:36
I started to try that, but it didn't appear to have the endpoint names readily available to use for ordering. Do you happen to know which `left.methodNameHere()` would have that info? — user11058144, Aug 16 '19 at 17:38

score 2 · Answer 1 · answered Mar 30 '22 at 10:08

Sorting operations in Swagger UI - Sort by specific http verb order, then by path

operationsSorter: function (a, b) {
          const order = {
              'get': '0', 'post': '1', 'patch': '2', 'put': '3', 'delete': '4',
              'head': '5', 'options': '6', 'connect': '7', 'trace': '8'
          };
          return (
              order[a.get("method")].localeCompare(order[b.get("method")])
              || a.get("path").localeCompare(b.get("path"))
          );
}

CharlesA · Answer 2 · 2021-04-09T03:54:39.940

-1

An easy way to order the endpoints for swagger UI is to use tags: https://swagger.io/docs/specification/grouping-operations-with-tags/

Edit: adding the alternative I use to address a comment below: I tend to use the operationsSorter with a custom comparison function. Example:

operationsSorter: function (a, b) {
  var order = {'get': '0', 'post': '1', 'patch': '2', 'put': '3', 'delete': '4'};
  if (a.get('path') == b.get('path')) {
    return order[a.get('method')].localeCompare(order[b.get('method')]);
  }
  if (a.get('path').split('/').length == b.get('path').split('/').length) {
    return a.get('path').split('/').slice(-1)[0].localeCompare(b.get('path').split('/').slice(-1)[0]);
  }
  return a.get('path').split('/').length - b.get('path').split('/').length;
}

edited Apr 09 '21 at 03:54

answered Jun 08 '20 at 00:31

CharlesA

4,260
2
25
31

1

And how do you sort the endpoints inside the tag? E.g. what if you have 10 endpoints with same tag - how are those sorted? – Stijn V Apr 07 '21 at 15:08
@StijnV have added a comment above – CharlesA Apr 09 '21 at 03:50

How do I manually order the endpoints displayed on Swagger UI?

What I want:

Instead I get something like this:

Code:

2 Answers2