nexmo-oas-renderer 2.1.0 → 2.3.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 5b5e0e8b5fa6f2398fce6e27b89653e00b1b6cf7b2fc0b89b00e466c59ff7010
-  data.tar.gz: 899fd7a44676aef146f525466edb0bf0bcccd49accd2d4ebb04f21fb06f2318f
+  metadata.gz: e03a9fd43494edf725f3fa2ff814fdc7179aca5a0757137cee1062f9464ee158
+  data.tar.gz: 64b5fd5577bb7e1c7f0bb7b156e7f6eaf9360461d1e676eeec1adf237a56ed6a
 SHA512:
-  metadata.gz: dea762339636ed621dbf8b44267fb6eeee6be97d8f20be236193ff2d8bdfc9e432cca22ec30ed150fa78c8f97d9e318ecc3ab1263c23f47bb54601f65edee995
-  data.tar.gz: 8decb45d42b106fc52bc46e9f4575f2b58f4273e7d425ff9478259cb0c1ffd4603156957998abbb15d94515060f05e96a52960051dffc59610df8048ffd59dee
+  metadata.gz: c72918d4cc110e29cf09374336f14158fcf974beb435990abf7a0499aaa6293a6b315bdc4daca0700a6508eaf4938e62e3ac6021082e88ae96bc02b32b2002ab
+  data.tar.gz: c265eb36b5b81ceaf227c619518c7642b63f175dd84ff28f6184caab09ab37ebe787558aa8d72d9587d963b48af8ae9e74bc0a642fcb528923571b2fef49a094

data/.github/workflows/pull_request-review.yml

@@ -0,0 +1,14 @@
+name: Review App
+on:
+  pull_request_target:
+    types: [opened, reopened, synchronize, labeled, closed]
+jobs:
+  create-review-app:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Create Review App
+        uses: mheap/github-action-pr-heroku-review-app@v1
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          HEROKU_PIPELINE_ID: ${{ secrets.HEROKU_PIPELINE_ID }}
+          HEROKU_API_TOKEN: ${{ secrets.HEROKU_API_TOKEN }}

data/CHANGELOG.md

@@ -1,3 +1,6 @@
+# 2.2.0
+* Add error list to API reference
+
 # 0.11.3
 * Change oas url constructor to be entire config parameter and not only partial
 * Bump websocket-extensions, fixes CVE-2020-7663

data/Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    nexmo-oas-renderer (2.1.0)
+    nexmo-oas-renderer (2.3.0)
       activemodel (~> 6.0)
       activesupport (~> 6.0)
       banzai (~> 0.1.2)
@@ -109,7 +109,7 @@ GEM
       hansi (~> 0.2.0)
       mustermann (= 1.1.1)
     neatjson (0.9)
-    nexmo_markdown_renderer (0.4.0)
+    nexmo_markdown_renderer (0.4.2)
       activemodel (~> 6.0)
       banzai (~> 0.1.2)
       i18n (~> 1.7)
@@ -136,9 +136,9 @@ GEM
     parallel (1.19.2)
     parser (2.7.1.4)
       ast (~> 2.4.1)
-    public_suffix (4.0.5)
+    public_suffix (4.0.6)
     rack (2.2.3)
-    rack-protection (2.0.8.1)
+    rack-protection (2.1.0)
       rack
     rack-test (1.1.0)
       rack (>= 1.0, < 3)
@@ -210,10 +210,10 @@ GEM
       rb-inotify (~> 0.9, >= 0.9.7)
     shotgun (0.9.2)
       rack (>= 1.0)
-    sinatra (2.0.8.1)
+    sinatra (2.1.0)
       mustermann (~> 1.0)
-      rack (~> 2.0)
-      rack-protection (= 2.0.8.1)
+      rack (~> 2.2)
+      rack-protection (= 2.1.0)
       tilt (~> 2.0)
     sprockets (4.0.2)
       concurrent-ruby (~> 1.0)

data/Procfile

@@ -0,0 +1 @@
+web: bundle exec ./exe/nexmo-oas-renderer

data/app.json

@@ -0,0 +1,15 @@
+{
+  "buildpacks": [{ "url": "heroku/ruby" }],
+  "env": {
+    "RACK_ENV": "production",
+    "RAILS_ENV": "production",
+    "OAS_PATH": "samples"
+  },
+  "stack": "heroku-18",
+  "formation": {
+    "web": {
+      "quantity": 1,
+      "size": "free"
+    }
+  }
+}

data/lib/nexmo/oas/renderer/app.rb

@@ -13,6 +13,7 @@ require_relative './presenters/open_api_specification'
 require_relative './presenters/navigation'
 require_relative './presenters/request_body_raw'
 require_relative './presenters/response_tabs'
+require_relative './presenters/content_switcher'
 require_relative './helpers/render'
 require_relative './helpers/navigation'
 require_relative './helpers/summary'

data/lib/nexmo/oas/renderer/presenters/content_switcher.rb

@@ -0,0 +1,47 @@
+# frozen_string_literal: true
+
+module Nexmo
+  module OAS
+    module Renderer
+      module Presenters
+        class ContentSwitcher
+          def initialize(format:, label:, theme_light:, force_type: nil)
+            @format = format
+            @panels = []
+            @label = label
+            @force_type = force_type
+            @theme_light = theme_light
+          end
+
+          def add_content(title:, content:, tab_id:, active:)
+            @panels.push({
+                             'title' => title,
+                             'content' => content,
+                             'x-tab-id' => tab_id,
+                             'active' => active,
+                         })
+          end
+
+          def render
+            type = 'tabs'
+            type = 'dropdown' if @panels.length >= 8
+
+            type = @force_type if @force_type
+
+            [:"open_api/content_switcher/_#{type}", locals: {
+                panels: @panels,
+                format: @format,
+                label: @label,
+                switcher: self,
+                theme_light: @theme_light,
+            }]
+          end
+
+          def id
+            @id ||= "s-#{SecureRandom.hex}"
+          end
+        end
+      end
+    end
+  end
+end

data/lib/nexmo/oas/renderer/presenters/response_tabs.rb

@@ -8,7 +8,7 @@ module Nexmo
     module Renderer
       module Presenters
         class ResponseTabs
-          attr_reader :format
+          attr_reader :format, :switcher
 
           def initialize(format, response, content, endpoint, theme_light: nil)
             @format   = format
@@ -16,6 +16,7 @@ module Nexmo
             @content  = content
             @endpoint = endpoint
             @theme_light = theme_light
+            @switcher ||= @response.schema(@format)['x-switcher']
           end
 
           def tab_links

data/lib/nexmo/oas/renderer/public/assets/javascripts/nexmo-oas-renderer.js

@@ -1,4 +1,9 @@
-if(document.querySelector(".oas-wrapper")){
+document.addEventListener("DOMContentLoaded", function() {
+  // Only run this JS on OAS pages
+  if(!document.querySelector(".oas-wrapper")){
+    return;
+  }
+
   if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
     var queryString = new URLSearchParams(window.location.search);
     if (!queryString.get('theme')) {
@@ -7,59 +12,64 @@ if(document.querySelector(".oas-wrapper")){
     }
   }
 
-  document.addEventListener("DOMContentLoaded", function() {
-    // Handle people clicking on oneOf tabs by changing every one on the page
-    var oneOfTabs = document.querySelectorAll('[data-tab-link]');
-    Array.from(oneOfTabs).forEach(function (element) {
-      element.addEventListener('click', function (event) {
-        var link = event.target.getAttribute('data-tab-link');
-        var matchingTabs = document.querySelectorAll('[data-tab-link="' + link + '"]');
-        Array.from(matchingTabs).forEach(function (element) {
-          element.dispatchEvent(new Event('toggle'));
-        });
+  // Handle people clicking on oneOf tabs by changing every one on the page
+  var oneOfTabs = document.querySelectorAll('[data-tab-link]');
+  Array.from(oneOfTabs).forEach(function (element) {
+    element.addEventListener('click', function (event) {
+      var link = event.target.getAttribute('data-tab-link');
+      var matchingTabs = document.querySelectorAll('[data-tab-link="' + link + '"]');
+      Array.from(matchingTabs).forEach(function (element) {
+        element.dispatchEvent(new Event('toggle'));
+
+        // Switch anything that's in a dropdown
+        if (element.parentNode.className.indexOf("Vlt-dropdown__panel__content") !== -1) {
+          // This is *very* structure dependent, but also the most compatible way to handle it
+          var panel = element.parentNode.parentNode;
+          var titleNodes = Array.from(panel.previousSibling.previousSibling.firstChild.childNodes);
+          titleNodes[1].textContent = element.textContent;
+        }
       });
     });
+  });
 
-    var toggleTopNav = function(event, closeOnly) {
+  var toggleTopNav = function(event, closeOnly) {
 
-      if (event) {
-        if (!Array.from(event.target.classList).includes("oas-trigger")) {
-          return;
-        }
-      }
-
-      var c = document.querySelector('.oas-trigger-content');
-      if (closeOnly === true) {
-        c.style.display = "none";
+    if (event) {
+      if (!Array.from(event.target.classList).includes("oas-trigger")) {
         return;
       }
-      c.style.display = c.style.display == 'block' ? 'none' : "block";
-    };
+    }
 
-    if (document.querySelector('.oas-trigger')) {
-      document.querySelector('.oas-trigger').addEventListener("click", toggleTopNav);
+    var c = document.querySelector('.oas-trigger-content');
+    if (closeOnly === true) {
+      c.style.display = "none";
+      return;
     }
+    c.style.display = c.style.display == 'block' ? 'none' : "block";
+  };
+
+  if (document.querySelector('.oas-trigger')) {
+    document.querySelector('.oas-trigger').addEventListener("click", toggleTopNav);
+  }
 
-    document.querySelectorAll('a').forEach((element) => {
-      var href = element.getAttribute("href");
-      if (!href){ return; }
-      if (href.slice(0,1) !== "#"){ return; }
-      element.addEventListener('click', function (event) {
-        event.preventDefault();
+  document.querySelectorAll('a').forEach((element) => {
+    var href = element.getAttribute("href");
+    if (!href){ return; }
+    if (href.slice(0,1) !== "#"){ return; }
+    element.addEventListener('click', function (event) {
+      event.preventDefault();
 
-        toggleTopNav(null, true);
+      toggleTopNav(null, true);
 
-        var to = document.querySelector(event.target.hash)
-        history.pushState({}, '', event.target.href);
-        window.scrollTo({
-          top: (window.scrollY + to.getBoundingClientRect().y) - 70,
-          left: 0,
-        })
+      var to = document.querySelector(event.target.hash)
+      history.pushState({}, '', event.target.href);
+      window.scrollTo({
+        top: (window.scrollY + to.getBoundingClientRect().y) - 70,
+        left: 0,
+      })
 
 
-      });
     });
-
   });
-}
+});
 

data/lib/nexmo/oas/renderer/public/assets/javascripts/volta.dropdown.js

@@ -0,0 +1,145 @@
+/**
+ * Copyright (c) 2001-present, Vonage.
+ *
+ * Dropdowns (requires core)
+ */
+
+'use strict';
+
+Volta.dropdown = function () {
+	var _class = {
+		wrapper: 'Vlt-dropdown',
+		block: 'Vlt-dropdown__block',
+		btn: 'Vlt-dropdown__trigger',
+		btnLegacy: 'Vlt-dropdown__btn',
+		dismissed: 'Vlt-callout--dismissed',
+		expanded: 'Vlt-dropdown--expanded',
+		label: 'Vlt-dropdown__label',
+		link: 'Vlt-dropdown__link',
+		noCloseLink: 'Vlt-dropdown__link--noclose',
+		noCloseBlock: 'Vlt-dropdown__block--noclose',
+		panel: 'Vlt-dropdown__panel',
+		panelContent: 'Vlt-dropdown__panel__content',
+		selection: 'Vlt-dropdown__selection',
+		switch: 'Vlt-switch',
+		switchSlider: 'Vlt-switch__slider'
+	}
+
+	function Dropdown() {}
+
+	Dropdown.prototype = {
+		init: function(element, supressClickHandler) {
+			this.dropdown = element;
+			this.selection = this.dropdown.querySelector('.' + _class.selection);
+			this.isSelectionVisible = !!this.selection;
+			this.btn = this.dropdown.querySelector('.' + _class.btn) || this.dropdown.querySelector('.' + _class.btnLegacy);
+			this._suppress = supressClickHandler;
+
+			if(!this._suppress) {
+				this._addEventListener();
+			}
+		},
+		_addEventListener: function(){
+			var openHandler = this.open.bind(this);
+			this.dropdown.addEventListener('click', openHandler, { once: true })
+		},
+		close: function(text) {
+			if(text) {
+				this._setDropdownSelectionText(text);
+			}
+			this.dropdown.classList.remove(_class.expanded);
+
+			if(!this._suppress){
+				this._addEventListener();
+			}
+
+		},
+		_closeEventHandler: undefined,
+		_closeEvent: function(e) {
+			var targetIsPanel = Volta._hasClass(e.target, _class.panel);
+			var parentIsPanel = Volta._closest(e.target, '.' + _class.panelContent, _class.panel) !== null;
+			var parentLink = Volta._closest(e.target, '.' + _class.link, _class.wrapper);
+			var parentIsLink = parentLink && parentLink.length === 1;
+			var isSwitchSlider = Volta._hasClass(e.target, _class.switchSlider);
+			var isParentSwitch = Volta._closest(e.target,'.' + _class.switch, _class.link);
+			var isNoClose = Volta._hasClass(e.target, _class.noCloseLink) || Volta._hasClass(e.target, _class.noCloseBlock);
+			var isNoCloseParent = Volta._closest(e.target,'.' + _class.noCloseLink, _class.link) || Volta._closest(e.target,'.' + _class.noCloseBlock, _class.noCloseBlock);
+			var isInput = e.target instanceof HTMLInputElement;
+
+			if(!targetIsPanel && !parentIsPanel && !parentIsLink && !isNoClose && !isInput && !isNoCloseParent) {
+				e.preventDefault();
+				e.stopPropagation();
+			}
+
+			if(isSwitchSlider || isParentSwitch || isNoClose || isInput || isNoCloseParent) {
+				return null;
+			}
+
+			var text;
+			if(parentIsPanel && Volta._hasClass(e.target, _class.label)) {
+				text = e.target.innerHTML;
+			} else if (parentIsPanel) {
+				var label = e.target.querySelector('.' + _class.label);
+				if(label) {
+					text = label.innerHTML;
+				}
+			}
+
+			this.close(text);
+
+			document.querySelector('body').removeEventListener('click', this._closeEventHandler );
+		},
+		open: function(event) {
+			if(event) {
+				event.preventDefault();
+				event.stopPropagation();
+			}
+
+			this.dropdown.classList.add(_class.expanded);
+
+			if(!this._suppress){
+				this._closeEventHandler = this._closeEvent.bind(this);
+				document.querySelector('body').addEventListener('click', this._closeEventHandler );
+			}
+		},
+		_setDropdownSelectionText: function(text) {
+			if(this.isSelectionVisible) {
+				this.selection.innerText = text;
+			} else {
+				this.btn.innerText = text;
+				this.btn.value = text;
+			}
+		},
+		_suppress: false
+	}
+
+	return {
+		create: create,
+		init: attachDropdownHandlers
+	}
+
+	/**
+	 *	@public
+	 *
+	 *	@description Attach a listeners to dropdowns
+	 */
+	function attachDropdownHandlers() {
+		document.querySelectorAll('.' + _class.wrapper).forEach(attachHandler);
+
+		function attachHandler(dropdown) {
+			create(dropdown);
+		}
+	}
+
+	/**
+	 *	@private
+	 *
+	 *	@description Create a dropdown element
+	 *  @param {HTMLElement} element
+ 	 */
+	function create(element){
+		var dropdown = Object.create(Dropdown.prototype, {})
+		dropdown.init(element);
+		return dropdown;
+	}
+}();

data/lib/nexmo/oas/renderer/version.rb

@@ -3,7 +3,7 @@
 module Nexmo
   module OAS
     module Renderer
-      VERSION = '2.1.0'
+      VERSION = '2.3.0'
     end
   end
 end

data/lib/nexmo/oas/renderer/views/layouts/_javascripts.erb

@@ -5,10 +5,11 @@
 <script src="/assets/javascripts/volta.accordion.js"></script>
 <script src="/assets/javascripts/volta.tabs.js"></script>
 <script src="/assets/javascripts/volta.modal.js"></script>
+<script src="/assets/javascripts/volta.dropdown.js"></script>
 <script src="/assets/javascripts/volta.tooltip.js"></script>
 <script src="/assets/javascripts/nexmo-oas-renderer.js?a=1"></script>
 <script src="/assets/javascripts/components/format.js"></script>
 <script type="text/javascript">
-  Volta.init(["accordion", "tab", "modal", "tooltip"]);
+  Volta.init(["accordion", "tab", "modal", "tooltip", "dropdown"]);
   new Format
 </script>

data/lib/nexmo/oas/renderer/views/open_api/_errors.erb

@@ -0,0 +1,34 @@
+<% if definition.raw['x-errors'] %>
+    <div>
+        <div class="Vlt-grid">
+            <div class="Vlt-col oas-left-panel" style="padding-bottom: 36px;">
+                <h2 id="errors">Errors</h2>
+                <p>
+                  The following is a non-exhaustive list of error codes that may occur while using this API. These codes are in addition to any of our <a href="/api-errors">generic error codes</a>.
+                </p>
+            </div>
+            <div class="Vlt-col oas-right-panel"></div>
+        </div>
+        <div class="Vlt-grid">
+            <div class="Vlt-col Vlt-table oas-left-panel">
+                <table>
+                    <thead>
+                        <tr>
+                            <th>Code</th>
+                            <th>Details</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                    <% definition.raw['x-errors'].each do |name, body| %>
+                        <tr>
+                          <td><a href="/api-errors/<%= @specification.definition_name %>#<%= name %>"><b><%= name %></b></a></td>
+                            <td><%= body['description'].render_markdown %> </td>
+                        </tr>
+                    <% end %>
+                    </tbody>
+                </table>
+            </div>
+            <div class="Vlt-col oas-right-panel"></div>
+        </div>
+    </div>
+<% end %>

data/lib/nexmo/oas/renderer/views/open_api/_header.erb

@@ -39,6 +39,20 @@
       </div>
     </div>
 
+
+    <% if @specification.groups.size > 1 %>
+      <h4>Jump to:</h4>
+      <div style="margin-bottom: 30px; padding: 8px;">
+      <% @specification.groups.each do |name, endpoints| %>
+        <% if name %>
+          <% group = definition.raw['tags'].detect { |tag| tag['name'].capitalize == name.capitalize } %>
+          <p><a href="#<%= group['name'].parameterize %>"><%= group['name'] %> &raquo;</a></p>
+          <p class="Vlt-grey-darker"><%= group['description']&.render_markdown %></p>
+        <% end %>
+      <% end %>
+      </div>
+    <% end %>
+
     <%
       # If there's only one group, everything is untagged
       if @specification.groups.size === 1

data/lib/nexmo/oas/renderer/views/open_api/_navigation.erb

@@ -13,6 +13,9 @@
     <a href="#webhooks" class="Vlt-btn Vlt-btn--tertiary group-link">Webhooks</a>
   <% end %>
 
+  <% if definition.raw['x-errors'] %>
+    <a href="#errors" class="Vlt-btn Vlt-btn--tertiary group-link">Errors</a>
+  <% end %>
 
   <% if @specification.formats.size > 1 %>
     <div class="Vlt-native-dropdown">
@@ -44,6 +47,10 @@
       <a href="#top" class="Vlt-btn Vlt-btn--tertiary group-link">Available Operations</a>
       <% end %>
 
+      <% if definition.raw['x-errors'] %>
+        <a href="#errors" class="Vlt-btn Vlt-btn--tertiary group-link">Errors</a>
+      <% end %>
+
       <br />
       <br />
 

data/lib/nexmo/oas/renderer/views/open_api/_parameter_groups.erb

@@ -29,14 +29,7 @@
   <% unless endpoint.request_body.exhibits_one_of_multiple_schemas?(format) %>
 
     <%
-      # @mheap: This is hacky handling for allOf, but it works for now
-      # We probably want real allOf support in OasParser, but that's more time than I have right now
-      allOf = endpoint.request_body.content[format]['schema']['allOf']
-      if allOf
-        params = endpoint.request_body.handle_all_of(allOf)
-      else
-        params = endpoint.request_body.properties_for_format(format)
-      end
+      params = endpoint.request_body.properties_for_format(format)
       if params
     %>
 
@@ -46,9 +39,10 @@
 
     <%
       # This can likely be better done as a presenter, but it works for now
-      schema = endpoint.request_body.content[format]['schema']['oneOf']
+      request = endpoint.request_body.content[format]['schema']
+      schema = request['oneOf']
       %>
-      <%= erb :'open_api/_tabbed_parameters', locals: { body: endpoint.request_body, schema: schema, format: format, callback: callback } %>
+      <%= erb :'open_api/_tabbed_parameters', locals: { body: endpoint.request_body, request: request, schema: schema, format: format, callback: callback } %>
     <%
     end
   end

data/lib/nexmo/oas/renderer/views/open_api/_response_tabs.erb

@@ -1,18 +1,16 @@
-<% tabs = Nexmo::OAS::Renderer::Presenters::ResponseTabs.new(format, response, content, endpoint, theme_light: @theme_light) %>
+<%
+  tabs = Nexmo::OAS::Renderer::Presenters::ResponseTabs.new(format, response, content, endpoint, theme_light: @theme_light)
 
-<div class='Vlt-tabs js-format' data-format='<%= tabs.format %>'>
-  <div class='Vlt-tabs__header' role='tablist' aria-label='Responses'>
-    <% tabs.tab_links.each do |link| %>
-      <div role='tab' class='<%= link.css_classes %>' <% if link.data_tab_link %>data-tab-link="<%= link.data_tab_link %>"<% end %>>
-        <%= link.content %>
-      </div>
-    <% end %>
-  </div>
-  <div class='Vlt-tabs__content'>
-    <% tabs.tab_panels.each do |panel| %>
-      <div class='<%= panel.css_classes %>'>
-        <%= erb *panel.content %>
-      </div>
-    <% end %>
-  </div>
-</div>
+  switcher = Nexmo::OAS::Renderer::Presenters::ContentSwitcher.new(label: "Response Example", format: format, force_type: tabs.switcher, theme_light: @theme_light)
+
+  tabs.tab_links.each_with_index do |v,k|
+     switcher.add_content(
+       title: v.content,
+       content: (erb *tabs.tab_panels[k].content),
+       tab_id: v.data_tab_link,
+       active: k == 0
+     )
+  end
+%>
+
+<%= erb *switcher.render %>

data/lib/nexmo/oas/renderer/views/open_api/_responses.erb

@@ -29,22 +29,23 @@
         </div>
       <% end %>
 
-      <% missing.each do |format| %>
-        <div class="js-format Nxd-api__response" data-format="<%= format %>">
-          <div class="Vlt-callout Vlt-callout--warning">
-            <i></i>
-            <div class="Vlt-callout__content">
-              <p>This endpoint does not support <code><%= format %></code></p>
-            </div>
-          </div>
-        </div>
-      <% end %>
-
       <% if response.code == '204' %>
         <% content = response.description ? response.description : 'No content' %>
         <pre class="language-json Vlt-prism--copy-disabled <%= @theme_light ? 'Vlt-prism--dark' : '' %>"><code><%= content %></code></pre>
+      <% else %>
+        <% missing.each do |format| %>
+          <div class="js-format Nxd-api__response" data-format="<%= format %>">
+            <div class="Vlt-callout Vlt-callout--warning">
+              <i></i>
+              <div class="Vlt-callout__content">
+                <p>This endpoint does not support <code><%= format %></code></p>
+              </div>
+            </div>
+          </div>
+        <% end %>
       <% end %>
-    </div>
+
+  </div>
 
   <% end %>
 </div>

data/lib/nexmo/oas/renderer/views/open_api/_tabbed_parameters.erb

@@ -12,8 +12,7 @@
     s
   end
 
-
-  panels = []
+  switcher = Nexmo::OAS::Renderer::Presenters::ContentSwitcher.new(label: "Request Details", format: format, force_type: request['x-switcher'], theme_light: @theme_light)
 
   schemas.each_with_index do |schema, index|
     if schema['properties']
@@ -25,40 +24,21 @@
       end
     end
 
-    panels.push({
-      'description' => schema['title'] || schema['description'],
-      'parameters' => schema['properties'],
-      'oneOf' => schema['oneOf'],
-      'x-tab-id' => schema['x-tab-id'] || schema['title'].parameterize,
-      'active' => index == 0
-    })
+
+    if schema['oneOf']
+      content = (erb :'open_api/_tabbed_parameters', locals: { body: body, request: schema, schema: schema['oneOf'], format: format, callback: callback })
+    else
+      content = (erb :'open_api/_parameters', locals: { parameters: schema['properties'], callback: callback })
+    end
+
+    switcher.add_content(
+      title: schema['title'] || schema['description'],
+      content: content,
+      tab_id: schema['x-tab-id'],
+      active: index == 0
+    )
   end
 %>
 
-<div class="Vlt-tabs js-format" data-format="<%= format %>">
-  <div class="Vlt-tabs__header" role="tablist" aria-label="Responses">
-    <% panels.each do |panel| %>
-      <div role="tab" data-tab-link="<%= panel['x-tab-id'] %>" class="Vlt-tabs__link <%= panel['active'] ? 'Vlt-tabs__link_active' : '' %>">
-        <%= panel['description'] %>
-      </div>
-    <% end %>
-  </div>
-  <div class="Vlt-tabs__content">
-    <% panels.each do |panel| %>
-      <div class="Vlt-tabs__panel <%= panel['active'] ? 'Vlt-tabs__panel_active' : '' %>">
-      <%
-        # Nested oneOf?
-        if panel['oneOf']
-          %>
-          <%= erb :'open_api/_tabbed_parameters', locals: { body: body, schema: panel['oneOf'], format: format, callback: callback } %>
-        <%
-        else
-        %>
-
-        <%= erb :'open_api/_parameters', locals: { parameters: panel['parameters'], callback: callback } %>
-      <% end %>
-      </div>
-    <% end %>
-  </div>
-</div>
+<%= erb *switcher.render %>
 

data/lib/nexmo/oas/renderer/views/open_api/content_switcher/_dropdown.erb

@@ -0,0 +1,22 @@
+<div class="Vlt-dropdown Vlt-dropdown--full-width">
+  <div class="Vlt-dropdown__trigger Vlt-dropdown__trigger--btn"><button class="Vlt-btn Vlt-btn--<%= (theme_light ? "secondary" : "tertiary") %>"><%= label %>: <span class="Vlt-dropdown__selection"><%= panels[0]['title'] %></span></button></div>
+  <div class="Vlt-dropdown__panel">
+    <div data-tab-content="<%= switcher.id %>" class="Vlt-dropdown__panel__content">
+      <% panels.each do |panel| %>
+        <div role="tab" data-tab-link="<%= panel['x-tab-id'] || panel['title'].parameterize %>" class="Vlt-dropdown__link Vlt-dropdown__label Vlt-js-tabs__link"><%= panel['title'] %></div>
+      <% end %>
+    </div>
+  </div>
+</div>
+
+
+<div class="js-format" data-format="<%= format %>">
+  <div id="<%= switcher.id %>" class="Vlt-js-tabs__content">
+    <% panels.each do |panel| %>
+      <div class="Vlt-js-tabs__panel <%= panel['active'] ? 'Vlt-js-tabs__panel_active' : '' %>">
+        <%= panel['content'] %>
+      </div>
+    <% end %>
+  </div>
+</div>
+

data/lib/nexmo/oas/renderer/views/open_api/content_switcher/_tabs.erb

@@ -0,0 +1,18 @@
+<div class="Vlt-tabs js-format" data-format="<%= format %>">
+  <div class="Vlt-tabs__header" role="tablist" aria-label="<%= label %>">
+    <% panels.each do |panel| %>
+      <div role="tab" data-tab-link="<%= panel['x-tab-id'] || panel['title'].parameterize %>" class="Vlt-tabs__link <%= panel['active'] ? 'Vlt-tabs__link_active' : '' %>">
+        <%= panel['title'] %>
+      </div>
+    <% end %>
+  </div>
+  <div class="Vlt-tabs__content">
+    <% panels.each do |panel| %>
+      <div class="Vlt-tabs__panel <%= panel['active'] ? 'Vlt-tabs__panel_active' : '' %>">
+        <%= panel['content'] %>
+      </div>
+    <% end %>
+  </div>
+</div>
+
+

data/lib/nexmo/oas/renderer/views/open_api/show.erb

@@ -21,6 +21,6 @@
     <% end %>
 
     <%= erb :'open_api/_webhooks', locals: { definition: definition } %>
-
+    <%= erb :'open_api/_errors', locals: {definition: definition } %>
   </div>
 </div>

data/nexmo-oas-renderer.gemspec

@@ -25,7 +25,7 @@ Gem::Specification.new do |spec|
   # Specify which files should be added to the gem when it is released.
   # The `git ls-files -z` loads the files in the RubyGem that have been added into git.
   spec.files = Dir.chdir(File.expand_path(__dir__)) do
-    `git ls-files -z`.split("\x0").reject { |f| f.match(%r{^(test|spec|features)/}) }
+    `git ls-files -z`.split("\x0").reject { |f| f.match(%r{^(test|spec|features|samples)/}) }
   end
   spec.bindir        = 'exe'
   spec.executables   = spec.files.grep(%r{^exe/}) { |f| File.basename(f) }

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: nexmo-oas-renderer
 version: !ruby/object:Gem::Version
-  version: 2.1.0
+  version: 2.3.0
 platform: ruby
 authors:
 - Fabian Rodriguez
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2020-07-20 00:00:00.000000000 Z
+date: 2020-10-14 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: activemodel
@@ -243,6 +243,7 @@ extensions: []
 extra_rdoc_files: []
 files:
 - ".env.example"
+- ".github/workflows/pull_request-review.yml"
 - ".github/workflows/push-docker-publish.yml"
 - ".gitignore"
 - ".rspec"
@@ -254,8 +255,10 @@ files:
 - Gemfile
 - Gemfile.lock
 - LICENSE.txt
+- Procfile
 - README.md
 - Rakefile
+- app.json
 - bin/console
 - bin/setup
 - exe/nexmo-oas-renderer
@@ -271,6 +274,7 @@ files:
 - lib/nexmo/oas/renderer/helpers/summary.rb
 - lib/nexmo/oas/renderer/helpers/url.rb
 - lib/nexmo/oas/renderer/presenters/api_specification.rb
+- lib/nexmo/oas/renderer/presenters/content_switcher.rb
 - lib/nexmo/oas/renderer/presenters/endpoint.rb
 - lib/nexmo/oas/renderer/presenters/groups.rb
 - lib/nexmo/oas/renderer/presenters/navigation.rb
@@ -300,6 +304,7 @@ files:
 - lib/nexmo/oas/renderer/public/assets/javascripts/tooltip.min.js
 - lib/nexmo/oas/renderer/public/assets/javascripts/volta.accordion.js
 - lib/nexmo/oas/renderer/public/assets/javascripts/volta.core.js
+- lib/nexmo/oas/renderer/public/assets/javascripts/volta.dropdown.js
 - lib/nexmo/oas/renderer/public/assets/javascripts/volta.modal.js
 - lib/nexmo/oas/renderer/public/assets/javascripts/volta.tabs.js
 - lib/nexmo/oas/renderer/public/assets/javascripts/volta.tooltip.js
@@ -348,6 +353,7 @@ files:
 - lib/nexmo/oas/renderer/views/open_api/_callbacks.erb
 - lib/nexmo/oas/renderer/views/open_api/_code_examples.erb
 - lib/nexmo/oas/renderer/views/open_api/_endpoint.erb
+- lib/nexmo/oas/renderer/views/open_api/_errors.erb
 - lib/nexmo/oas/renderer/views/open_api/_header.erb
 - lib/nexmo/oas/renderer/views/open_api/_model.erb
 - lib/nexmo/oas/renderer/views/open_api/_navigation.erb
@@ -365,6 +371,8 @@ files:
 - lib/nexmo/oas/renderer/views/open_api/_tabbed_parameters.erb
 - lib/nexmo/oas/renderer/views/open_api/_tabbed_single_parameter.erb
 - lib/nexmo/oas/renderer/views/open_api/_webhooks.erb
+- lib/nexmo/oas/renderer/views/open_api/content_switcher/_dropdown.erb
+- lib/nexmo/oas/renderer/views/open_api/content_switcher/_tabs.erb
 - lib/nexmo/oas/renderer/views/open_api/show.erb
 - lib/nexmo/oas/renderer/views/static/404.erb
 - nexmo-oas-renderer.gemspec