nexmo-oas-renderer 2.2.0 → 2.3.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 1a463231ba72ba74bc9a6555449eb2d2cba6155c32a2506235b04b8bf332678b
-  data.tar.gz: 9c8ed923712ff7e677c6f36b532e77fb41ef6120057d52635f7b1a892102aacc
+  metadata.gz: e03a9fd43494edf725f3fa2ff814fdc7179aca5a0757137cee1062f9464ee158
+  data.tar.gz: 64b5fd5577bb7e1c7f0bb7b156e7f6eaf9360461d1e676eeec1adf237a56ed6a
 SHA512:
-  metadata.gz: b3e4c30d89a5cc22fd66491751235b49d4b56a5a63ce8e9a3d303e8c4989f5e3a47cc8964c5d78b6cc4f1d33467e1ca83065a00e399fcfc076607a81633b7c3e
-  data.tar.gz: df6590d1e2de8eb3771dcec2c0cf3617a7453e81e83a34318989d2f42d0513032dfd5c4a35ea3f991a8d1785f6871f6b800e5fb79a863f4c8890ebff89cd2754
+  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/Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    nexmo-oas-renderer (2.2.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.1)
+    nexmo_markdown_renderer (0.4.2)
       activemodel (~> 6.0)
       banzai (~> 0.1.2)
       i18n (~> 1.7)

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

@@ -20,6 +20,14 @@ document.addEventListener("DOMContentLoaded", function() {
       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;
+        }
       });
     });
   });

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.2.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/_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/_parameter_groups.erb

@@ -39,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/_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/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.2.0
+  version: 2.3.0
 platform: ruby
 authors:
 - Fabian Rodriguez
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2020-09-30 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
@@ -366,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
@@ -390,7 +397,8 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.1.4
+rubyforge_project: 
+rubygems_version: 2.7.6.2
 signing_key: 
 specification_version: 4
 summary: OpenAPI Specification renderer.