ui: Create Routing Configurations route and page (#10835)
This commit is contained in:
parent
247397dcd2
commit
98b3e7c412
|
@ -0,0 +1,3 @@
|
|||
```release-note:feature
|
||||
ui: Create Routing Configurations route and page
|
||||
```
|
|
@ -0,0 +1,20 @@
|
|||
# Consul::Source
|
||||
|
||||
A presentational component for showing a source name. This is a similar component to `Consul::Kind` and `Consul::ExternalSource`, except `Consul::Source` does not relate to a Service.
|
||||
|
||||
```hbs preview-template
|
||||
<Consul::Source @source='Source Name' />
|
||||
```
|
||||
|
||||
### Arguments
|
||||
|
||||
| Argument/Attribute | Type | Default | Description |
|
||||
| --- | --- | --- | --- |
|
||||
| `source` | `string` | | A string to be passed down and displayed as the source name. |
|
||||
|
||||
### See
|
||||
|
||||
- [Template Source Code](./index.hbs)
|
||||
- [Styling Source Code](./index.scss)
|
||||
|
||||
---
|
|
@ -0,0 +1,25 @@
|
|||
<dl class="tooltip-panel">
|
||||
<dt>
|
||||
<span data-test-consul-source class="consul-source">
|
||||
{{@source}}
|
||||
</span>
|
||||
</dt>
|
||||
<dd>
|
||||
<MenuPanel @position="left">
|
||||
<BlockSlot @name="header">
|
||||
{{t "components.consul.source.header"}}
|
||||
</BlockSlot>
|
||||
<BlockSlot @name="menu">
|
||||
<li role="separator">
|
||||
{{t "components.consul.source.menu-title"}}
|
||||
</li>
|
||||
<li role="none" class="docs-link">
|
||||
<a tabindex="-1" role="menuitem" href="{{env 'CONSUL_DOCS_URL'}}/connect/l7-traffic" rel="noopener noreferrer" target="_blank">
|
||||
{{t "components.consul.source.links.documentation"}}
|
||||
</a>
|
||||
</li>
|
||||
</BlockSlot>
|
||||
</MenuPanel>
|
||||
</dd>
|
||||
</dl>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
.consul-source {
|
||||
@extend %pill-200, %frame-gray-600, %p1;
|
||||
}
|
|
@ -205,6 +205,9 @@ export const routes = {
|
|||
},
|
||||
},
|
||||
},
|
||||
'routing-config': {
|
||||
_options: { path: '/routing-config/:name' },
|
||||
},
|
||||
},
|
||||
// Shows a datacenter picker. If you only have one
|
||||
// it just redirects you through.
|
||||
|
|
|
@ -0,0 +1,19 @@
|
|||
import Route from 'consul-ui/routing/route';
|
||||
import { inject as service } from '@ember/service';
|
||||
|
||||
export default class RoutingConfigRoute extends Route {
|
||||
@service('data-source/service') data;
|
||||
|
||||
async model(params) {
|
||||
const dc = this.modelFor('dc').dc.Name;
|
||||
const nspace = this.optionalParams().nspace;
|
||||
const name = params.name;
|
||||
|
||||
return {
|
||||
dc: dc,
|
||||
nspace: nspace,
|
||||
slug: name,
|
||||
chain: await this.data.source(uri => uri`/${nspace}/${dc}/discovery-chain/${params.name}`),
|
||||
};
|
||||
}
|
||||
}
|
|
@ -80,6 +80,7 @@
|
|||
@import 'consul-ui/components/consul/exposed-path/list';
|
||||
@import 'consul-ui/components/consul/external-source';
|
||||
@import 'consul-ui/components/consul/kind';
|
||||
@import 'consul-ui/components/consul/source';
|
||||
@import 'consul-ui/components/consul/intention';
|
||||
@import 'consul-ui/components/consul/lock-session/list';
|
||||
@import 'consul-ui/components/consul/lock-session/form';
|
||||
|
|
|
@ -49,7 +49,8 @@ html[data-route$='edit'] .app-view > header + div > *:first-child {
|
|||
/* needs a top margun :S */
|
||||
%app-view-content .tab-section > *:first-child:not(.filter-bar):not(table),
|
||||
%app-view-content .tab-section > .search-bar + p,
|
||||
%app-view-content .tab-section .consul-health-check-list {
|
||||
%app-view-content .tab-section .consul-health-check-list,
|
||||
%app-view-content .container {
|
||||
margin-top: 1.25em;
|
||||
}
|
||||
.consul-upstream-instance-list,
|
||||
|
|
|
@ -0,0 +1,22 @@
|
|||
{{page-title @model.slug}}
|
||||
|
||||
<AppView>
|
||||
<BlockSlot @name="breadcrumbs">
|
||||
<ol>
|
||||
<li><a data-test-back href={{href-to 'dc.services'}}>All Services</a></li>
|
||||
</ol>
|
||||
</BlockSlot>
|
||||
<BlockSlot @name="header">
|
||||
<h1>
|
||||
{{@model.slug}}
|
||||
</h1>
|
||||
<Consul::Source @source={{t "routes.dc.routing-config.source"}} @withInfo={{true}} />
|
||||
</BlockSlot>
|
||||
<BlockSlot @name="content">
|
||||
<div class="container">
|
||||
<Consul::DiscoveryChain
|
||||
@chain={{@model.chain.Chain}}
|
||||
/>
|
||||
</div>
|
||||
</BlockSlot>
|
||||
</AppView>
|
|
@ -0,0 +1,21 @@
|
|||
@setupApplicationTest
|
||||
Feature: dc / routing-config
|
||||
Scenario: Viewing a routing config
|
||||
Given 1 datacenter model with the value "dc1"
|
||||
When I visit the routingConfig page for yaml
|
||||
---
|
||||
dc: dc1
|
||||
name: virtual-1
|
||||
---
|
||||
Then the url should be /dc1/routing-config/virtual-1
|
||||
Then I don't see status on the error like "404"
|
||||
And the title should be "virtual-1 - Consul"
|
||||
Scenario: Viewing a source pill
|
||||
Given 1 datacenter model with the value "dc1"
|
||||
When I visit the routingConfig page for yaml
|
||||
---
|
||||
dc: dc1
|
||||
name: virtual-1
|
||||
---
|
||||
And I see source
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
import steps from '../steps';
|
||||
|
||||
// step definitions that are shared between features should be moved to the
|
||||
// tests/acceptance/steps/steps.js file
|
||||
|
||||
export default function(assert) {
|
||||
return steps(assert).then('I should find a file', function() {
|
||||
assert.ok(true, this.step);
|
||||
});
|
||||
}
|
|
@ -52,6 +52,7 @@ import consulKvListFactory from 'consul-ui/components/consul/kv/list/pageobject'
|
|||
import index from 'consul-ui/tests/pages/index';
|
||||
import dcs from 'consul-ui/tests/pages/dc';
|
||||
import settings from 'consul-ui/tests/pages/settings';
|
||||
import routingConfig from 'consul-ui/tests/pages/dc/routing-config';
|
||||
import services from 'consul-ui/tests/pages/dc/services/index';
|
||||
import service from 'consul-ui/tests/pages/dc/services/show';
|
||||
import instance from 'consul-ui/tests/pages/dc/services/instance';
|
||||
|
@ -230,4 +231,5 @@ export default {
|
|||
nspace(visitable, submitable, deletable, cancelable, policySelector, roleSelector)
|
||||
),
|
||||
settings: create(settings(visitable, submitable, isPresent)),
|
||||
routingConfig: create(routingConfig(visitable, text)),
|
||||
};
|
||||
|
|
|
@ -0,0 +1,8 @@
|
|||
import { text } from 'ember-cli-page-object';
|
||||
|
||||
export default function(visitable, isPresent) {
|
||||
return {
|
||||
visit: visitable('/:dc/routing-config/:name'),
|
||||
source: text('[data-test-consul-source]'),
|
||||
};
|
||||
}
|
|
@ -0,0 +1,11 @@
|
|||
import { module, test } from 'qunit';
|
||||
import { setupTest } from 'ember-qunit';
|
||||
|
||||
module('Unit | Route | dc/routing-config', function(hooks) {
|
||||
setupTest(hooks);
|
||||
|
||||
test('it exists', function(assert) {
|
||||
let route = this.owner.lookup('route:dc/routing-config');
|
||||
assert.ok(route);
|
||||
});
|
||||
});
|
|
@ -152,3 +152,9 @@ topology-metrics:
|
|||
header: No traffic
|
||||
body: Add "{upstream}" as an explicit upstream of "{downstream}" or set the "{downstream}" proxy to "transparent" mode to enable traffic.
|
||||
action: Documentation
|
||||
source:
|
||||
header: This is not a registered Consul service. It’s a routing configuration that routes traffic to real services in Consul. For more information, read our documentation.
|
||||
menu-title: About Routing Configs
|
||||
links:
|
||||
documentation: Documentation
|
||||
|
||||
|
|
|
@ -42,3 +42,5 @@ dc:
|
|||
header: Transparent proxy mode
|
||||
body: The upstreams listed on this page have been defined in a proxy registration. There may be more upstreams, though, as "transparent" mode is enabled on this proxy.
|
||||
footer: Read the documentation
|
||||
routing-config:
|
||||
source: Routing Configuration
|
||||
|
|
Loading…
Reference in New Issue