luxolus
/
open-consul
2
0
Fork 0
Code Issues 1 Pull Requests Packages Releases Wiki Activity

ui: Implement EmberTooltips to Upstreams (#7930) 

* Add ember-tooltips addon

* Create Tooltip component with styling and test

* Implement Tooltip into Upstreams
This commit is contained in:
Kenia 2020-05-20 12:43:25 -04:00 committed by John Cowen
parent 85540ca829
commit aad46b31dc
10 changed files with 133 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
ui-v2/app/components/tooltip/index.hbs Normal file
View File

@ -0,0 +1,3 @@
<EmberTooltip @popperContainer=".app-view">
{{yield}}
</EmberTooltip>

5
ui-v2/app/components/tooltip/index.js Normal file
View File

@ -0,0 +1,5 @@
import Component from '@ember/component';
export default Component.extend({
tagName: '',
});

5
ui-v2/app/styles/base/components/tooltip/layout.scss
View File

@ -50,3 +50,8 @@
%tooltip-bottom::after {
bottom: -12px;
}
// Ember Tooltips
.ember-tooltip {
padding: 12px;
}

11
ui-v2/app/styles/base/components/tooltip/skin.scss
View File

@ -24,6 +24,15 @@
border-bottom-width: 18px;
}
%tooltip-bubble {
border-radius: $decor-radius-200;
border-radius: $decor-radius-100;
box-shadow: $decor-elevation-400;
}
// Ember Tooltips
.ember-tooltip {
background-color: $gray-700;
border-radius: $decor-radius-100;
}
.ember-tooltip[x-placement^='top'] .ember-tooltip-arrow {
border-top-color: $gray-700;
}

5
ui-v2/app/styles/core/typography.scss
View File

@ -130,3 +130,8 @@ pre code,
font-size: 16px !important;
}
}
//Ember Tooltip
.ember-tooltip {
font-size: $typo-size-800;
}

11
ui-v2/app/templates/dc/services/instance/proxy.hbs
View File

@ -8,7 +8,7 @@
{{/if}}
{{#if (gt proxy.Proxy.Upstreams.length 0)}}
<section class="proxy-upstreams">
<h3>Upstreams</h3>
<h3> Upstreams</h3>
<ul data-test-proxy-upstreams>
{{#let proxy.Datacenter as |proxyDatacenter|}}
{{#each proxy.Proxy.Upstreams as |item|}}
@ -21,12 +21,18 @@
{{#if (not-eq item.DestinationType 'prepared_query')}}
<li class="nspace">
{{or item.DestinationNamespace 'default'}}
<Tooltip>
Namespace
</Tooltip>
</li>
{{/if}}
{{/if}}
{{#if (and (not-eq item.Datacenter proxyDatacenter) (not-eq item.Datacenter ""))}}
<li class="datacenter">
{{item.Datacenter}}
<Tooltip>
Datacenter
</Tooltip>
</li>
{{/if}}
{{#if (gt item.LocalBindPort 0)}}
@ -37,6 +43,9 @@
@value={{combinedAddress}}
@name="Address"
/>
<Tooltip>
Address
</Tooltip>
</li>
{{/let}}
{{/if}}

6
ui-v2/app/templates/dc/services/show/upstreams.hbs
View File

@ -15,6 +15,9 @@
{{#if (not-eq item.Namespace nspace)}}
<li class="nspace">
{{item.Namespace}}
<Tooltip>
Namespace
</Tooltip>
</li>
{{/if}}
{{/if}}
@ -25,6 +28,9 @@
@value={{item.GatewayConfig.ListenerPort}}
@name="Port"
/>
<Tooltip>
Port
</Tooltip>
</li>
{{/if}}
</ul>

1
ui-v2/package.json
View File

@ -106,6 +106,7 @@
"ember-sinon-qunit": "4.0.1",
"ember-source": "~3.16.0",
"ember-test-selectors": "^4.0.0",
"ember-tooltips": "^3.4.3",
"ember-truth-helpers": "^2.0.0",
"eslint-plugin-ember": "^7.7.2",
"eslint-plugin-node": "^11.0.0",

25
ui-v2/tests/integration/components/tooltip-test.js Normal file
View File

@ -0,0 +1,25 @@
import { module, test } from 'qunit';
import { setupRenderingTest } from 'ember-qunit';
import { render } from '@ember/test-helpers';
import { hbs } from 'ember-cli-htmlbars';
module('Integration | Component | tooltip', function(hooks) {
setupRenderingTest(hooks);
test('it renders', async function(assert) {
// Set any properties with this.set('myProperty', 'value');
// Handle any actions with this.set('myAction', function(val) { ... });
await render(hbs`<Tooltip />`);
assert.equal(this.element.textContent.trim(), '');
// Template block usage:
await render(hbs`
<Tooltip>
</Tooltip>
`);
assert.equal(this.element.textContent.trim(), '');
});
});

64
ui-v2/yarn.lock
View File

@ -3306,7 +3306,7 @@ broccoli-output-wrapper@^3.1.1:
heimdalljs-logger "^0.1.10"
symlink-or-copy "^1.2.0"
broccoli-persistent-filter@^1.1.6, broccoli-persistent-filter@^1.4.3:
broccoli-persistent-filter@^1.1.5, broccoli-persistent-filter@^1.1.6, broccoli-persistent-filter@^1.4.3:
version "1.4.6"
resolved "https://registry.yarnpkg.com/broccoli-persistent-filter/-/broccoli-persistent-filter-1.4.6.tgz#80762d19000880a77da33c34373299c0f6a3e615"
integrity sha512-0RejLwoC95kv4kta8KAa+FmECJCK78Qgm8SRDEK7YyU0N9Cx6KpY3UCDy9WELl3mCXLN8TokNxc7/hp3lL4lfw==
@ -3456,6 +3456,11 @@ broccoli-source@^1.1.0:
resolved "https://registry.yarnpkg.com/broccoli-source/-/broccoli-source-1.1.0.tgz#54f0e82c8b73f46580cbbc4f578f0b32fca8f809"
integrity sha1-VPDoLItz9GWAy7xPV48LMvyo+Ak=
broccoli-source@^2.0.0:
version "2.1.2"
resolved "https://registry.yarnpkg.com/broccoli-source/-/broccoli-source-2.1.2.tgz#e9ae834f143b607e9ec114ade66731500c38b90b"
integrity sha512-1lLayO4wfS0c0Sj50VfHJXNWf94FYY0WUhxj0R77thbs6uWI7USiOWFqQV5dRmhAJnoKaGN4WyLGQbgjgiYFwQ==
broccoli-source@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/broccoli-source/-/broccoli-source-3.0.0.tgz#c7c9ba24505941b72a0244568285bc859f69dfbd"
@ -3494,6 +3499,14 @@ broccoli-stew@^3.0.0:
symlink-or-copy "^1.2.0"
walk-sync "^1.1.3"
broccoli-string-replace@^0.1.2:
version "0.1.2"
resolved "https://registry.yarnpkg.com/broccoli-string-replace/-/broccoli-string-replace-0.1.2.tgz#1ed92f85680af8d503023925e754e4e33676b91f"
integrity sha1-HtkvhWgK+NUDAjkl51Tk4zZ2uR8=
dependencies:
broccoli-persistent-filter "^1.1.5"
minimatch "^3.0.3"
broccoli-templater@^2.0.1:
version "2.0.2"
resolved "https://registry.yarnpkg.com/broccoli-templater/-/broccoli-templater-2.0.2.tgz#285a892071c0b3ad5ebc275d9e8b3465e2d120d6"
@ -5216,6 +5229,26 @@ ember-cli-htmlbars@^4.0.5, ember-cli-htmlbars@^4.0.8, ember-cli-htmlbars@^4.2.2:
strip-bom "^4.0.0"
walk-sync "^2.0.2"
ember-cli-htmlbars@^4.2.0:
version "4.3.1"
resolved "https://registry.yarnpkg.com/ember-cli-htmlbars/-/ember-cli-htmlbars-4.3.1.tgz#4af8adc21ab3c4953f768956b7f7d207782cb175"
integrity sha512-CW6AY/yzjeVqoRtItOKj3hcYzc5dWPRETmeCzr2Iqjt5vxiVtpl0z5VTqHqIlT5fsFx6sGWBQXNHIe+ivYsxXQ==
dependencies:
"@ember/edition-utils" "^1.2.0"
babel-plugin-htmlbars-inline-precompile "^3.0.1"
broccoli-debug "^0.6.5"
broccoli-persistent-filter "^2.3.1"
broccoli-plugin "^3.1.0"
common-tags "^1.8.0"
ember-cli-babel-plugin-helpers "^1.1.0"
fs-tree-diff "^2.0.1"
hash-for-dep "^1.5.1"
heimdalljs-logger "^0.1.10"
json-stable-stringify "^1.0.1"
semver "^6.3.0"
strip-bom "^4.0.0"
walk-sync "^2.0.2"
ember-cli-inject-live-reload@^2.0.2:
version "2.0.2"
resolved "https://registry.yarnpkg.com/ember-cli-inject-live-reload/-/ember-cli-inject-live-reload-2.0.2.tgz#95edb543b386239d35959e5ea9579f5382976ac7"
@ -5941,6 +5974,23 @@ ember-text-measurer@^0.5.0:
dependencies:
ember-cli-babel "^7.1.0"
ember-tooltips@^3.4.3:
version "3.4.3"
resolved "https://registry.yarnpkg.com/ember-tooltips/-/ember-tooltips-3.4.3.tgz#a017de33e53a9b9ca6d38b8c2f829cc3024b8f8b"
integrity sha512-/swhfhodVvpKi6R+tkcqLgS0YTMo3S6Mzb8qtfTneFSz+tBhY/kd/+eI8OIZf9qocpJ9b54dbbqTw5ZBkeZe2g==
dependencies:
broccoli-file-creator "^2.1.1"
broccoli-funnel "^2.0.2"
broccoli-merge-trees "^2.0.0"
broccoli-source "^2.0.0"
broccoli-string-replace "^0.1.2"
ember-cli-babel "^7.13.0"
ember-cli-htmlbars "^4.2.0"
ember-maybe-in-element "^0.4.0"
popper.js "^1.12.5"
resolve "^1.10.1"
tooltip.js "^1.1.5"
ember-truth-helpers@2.1.0, ember-truth-helpers@^2.0.0, ember-truth-helpers@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/ember-truth-helpers/-/ember-truth-helpers-2.1.0.tgz#d4dab4eee7945aa2388126485977baeb33ca0798"
@ -10356,6 +10406,11 @@ pn@^1.1.0:
resolved "https://registry.yarnpkg.com/pn/-/pn-1.1.0.tgz#e2f4cef0e219f463c179ab37463e4e1ecdccbafb"
integrity sha512-2qHaIQr2VLRFoxe2nASzsV6ef4yOOH+Fi9FBOVH6cqeSgUnoyySPZkxzLuzd+RYOQTRpROA0ztTMqxROKSb/nA==
popper.js@^1.0.2, popper.js@^1.12.5:
version "1.16.1"
resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.16.1.tgz#2a223cb3dc7b6213d740e40372be40de43e65b1b"
integrity sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==
portfinder@^1.0.25:
version "1.0.25"
resolved "https://registry.yarnpkg.com/portfinder/-/portfinder-1.0.25.tgz#254fd337ffba869f4b9d37edc298059cb4d35eca"
@ -12420,6 +12475,13 @@ toidentifier@1.0.0:
resolved "https://registry.yarnpkg.com/toidentifier/-/toidentifier-1.0.0.tgz#7e1be3470f1e77948bc43d94a3c8f4d7752ba553"
integrity sha512-yaOH/Pk/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw==
tooltip.js@^1.1.5:
version "1.3.3"
resolved "https://registry.yarnpkg.com/tooltip.js/-/tooltip.js-1.3.3.tgz#2ad0d77bb6776a76e117eac0afcd3c7d3a237121"
integrity sha512-XWWuy/dBdF/F/YpRE955yqBZ4VdLfiTAUdOqoU+wJm6phJlMpEzl/iYHZ+qJswbeT9VG822bNfsETF9wzmoy5A==
dependencies:
popper.js "^1.0.2"
torii@^0.10.1:
version "0.10.1"
resolved "https://registry.yarnpkg.com/torii/-/torii-0.10.1.tgz#caad0a81e82189fc0483b65e68ee28041ad3590f"