refactor: 💡 Migrate workers-tags over to use Hds::Table (#2070)

* refactor: 💡 Migrate `workers-tags` over to use `Hds::Table`

Migrate `workers-tags` in `worker-create` form to use `Hds::Table`
instead of `Rose::Table`

✅ Closes: https://hashicorp.atlassian.net/browse/ICU-11722

* refactor: 💡 Use `Form::Field::List::Wrapper` for table

Use `Form::Field::List::Wrapper` for table implementation.

✅ Closes: https://hashicorp.atlassian.net/browse/ICU-11722

* refactor: 💡 Refactored how `worker_tags` is used in `table`

Cleaned up how `worker_tags` is used in the `Form::Field::ListWrapper`
component

✅ Closes: https://hashicorp.atlassian.net/browse/ICU-11722

* refactor: 💡 removed `console.log`

removed console.log

✅ Closes: https://hashicorp.atlassian.net/browse/ICU-11722
This commit is contained in:
Devon Anderson authored and GitHub committed 2024-01-11 17:23:24 -05:00
1 parent 9241b7dd0e
commit 8ad4e93ff7
2 files changed
+19 -65

No files matched your search

@@ -50,66 +50,24 @@
placeholder='10.0.0.1, 10.0.0.2, 10.0.0.3'
/>
{{/if}}
<Form::Field::ListWrapper @layout='horizontal' @disabled={{form.disabled}}>
<:fieldset as |F|>
<F.Legend>{{t 'resources.worker.form.worker_tags.label'}}</F.Legend>
<F.HelperText>
{{t 'resources.worker.form.worker_tags.help'}}
</F.HelperText>
</:fieldset>
<Hds::Form::Fieldset as |F|>
<F.Legend>{{t 'resources.worker.form.worker_tags.label'}}</F.Legend>
<F.HelperText>{{t
'resources.worker.form.worker_tags.help'
}}</F.HelperText>
<F.Control>
<Rose::Table @style='condensed' as |table|>
<table.body as |body|>
{{#each this.workerTags as |tag index|}}
<body.row as |row|>
<row.cell>
<form.input @type='text' @value={{tag.key}} />
</row.cell>
<row.cell>
<form.input @type='text' @value={{tag.value}} />
</row.cell>
<row.cell @shrink={{true}}>
<Rose::Button
@style='warning'
@iconOnly='flight-icons/svg/trash-16'
title={{t 'actions.remove'}}
{{on 'click' (fn this.removeWorkerTagByIndex index)}}
>
{{t 'actions.remove'}}
</Rose::Button>
</row.cell>
</body.row>
{{/each}}
<body.row as |row|>
<row.cell>
<form.input
@type='text'
@value={{this.newWorkerKey}}
placeholder='Key'
/>
</row.cell>
<row.cell>
<form.input
@type='text'
@value={{this.newWorkerValue}}
placeholder='Value'
/>
</row.cell>
<row.cell @shrink={{true}}>
<Rose::Button
@style='secondary'
title={{t 'actions.add'}}
@disabled={{not this.newWorkerKey}}
{{on 'click' this.addWorkerTag}}
>
{{t 'actions.add'}}
</Rose::Button>
</row.cell>
</body.row>
</table.body>
</Rose::Table>
</F.Control>
</Hds::Form::Fieldset>
<:field as |F|>
<F.KeyValue
@name='worker_tags'
@options={{this.workerTags}}
@disabled={{form.disabled}}
@addOption={{this.addWorkerTag}}
@removeOptionByIndex={{this.removeWorkerTagByIndex}}
/>
</:field>
</Form::Field::ListWrapper>
{{#if (feature-flag 'ssh-session-recording')}}
<Hds::Form::Fieldset as |F|>
@@ -31,8 +31,6 @@ export default class FormWorkerCreateWorkerLedComponent extends Component {
@tracked configFilePath;
@tracked initialUpstreams;
@tracked workerTags = A([]);
@tracked newWorkerKey;
@tracked newWorkerValue;
@tracked enableRecordingStoragePath = false;
@tracked recording_storage_path = '';
@@ -189,10 +187,8 @@ unzip *.zip ;\\
}
@action
addWorkerTag() {
this.workerTags.pushObject(new Tag(this.newWorkerKey, this.newWorkerValue));
this.newWorkerKey = '';
this.newWorkerValue = '';
addWorkerTag(e) {
this.workerTags.pushObject(new Tag(e.key, e.value));
}
@action