diff --git a/frontend/webapp/containers/main/actions/action-form-body/index.tsx b/frontend/webapp/containers/main/actions/action-form-body/index.tsx index cc55afe26f..d2980da378 100644 --- a/frontend/webapp/containers/main/actions/action-form-body/index.tsx +++ b/frontend/webapp/containers/main/actions/action-form-body/index.tsx @@ -35,7 +35,12 @@ export const ActionFormBody: React.FC = ({ isUpdate, action, formData, ha {!isUpdate && } />} - handleFormChange('signals', value)} /> + handleFormChange('signals', value)} + /> {!isUpdate && handleFormChange('name', value)} />} diff --git a/frontend/webapp/containers/main/overview/multi-source-control/index.tsx b/frontend/webapp/containers/main/overview/multi-source-control/index.tsx index b54856a0d8..10e92314bd 100644 --- a/frontend/webapp/containers/main/overview/multi-source-control/index.tsx +++ b/frontend/webapp/containers/main/overview/multi-source-control/index.tsx @@ -1,7 +1,6 @@ import React, { useMemo, useState } from 'react'; import Image from 'next/image'; import { slide } from '@/styles'; -import theme from '@/styles/theme'; import { useAppStore } from '@/store'; import styled from 'styled-components'; import { DeleteWarning } from '@/components'; @@ -69,11 +68,20 @@ const MultiSourceControl = () => { + + {/* exists in FIGMA, but has same functionality - exclude until we change instrumented behaviour */} + + {/* + */} = ({ initialValues = [], value, onChan {rows.map((val, idx) => ( - handleInputChange(e.target.value, idx)} autoFocus={rows.length > 1 && idx === rows.length - 1} /> + handleInputChange(e.target.value, idx)} autoFocus={!val && rows.length > 1 && idx === rows.length - 1} /> handleDeleteInput(idx)}> Delete diff --git a/frontend/webapp/reuseable-components/input-table/index.tsx b/frontend/webapp/reuseable-components/input-table/index.tsx index c158c116ce..fb5805d6c1 100644 --- a/frontend/webapp/reuseable-components/input-table/index.tsx +++ b/frontend/webapp/reuseable-components/input-table/index.tsx @@ -132,18 +132,22 @@ export const InputTable: React.FC = ({ columns, initialValues = [], value {rows.map((row, idx) => ( - {columns.map(({ type, keyName, placeholder }, innerIdx) => ( - - handleChange(keyName, type === 'number' ? Number(val) : val, idx)} - autoFocus={rows.length > 1 && idx === rows.length - 1 && innerIdx === 0} - style={{ maxWidth, paddingLeft: 10 }} - /> - - ))} + {columns.map(({ type, keyName, placeholder }, innerIdx) => { + const value = row[keyName]; + + return ( + + handleChange(keyName, type === 'number' ? Number(val) : val, idx)} + autoFocus={!value && rows.length > 1 && idx === rows.length - 1 && innerIdx === 0} + style={{ maxWidth, paddingLeft: 10 }} + /> + + ); + })} handleDeleteRow(idx)}> diff --git a/frontend/webapp/reuseable-components/key-value-input-list/index.tsx b/frontend/webapp/reuseable-components/key-value-input-list/index.tsx index 2824906d27..c995a471b5 100644 --- a/frontend/webapp/reuseable-components/key-value-input-list/index.tsx +++ b/frontend/webapp/reuseable-components/key-value-input-list/index.tsx @@ -108,18 +108,18 @@ export const KeyValueInputsList: React.FC = ({ initialK }; // Check if any key or value field is empty - const isAddButtonDisabled = rows.some((pair) => pair.key.trim() === '' || pair.value.trim() === ''); + const isAddButtonDisabled = rows.some(({ key, value }) => key.trim() === '' || value.trim() === ''); const isDelButtonDisabled = rows.length <= 1; return ( - {rows.map((pair, idx) => ( + {rows.map(({ key, value }, idx) => ( - handleChange('key', e.target.value, idx)} autoFocus={rows.length > 1 && idx === rows.length - 1} /> + handleChange('key', e.target.value, idx)} autoFocus={!value && rows.length > 1 && idx === rows.length - 1} /> Arrow - handleChange('value', e.target.value, idx)} /> + handleChange('value', e.target.value, idx)} /> handleDeleteRow(idx)}> Delete