make basic form field wit no submit, so a submit text field can compose it

This commit is contained in:
gingervitis 2021-01-30 12:27:07 -08:00
parent b37b57feda
commit 579a0a8838
2 changed files with 18 additions and 5 deletions

View file

@ -4,6 +4,8 @@ import { Typography, Tag, Input } from 'antd';
import { ServerStatusContext } from '../../../utils/server-status-context'; import { ServerStatusContext } from '../../../utils/server-status-context';
import { FIELD_PROPS_TAGS, RESET_TIMEOUT, SUCCESS_STATES, postConfigUpdateToAPI } from './constants'; import { FIELD_PROPS_TAGS, RESET_TIMEOUT, SUCCESS_STATES, postConfigUpdateToAPI } from './constants';
import TextField from './form-textfield-nosubmit';
import { UpdateArgs } from '../../../types/config-section';
const { Title } = Typography; const { Title } = Typography;
@ -59,11 +61,11 @@ export default function EditInstanceTags() {
}); });
}; };
const handleInputChange = e => { const handleInputChange = ({ value }: UpdateArgs) => {
if (submitStatusMessage !== '') { if (submitStatusMessage !== '') {
setSubmitStatusMessage(''); setSubmitStatusMessage('');
} }
setNewTagInput(e.target.value); setNewTagInput(value);
}; };
// send to api and do stuff // send to api and do stuff
@ -115,7 +117,18 @@ export default function EditInstanceTags() {
{newStatusIcon} {newStatusMessage} {submitStatusMessage} {newStatusIcon} {newStatusMessage} {submitStatusMessage}
</div> </div>
<div className="add-new-tag-section"> <div className="add-new-tag-section">
<Input <TextField
fieldName="tag-input"
value={newTagInput}
className="new-tag-input"
onChange={handleInputChange}
onPressEnter={handleSubmitNewTag}
maxLength={maxLength}
placeholder={placeholder}
message={`${newStatusIcon} ${newStatusMessage} ${submitStatusMessage}`}
/>
{/* <Input
type="text" type="text"
className="new-tag-input" className="new-tag-input"
value={newTagInput} value={newTagInput}
@ -124,7 +137,7 @@ export default function EditInstanceTags() {
maxLength={maxLength} maxLength={maxLength}
placeholder={placeholder} placeholder={placeholder}
allowClear allowClear
/> /> */}
</div> </div>
</div> </div>
); );

View file

@ -16,7 +16,7 @@ import StatisticItem from "./components/statistic"
import LogTable from "./components/log-table"; import LogTable from "./components/log-table";
import Offline from './offline-notice'; import Offline from './offline-notice';
import TextField from './components/config/form-textfield'; import TextField from './components/config/form-textfield';
import { API_STREAM_TITLE, postConfigUpdateToAPI, TEXTFIELD_PROPS_STREAM_TITLE } from './components/config/constants'; import { TEXTFIELD_PROPS_STREAM_TITLE } from './components/config/constants';
import { import {
LOGS_WARN, LOGS_WARN,