fix: room creation error handling

fix #14
pull/63/head
sualko 2020-06-04 10:16:09 +02:00
parent d862eb0d4d
commit 0074f717ea
2 changed files with 21 additions and 9 deletions

View File

@ -63,10 +63,10 @@ const App: React.FC<Props> = () => {
function addRoom(name: string) {
if (!name) {
return;
return Promise.resolve();
}
api.createRoom(name).then(room => {
return api.createRoom(name).then(room => {
setRooms(rooms.concat([room]));
});
}

View File

@ -1,29 +1,41 @@
import React, {useState} from 'react';
import React, { useState } from 'react';
type Props = {
addRoom: (name: string) => void;
addRoom: (name: string) => Promise<void>;
}
const NewRoomForm: React.FC<Props> = (props) => {
const [name, setName] = useState('');
const [name, setName] = useState<string>('');
const [processing, setProcessing] = useState<boolean>(false);
const [error, setError] = useState<string>('');
function addRoom(ev: React.FormEvent) {
ev.preventDefault();
props.addRoom(name);
setProcessing(true);
setError('');
setName('');
props.addRoom(name).then(() => {
setName('');
}).catch(err => {
setError(err.toString());
}).then(() => {
setProcessing(false);
});
}
return (
<form action="#" onSubmit={addRoom}>
<input
className="newgroup-name"
disabled={processing}
value={name}
placeholder={t('bbb', 'Room name')}
onChange={(event) => {setName(event.target.value);}} />
onChange={(event) => { setName(event.target.value); }} />
<input type="submit" value={t('bbb', 'Create')} />
<input type="submit" disabled={processing} value={t('bbb', 'Create')} />
{error && <p>{error}</p>}
</form>
);
};