ServerSelector

Domain · API Doc

Dropdown for selecting the active API server, with environment badges (production, staging, development, sandbox).

Preview

https://api.commerce.io/v2

Production

production

Code

<%- include('modules/domain/api-doc/ServerSelector', {
  servers: [
    { serverId: 'srv-prod', url: 'https://api.commerce.io/v2', description: 'Production', environment: 'production' },
    { serverId: 'srv-stg',  url: 'https://staging-api.commerce.io/v2', description: 'Staging', environment: 'staging' },
  ]
}) %>

<%
  var _servers  = locals.servers || [];
  var _value    = locals.value   || (_servers[0] && _servers[0].serverId) || '';
  if (!_servers.length) { return; }

  var envVariant = {
    production:  'success',
    staging:     'warning',
    development: 'info',
    sandbox:     'neutral',
  };

  var active = _servers.find(function(s) { return s.serverId === _value; }) || _servers[0];
  var _ssid = 'ss_' + Math.random().toString(36).slice(2, 10);
%>

  

  
  
    <% _servers.forEach(function(server) {
      var selected = server.serverId === active.serverId;
    %>
    
      
        <%= server.url %>
        <% if (server.description) { %>
          <%= server.description %>
        <% } %>
      
      <% if (server.environment) { %>
        
          <%- include('../../ui/Badge', { variant: envVariant[server.environment] || 'neutral', size: 'sm', children: server.environment }) %>
        
      <% } %>
    
    <% }); %>

ServerSelector

Production selected