scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2024-11-23 23:57:55 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Allow Enter key to submit curator and project adders

Browse source
This commit is contained in:
Paul Kaplan 2021-05-06 09:21:32 -04:00
parent 3785108348
commit 903eef969f
2 changed files with 20 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
src/views/studio/studio-curator-inviter.jsx
View file

@ -10,7 +10,14 @@ const StudioCuratorInviter = ({onSubmit}) => {
const [value, setValue] = useState(''); const [value, setValue] = useState('');
const [submitting, setSubmitting] = useState(false); const [submitting, setSubmitting] = useState(false);
const [error, setError] = useState(null); const [error, setError] = useState(null);
const submit = () => {
setSubmitting(true);
setError(null);
onSubmit(value)
.then(() => setValue(''))
.catch(e => setError(e))
.then(() => setSubmitting(false));
};
return ( return (
<div className="studio-adder-section"> <div className="studio-adder-section">
<h3>✦ Invite Curators</h3> <h3>✦ Invite Curators</h3>
@ -19,6 +26,7 @@ const StudioCuratorInviter = ({onSubmit}) => {
type="text" type="text"
placeholder="<username>" placeholder="<username>"
value={value} value={value}
onKeyDown={e => e.key === 'Enter' && submit()}
onChange={e => setValue(e.target.value)} onChange={e => setValue(e.target.value)}
/> />
<button <button
@ -26,14 +34,7 @@ const StudioCuratorInviter = ({onSubmit}) => {
'mod-mutating': submitting 'mod-mutating': submitting
})} })}
disabled={submitting} disabled={submitting}
onClick={() => { onClick={submit}
setSubmitting(true);
setError(null);
onSubmit(value)
.then(() => setValue(''))
.catch(e => setError(e))
.then(() => setSubmitting(false));
}}
>Invite</button> >Invite</button>
{error && <div>{error}</div>} {error && <div>{error}</div>}
</div> </div>

19
src/views/studio/studio-project-adder.jsx
View file

@ -10,7 +10,14 @@ const StudioProjectAdder = ({onSubmit}) => {
const [value, setValue] = useState(''); const [value, setValue] = useState('');
const [submitting, setSubmitting] = useState(false); const [submitting, setSubmitting] = useState(false);
const [error, setError] = useState(null); const [error, setError] = useState(null);
const submit = () => {
setSubmitting(true);
setError(null);
onSubmit(value)
.then(() => setValue(''))
.catch(e => setError(e))
.then(() => setSubmitting(false));
};
return ( return (
<div className="studio-adder-section"> <div className="studio-adder-section">
<h3>✦ Add Projects</h3> <h3>✦ Add Projects</h3>
@ -19,6 +26,7 @@ const StudioProjectAdder = ({onSubmit}) => {
type="text" type="text"
placeholder="<project id>" placeholder="<project id>"
value={value} value={value}
onKeyDown={e => e.key === 'Enter' && submit()}
onChange={e => setValue(e.target.value)} onChange={e => setValue(e.target.value)}
/> />
<button <button
@ -26,14 +34,7 @@ const StudioProjectAdder = ({onSubmit}) => {
'mod-mutating': submitting 'mod-mutating': submitting
})} })}
disabled={submitting} disabled={submitting}
onClick={() => { onClick={submit}
setSubmitting(true);
setError(null);
onSubmit(value)
.then(() => setValue(''))
.catch(e => setError(e))
.then(() => setSubmitting(false));
}}
>Add</button> >Add</button>
{error && <div>{error}</div>} {error && <div>{error}</div>}
</div> </div>