mirror of https://github.com/waku-org/js-waku.git
Make functions in Room component pure
This commit is contained in:
parent
f0c0adf226
commit
5635ca028b
|
@ -4,16 +4,18 @@ import { useWaku } from './WakuContext';
|
|||
|
||||
interface Props {
|
||||
messageHandler: (msg: string) => void;
|
||||
sendMessage: () => void;
|
||||
sendMessage: (() => Promise<void>) | undefined;
|
||||
}
|
||||
|
||||
export default function MessageInput(props: Props) {
|
||||
const [inputText, setInputText] = useState<string>('');
|
||||
const { waku } = useWaku();
|
||||
|
||||
const sendMessage = () => {
|
||||
props.sendMessage();
|
||||
setInputText('');
|
||||
const sendMessage = async () => {
|
||||
if (props.sendMessage) {
|
||||
await props.sendMessage();
|
||||
setInputText('');
|
||||
}
|
||||
};
|
||||
|
||||
const messageHandler = (event: ChangeEvent<HTMLInputElement>) => {
|
||||
|
@ -21,9 +23,9 @@ export default function MessageInput(props: Props) {
|
|||
props.messageHandler(event.target.value);
|
||||
};
|
||||
|
||||
const keyPressHandler = (event: KeyboardEvent<HTMLInputElement>) => {
|
||||
const keyPressHandler = async (event: KeyboardEvent<HTMLInputElement>) => {
|
||||
if (event.key === 'Enter') {
|
||||
sendMessage();
|
||||
await sendMessage();
|
||||
}
|
||||
};
|
||||
|
||||
|
|
|
@ -16,27 +16,6 @@ export default function Room(props: Props) {
|
|||
let [messageToSend, setMessageToSend] = useState<string>('');
|
||||
const { waku } = useWaku();
|
||||
|
||||
const messageHandler = (msg: string) => {
|
||||
setMessageToSend(msg);
|
||||
};
|
||||
|
||||
const sendMessage = async () => {
|
||||
if (messageToSend.startsWith('/')) {
|
||||
props.commandHandler(messageToSend);
|
||||
} else {
|
||||
const chatMessage = new ChatMessage(
|
||||
new Date(),
|
||||
props.nick,
|
||||
messageToSend
|
||||
);
|
||||
const wakuMsg = WakuMessage.fromBytes(
|
||||
chatMessage.encode(),
|
||||
ChatContentTopic
|
||||
);
|
||||
await waku!.relay.send(wakuMsg);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div
|
||||
className="chat-container"
|
||||
|
@ -47,14 +26,43 @@ export default function Room(props: Props) {
|
|||
</div>
|
||||
<div className="chat-input" style={{ flexGrow: 0, height: '120px' }}>
|
||||
<MessageInput
|
||||
messageHandler={messageHandler}
|
||||
sendMessage={sendMessage}
|
||||
messageHandler={setMessageToSend}
|
||||
sendMessage={
|
||||
waku
|
||||
? async () => {
|
||||
return handleMessage(
|
||||
messageToSend,
|
||||
props.nick,
|
||||
props.commandHandler,
|
||||
waku.relay.send.bind(waku.relay)
|
||||
);
|
||||
}
|
||||
: undefined
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
async function handleMessage(
|
||||
message: string,
|
||||
nick: string,
|
||||
commandHandler: (cmd: string) => void,
|
||||
messageSender: (msg: WakuMessage) => Promise<void>
|
||||
) {
|
||||
if (message.startsWith('/')) {
|
||||
commandHandler(message);
|
||||
} else {
|
||||
const chatMessage = new ChatMessage(new Date(), nick, message);
|
||||
const wakuMsg = WakuMessage.fromBytes(
|
||||
chatMessage.encode(),
|
||||
ChatContentTopic
|
||||
);
|
||||
return messageSender(wakuMsg);
|
||||
}
|
||||
}
|
||||
|
||||
interface LinesProps {
|
||||
messages: ChatMessage[];
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue