CyberCoveLLC/threshold-ui
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: 🤖 remove rose radiocard and styles (#1521)

Browse Source 
chore: 🤖 remove rose radio card and styles
This commit is contained in:
Dharini Jeeva authored and GitHub committed 2022-12-15 09:11:01 -08:00
1 parent ed9e674823
commit 92db4d4947
11 files changed
+46 -544
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

addons/rose/addon/components/rose/form/radio/card/index.js
-25
View File
@@ -1,25 +0,0 @@
import RoseFormRadioRadioComponent from '../radio';
import { deprecate } from '@ember/debug';
export default class RoseFormRadioCardComponent extends RoseFormRadioRadioComponent {
// =attributes
layout = this.args.layout;
className = `rose-form-radio-card ${this.layout}`;
constructor() {
super(...arguments);
deprecate(
`Rose Form/Radio/Card component is deprecated, use HDS Form/RadioCard instead. For more info, refer to `,
false,
{
id: 'rose.form.radio.card',
until: '4.8.0',
for: 'rose',
since: {
enabled: '3.28.8',
},
url: 'https://boundary-ui-storybook.vercel.app/?path=/docs/rose-form-radio-radio-card--card',
}
);
}
}
addons/rose/addon/components/rose/form/radio/card/index.stories.mdx
+4 -82
View File
@@ -1,15 +1,12 @@
import { Meta, Story, Preview } from '@storybook/addon-docs';
import { hbs } from 'ember-cli-htmlbars';
<Meta title="Rose/Form/Radio/Card" component="RadioCard" />
<Meta title="Rose/Form/Radio/Card(removed)" component="RadioCard" />
# HDS::Form::RadioCard (Recommended)
# RadioCard (removed)
> **_NOTE:_** Replaces the deprecated Rose/Form/Radio/Card.
Refer to the [HDS Form::RadioCard
documentation](https://design-system-components-hashicorp.vercel.app/components/form/radio-card)
for a complete overview
Rose/Form/Select has been removed in favor of
[HDS::Form::RadioCard](https://design-system-components-hashicorp.vercel.app/components/form/radio-card).
```handlebars
<Hds::Form::RadioCard @checked={{true}} as |R|>
@@ -44,78 +41,3 @@ export const HDSTemplate = (args) => ({
{HDSTemplate.bind({})}
</Story>
</Preview>
# Rose/Form/Radio/Card (Deprecated)
Rose/Form/Radio/Card has been deprecated in favor of [HDS::Form::RadioCard](https://design-system-components-hashicorp.vercel.app/components/form/radio-card)
### <Rose::Form::Radio::Card> usage:
# Form Radiofield in a wide format
Renders a form radiofield in a Wide format.
```handlebars
<Rose::Form::Radio::Card
@label='Yes'
@error={{false}}
@value='yes-agree'
@selectedValue='yes-agree'
@disabled={{false}}
@changed={{fn}}
@layout='wide'
/>
```
Renders a form radiofield in a tile format.
```handlebars
<Rose::Form::Radio::Card
@label='Yes'
@error={{false}}
@value='yes-agree'
@selectedValue='yes-agree'
@disabled={{false}}
@changed={{fn}}
@layout='tile'
/>
```
export const Template = (args) => ({
template: hbs`
<Rose::Form::Radio::Card
@label={{label}}
@error={{error}}
@value={{value}}
@selectedValue={{selectedValue}}
@disabled={{disabled}}
@icon={{icon}}
@helperText={{helperText}}
@layout={{Layout}}
/>`,
context: args,
});
<Preview>
<Story
name="Rose Card"
height="10rem"
args={{
label: 'Azure',
error: false,
value: 'value and selectedValue must match to select radiofield',
selectedValue: 'value and selectedValue must match to select radiofield',
helperText: 'Record financial transactions using',
disabled: false,
}}
argTypes={{
Layout: {
control: 'inline-radio',
options: ['wide', 'tile'],
name: 'layout',
},
}}
>
{Template.bind({})}
</Story>
</Preview>
addons/rose/addon/components/rose/form/radio/group/index.hbs
-8
View File
@@ -8,13 +8,5 @@
changed=@changed
inline=@inline
)
card=(component
'rose/form/radio/card'
name=@name
selectedValue=@selectedValue
disabled=@disabled
changed=@changed
layout=@layout
)
)
}}
addons/rose/addon/components/rose/form/radio/group/index.stories.mdx
+2 -82
View File
@@ -75,9 +75,9 @@ export const Template = (args) => ({
</Story>
</Preview>
# HDS::Form::RadioCard::Group (Recommended)
# HDS::Form::RadioCard::Group
> **_NOTE:_** Replaces the deprecated Rose/Form/Radio/Group/Card.
> **_NOTE:_** Replaces the removed Rose/Form/Radio/Group/Card.
```handlebars
<Hds::Form::RadioCard::Group
@@ -144,83 +144,3 @@ export const HDSTemplate = (args) => ({
{HDSTemplate.bind({})}
</Story>
</Preview>
# Rose::Form::Radio::Group::Card (Deprecated)
```handlebars
<Rose::Form::Radio::Group
@disabled={{false}}
@name={{name}}
@selectedValue='disagree'
@changed={{fn}}
@inline={{false}}
as |radioGroup|
>
<radioGroup.Card
@label='Agree'
@value='agree'
@layout='tile'
@helperText='dwsd'
/>
<radioGroup.Card
@label='disagree'
@value='disagree'
@layout='tile'
@helperText='dwsd'
/>
<radioGroup.Card
@label='maybe'
@value='maybe'
@layout='tile'
@helperText='dwsd'
/>
</Rose::Form::Radio::Group>
```
export const RoseTemplate = (args) => ({
template: hbs`
<Rose::Form::Radio::Group
@disabled={{disabled}}
@name={{name}}
@selectedValue={{selectedValue}}
@changed={{changed}}
as |radioGroup|
>
<radioGroup.card
@label={{firstFieldLabel}}
@value={{firstFieldValue}}
@icon={{firstFieldIcon}}
/>
<radioGroup.card @label={{secondFieldLabel}} @value={{secondFieldValue}} />
</Rose::Form::Radio::Group>`,
context: args,
});
<Preview>
<Story
name="Rose Basic"
height="10rem"
args={{
name: 'mustagree',
disabled: false,
selectedValue: 'disagree',
firstFieldLabel: 'Agree',
firstFieldValue: 'agree',
secondFieldLabel: 'Disagree',
secondFieldValue: 'disagree',
firstFieldIcon: 'flight-icons/svg/org-16',
}}
argTypes={{
firstFieldIcon: {
control: 'select',
options: [
'flight-icons/svg/org-16',
'flight-icons/svg/clipboard-copy-16',
],
},
changed: { action: 'changed' },
}}
>
{RoseTemplate.bind({})}
</Story>
</Preview>
addons/rose/app/styles/rose/components/form/_index.scss
-1
View File
@@ -6,4 +6,3 @@
@import 'select';
@import 'radio';
@import 'fieldset';
@import 'radio-card';
addons/rose/app/styles/rose/components/form/_radio-card.scss
-240
View File
@@ -1,240 +0,0 @@
@use '../../variables/sizing';
@use '../../utilities/type';
@use '../../variables/typography';
$size-xxl: sizing.rems(xxl); // 48
$size-xl: sizing.rems(xl); // 36
$size-l: sizing.rems(l); // 24
$size-m: sizing.rems(m); // 16
$size-s: sizing.rems(s); // 12
$size-xs: sizing.rems(xs); // 8
$size-xxs: sizing.rems(xxs); // 4
$size-xxxs: sizing.rems(xxxs); // 2
$size-xxxxs: sizing.rems(xxxxs); // 1
$radio-svg: (
'default':
"<svg viewBox='0 0 24 24' fill='%23aaaaaa' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z' /></svg>",
'hover':
"<svg viewBox='0 0 24 24' fill='%236f7682' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z' /></svg>",
'focus':
"<svg viewBox='0 0 24 24' fill='%231563ff' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z' /></svg>",
'checked':
"<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z' fill='%231563ff'/></svg>",
'disabled':
"<svg viewBox='0 0 24 24' fill='%23bac1cc' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z' /></svg>",
'disabled-checked':
"<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z' fill='%23bac1cc'/></svg>",
'error':
"<svg viewBox='0 0 24 24' fill='%23c73445' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z' /></svg>",
'error-checked':
"<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z' fill='%23c73445'/></svg>",
);
.rose-form-radio-card {
$card-wide-width: $size-m * 10;
$card-tile-width: $size-m * 7.25;
$border-width: $size-xxxs * 2;
&.wide {
width: ($size-m) * 20;
}
&.tile {
width: ($size-m) * 15;
.rose-icon {
--size: #{$size-xl};
padding: $size-xxxs;
}
.rose-form-radio-label {
display: flex;
flex-direction: column;
align-items: center;
height: $size-m * 9;
&::after {
left: $card-tile-width - $border-width;
}
}
}
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
margin: $size-m $size-xs $size-m 0;
.radio-card-overlay {
position: absolute;
height: $size-l + $size-xxs;
background-color: var(--ui-gray-subtler-5);
width: 100%;
bottom: 0;
right: 0;
border-bottom-left-radius: $size-xxxs;
border-bottom-right-radius: $size-xxxs;
}
.rose-form-radio-label {
@include type.type(s, bold);
width: ($size-m) * 23;
height: 100%;
display: block;
position: relative;
text-align: left;
border: $size-xxxxs solid var(--ui-gray-subtler-2);
box-shadow: 0 $size-xxs $size-xxs
rgba(var(--stark-components), var(--opacity-2));
border-radius: $size-xxs;
padding: $size-s $size-m ($size-xl + $size-m);
box-sizing: border-box;
.rose-form-helper-text {
@include type.type(xs, normal);
padding-top: $size-xs;
}
&::after {
position: absolute;
bottom: $size-xxs + $size-xxxxs;
right: $card-wide-width - $border-width;
display: block;
width: $size-m;
height: $size-m;
transform: scale(2);
pointer-events: none;
content: ' ';
background: no-repeat 50%/50% 50%;
background-image: url($data-svg-prefix + map-get($radio-svg, 'default'));
}
}
.rose-form-radio-field {
position: absolute;
z-index: 1;
bottom: $size-xs;
opacity: 0;
&:not(:disabled) {
&:focus {
~ .rose-form-radio-label {
&::after {
background-image: url($data-svg-prefix + map-get(
$radio-svg,
'focus'
));
}
}
}
&:hover {
~ .rose-form-radio-label {
border: $size-xxxxs solid var(--ui-gray);
}
}
&:checked {
~ .rose-form-radio-label {
&::after {
background-image: url($data-svg-prefix + map-get(
$radio-svg,
'checked'
));
}
.radio-card-overlay {
background-color: var(--action-subtler-1h);
.ember-application.rose-theme-light & {
background-color: var(--action-subtler-1h);
}
@media (prefers-color-scheme: dark) {
background-color: var(--action-subtler-1);
}
.ember-application.rose-theme-dark & {
background-color: var(--action-subtler-1);
}
}
border: $size-xxxxs solid var(--info-subtler-1);
}
}
}
&:disabled {
~ .rose-form-radio-label {
border: $size-xxxxs solid var(--ui-border-subtler-1);
background-color: var(--ui-gray-subtler-6);
color: var(--ui-gray-starker-1);
&::after {
background-image: url($data-svg-prefix + map-get(
$radio-svg,
'disabled'
));
}
}
&:checked {
~ .rose-form-radio-label {
&::after {
background-image: url($data-svg-prefix + map-get(
$radio-svg,
'disabled-checked'
));
}
}
}
}
}
&.error {
.rose-form-radio-field {
&:not(:disabled, :focus) {
~ .rose-form-radio-label {
color: var(--ui-gray);
border: $size-xxxxs solid var(--failure);
.radio-card-overlay {
background-color: var(--failure-subtler-2);
}
.rose-form-helper-text.error {
color: var(--ui-gray);
}
&::after {
background-image: url($data-svg-prefix + map-get(
$radio-svg,
'error'
));
}
}
&:checked {
~ .rose-form-radio-label {
color: var(--ui-gray);
border: $size-xxxxs solid var(--failure);
.radio-card-overlay {
background-color: var(--failure-subtler-2);
}
&::after {
background-image: url($data-svg-prefix + map-get(
$radio-svg,
'error-checked'
));
}
}
}
}
}
}
}
addons/rose/tests/integration/components/rose/form/radio/card-test.js
-53
View File
@@ -1,53 +0,0 @@
import { module, test } from 'qunit';
import { setupRenderingTest } from 'ember-qunit';
import { render, find } from '@ember/test-helpers';
import hbs from 'htmlbars-inline-precompile';
module('Integration | Component | rose/form/radio/card', function (hooks) {
setupRenderingTest(hooks);
test('it renders', async function (assert) {
await render(hbs`<Rose::Form::Radio::Card />`);
assert.ok(await find('input'));
assert.strictEqual(await find('input').type, 'radio');
});
test('it renders in a tile format when tile layout is applied', async function (assert) {
await render(hbs`<Rose::Form::Radio::Card @layout="tile"/>`);
assert.ok(await find('.tile'));
});
test('it supports an icon', async function (assert) {
await render(
hbs`<Rose::Form::Radio::Card @icon="flight-icons/svg/user-circle-16" />`
);
assert.ok(find('svg'));
});
test('it is checked when @value and @selectedValue values match', async function (assert) {
await render(
hbs`<Rose::Form::Radio::Card @value="tree" @selectedValue="tree"/>`
);
assert.true(await find('input').checked);
});
test('it is not disabled by default', async function (assert) {
await render(hbs`<Rose::Form::Radio::Card />`);
assert.false(await find('input').disabled);
});
test('it is not in error state by default', async function (assert) {
await render(hbs`<Rose::Form::Radio::Card />`);
assert.notOk(await find('.error'));
});
test('it is disabled when @disabled={{true}}', async function (assert) {
await render(hbs`<Rose::Form::Radio::Card @disabled={{true}}/>`);
assert.true(await find('input').disabled);
});
test('it is in error state when @error={{true}}', async function (assert) {
await render(hbs`<Rose::Form::Radio::Card @error={{true}} />`);
assert.ok(await find('.error'));
});
});
ui/admin/app/abilities/credential.js
+2 -1
View File
@@ -6,7 +6,8 @@ export default class OverrideCredentialAbility extends CredentialAbility {
@service features;
get canRead() {
return (this.features.isEnabled('json-credentials') || this.model.type !== 'json')
return this.features.isEnabled('json-credentials') ||
this.model.type !== 'json'
? super.canRead
: false;
}
ui/admin/app/components/form/worker/create-worker-led/index.js
+3 -1
View File
@@ -112,7 +112,9 @@ ${listenerText}
return `wget -q https://releases.hashicorp.com/boundary-worker/0.11.2+hcp/boundary-worker_0.11.2+hcp_linux_amd64.zip ;\\
sudo apt-get update && sudo apt-get install unzip ;\\
unzip *.zip ;\\
./boundary-worker server -config="${this.configFilePath || '<path>'}/pki-worker.hcl"`;
./boundary-worker server -config="${
this.configFilePath || '<path>'
}/pki-worker.hcl"`;
}
return `curl -fsSL https://apt.releases.hashicorp.com/gpg | sudo apt-key add - ;\\
sudo apt-add-repository "deb [arch=amd64] https://apt.releases.hashicorp.com $(lsb_release -cs) main" ;\\
ui/admin/tests/acceptance/targets/brokered-credential-sources-test.js
+11 -3
View File
@@ -151,7 +151,9 @@ module('Acceptance | targets | brokered credential sources', function (hooks) {
});
await visit(urls.brokeredCredentialSources);
assert.dom('.rose-table-row:nth-child(3)').includesText(jsonCredential.name);
assert
.dom('.rose-table-row:nth-child(3)')
.includesText(jsonCredential.name);
assert.dom(`[href="${urls.jsonCredential}"]`).doesNotExist();
});
@@ -324,7 +326,10 @@ module('Acceptance | targets | brokered credential sources', function (hooks) {
await click('tbody tr .rose-dropdown-button-danger');
assert.strictEqual(findAll('tbody tr').length, credentialLibraryCount - 1);
await visit(urls.addBrokeredCredentialSources);
assert.strictEqual(findAll('tbody tr').length, availableCredentialsCount + 1);
assert.strictEqual(
findAll('tbody tr').length,
availableCredentialsCount + 1
);
});
test('can remove a username & password type credential', async function (assert) {
@@ -339,7 +344,10 @@ module('Acceptance | targets | brokered credential sources', function (hooks) {
await click('tbody tr .rose-dropdown-button-danger');
assert.strictEqual(findAll('tbody tr').length, credentialCount - 1);
await visit(urls.addBrokeredCredentialSources);
assert.strictEqual(findAll('tbody tr').length, availableCredentialsCount + 1);
assert.strictEqual(
findAll('tbody tr').length,
availableCredentialsCount + 1
);
});
test('cannot remove credential libraries without proper authorization', async function (assert) {
ui/admin/tests/unit/abilities/credential-test.js
+24 -48
View File
@@ -9,19 +9,13 @@ module('Unit | Abilities | credential', function (hooks) {
const service = this.owner.lookup('service:can');
const credential = {
authorized_actions: ['read'],
type: 'json'
type: 'json',
};
assert.ok(
service.can('read credential', credential)
);
credential.type = 'username_password'
assert.ok(
service.can('read credential', credential)
);
credential.type = 'ssh_private_key'
assert.ok(
service.can('read credential', credential)
);
assert.ok(service.can('read credential', credential));
credential.type = 'username_password';
assert.ok(service.can('read credential', credential));
credential.type = 'ssh_private_key';
assert.ok(service.can('read credential', credential));
});
test('cannot read without proper authorized actions', function (assert) {
@@ -29,19 +23,13 @@ module('Unit | Abilities | credential', function (hooks) {
const service = this.owner.lookup('service:can');
const credential = {
authorized_actions: [],
type: 'json'
type: 'json',
};
assert.notOk(
service.can('read credential', credential)
);
credential.type = 'username_password'
assert.notOk(
service.can('read credential', credential)
);
credential.type = 'ssh_private_key'
assert.notOk(
service.can('read credential', credential)
);
assert.notOk(service.can('read credential', credential));
credential.type = 'username_password';
assert.notOk(service.can('read credential', credential));
credential.type = 'ssh_private_key';
assert.notOk(service.can('read credential', credential));
});
test('cannot read without proper authorized actions and json-credentials disabled', function (assert) {
@@ -51,19 +39,13 @@ module('Unit | Abilities | credential', function (hooks) {
featuresService.disable('json-credentials');
const credential = {
authorized_actions: [],
type: 'json'
type: 'json',
};
assert.notOk(
service.can('read credential', credential)
);
credential.type = 'username_password'
assert.notOk(
service.can('read credential', credential)
);
credential.type = 'ssh_private_key'
assert.notOk(
service.can('read credential', credential)
);
assert.notOk(service.can('read credential', credential));
credential.type = 'username_password';
assert.notOk(service.can('read credential', credential));
credential.type = 'ssh_private_key';
assert.notOk(service.can('read credential', credential));
});
test('cannot read when json-credentials is disabled', function (assert) {
@@ -73,18 +55,12 @@ module('Unit | Abilities | credential', function (hooks) {
featuresService.disable('json-credentials');
const credential = {
authorized_actions: ['read'],
type: 'json'
type: 'json',
};
assert.notOk(
service.can('read credential', credential)
);
credential.type = 'username_password'
assert.ok(
service.can('read credential', credential)
);
credential.type = 'ssh_private_key'
assert.ok(
service.can('read credential', credential)
);
assert.notOk(service.can('read credential', credential));
credential.type = 'username_password';
assert.ok(service.can('read credential', credential));
credential.type = 'ssh_private_key';
assert.ok(service.can('read credential', credential));
});
});