diff --git a/shell/components/form/ArrayList.vue b/shell/components/form/ArrayList.vue index 9f7fc31173..81fe176bc7 100644 --- a/shell/components/form/ArrayList.vue +++ b/shell/components/form/ArrayList.vue @@ -6,8 +6,6 @@ import { removeAt } from '@shell/utils/array'; import { TextAreaAutoGrow } from '@components/Form/TextArea'; import { clone } from '@shell/utils/object'; import { LabeledInput } from '@components/Form/LabeledInput'; -import { randomStr } from '@shell/utils/string'; - const DEFAULT_PROTIP = 'Tip: Paste lines into any list field for easy bulk entry'; export default { @@ -116,12 +114,12 @@ export default { const rows = ref([]); for ( const value of input ) { - rows.value.push({ value, id: randomStr() }); + rows.value.push({ value }); } if ( !rows.value.length && props.initialEmptyRow ) { const value = props.defaultAddValue ? clone(props.defaultAddValue) : ''; - rows.value.push({ value, id: randomStr() }); + rows.value.push({ value }); } const isView = computed(() => { @@ -166,19 +164,9 @@ export default { watch( () => props.value, - (newVal) => { + () => { lastUpdateWasFromValue.value = true; - const newRows = (newVal || []).map((value) => { - const existingRow = rows.value.find((row) => row.value === value); - - if (existingRow) { - return { value, id: existingRow.id }; - } else { - return { value, id: randomStr() }; - } - }); - - rows.value = newRows; + rows.value = (props.value || []).map((v) => ({ value: v })); }, { deep: true } ); @@ -223,10 +211,7 @@ export default { }, methods: { add() { - this.rows.push({ - value: clone(this.defaultAddValue), - id: randomStr(), - }); + this.rows.push({ value: clone(this.defaultAddValue) }); if (this.defaultAddValue) { this.queueUpdate(); } @@ -316,7 +301,7 @@ export default {
{ expect(wrapper.find('[data-testid="array-list-remove-item-2"]').exists()).toBe(false); expect((wrapper.emitted('remove')![0][0] as any).row.value).toStrictEqual('string 1'); - expect(wrapper.vm.rows).toStrictEqual([{ id: '', value: 'string 0' }, { id: '', value: 'string 2' }]); + expect(wrapper.vm.rows).toStrictEqual([{ value: 'string 0' }, { value: 'string 2' }]); expect(wrapper.emitted('update:value')![0][0]).toStrictEqual(['string 0', 'string 2']); }); @@ -100,7 +100,7 @@ describe('the ArrayList', () => { const rowRemove = wrapper.find('[data-testid="array-list-remove-item-0"]'); const rowAdd = wrapper.find('[data-testid="array-list-button"]'); - expect(wrapper.vm.rows[0]).toStrictEqual({ id: '', value: value[0] }); + expect(wrapper.vm.rows[0]).toStrictEqual({ value: value[0] }); expect(mainContainer.attributes('role')).toBe('group'); expect(mainContainer.attributes('aria-label')).toBe('some-title'); diff --git a/shell/edit/networking.k8s.io.ingress/Rule.vue b/shell/edit/networking.k8s.io.ingress/Rule.vue index 471740c4d3..b3ac7d0df8 100644 --- a/shell/edit/networking.k8s.io.ingress/Rule.vue +++ b/shell/edit/networking.k8s.io.ingress/Rule.vue @@ -2,7 +2,6 @@ import RulePath from '@shell/edit/networking.k8s.io.ingress/RulePath'; import { LabeledInput } from '@components/Form/LabeledInput'; import { random32 } from '@shell/utils/string'; -import debounce from 'lodash/debounce'; export default { emits: ['update:value', 'remove'], @@ -42,19 +41,6 @@ export default { ruleMode: this.value.asDefault ? 'asDefault' : 'setHost', }; }, - watch: { - host: { - handler: debounce(function() { - this.update(); - }, 500), - }, - paths: { - handler: debounce(function() { - this.update(); - }, 500), - deep: true - } - }, methods: { update() { const http = { paths: this.paths }; @@ -96,6 +82,7 @@ export default { path.focus(); } + this.update(); }); }, removePath(idx) { @@ -103,6 +90,7 @@ export default { neu.splice(idx, 1); this.paths = neu; + this.update(); }, removeRule() { this.$emit('remove'); @@ -130,6 +118,7 @@ export default { :label="t('ingress.rules.requestHost.label')" :placeholder="t('ingress.rules.requestHost.placeholder')" :rules="rules.requestHost" + @update:value="update" />