Close picker (#90)

This commit is contained in:
Maria Rushkova 2021-10-20 16:15:18 +02:00 committed by GitHub
parent 819b89562c
commit 46618e2dd0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 14 additions and 2 deletions

View File

@ -1,5 +1,5 @@
import { Picker } from "emoji-mart";
import React, { useCallback, useMemo, useState } from "react";
import React, { useCallback, useEffect, useMemo, useState } from "react";
import styled from "styled-components";
import { useLow } from "../../contexts/narrowProvider";
@ -22,6 +22,13 @@ export function ChatInput({ theme, addMessage }: ChatInputProps) {
const [inputHeight, setInputHeight] = useState(40);
const [imageUint, setImageUint] = useState<undefined | Uint8Array>(undefined);
useEffect(() => {
window.addEventListener("click", () => setShowEmoji(false));
return () => {
window.removeEventListener("click", () => setShowEmoji(false));
};
}, []);
const image = useMemo(
() => (imageUint ? uintToImgUrl(imageUint) : ""),
[imageUint]
@ -119,7 +126,12 @@ export function ChatInput({ theme, addMessage }: ChatInputProps) {
onKeyPress={onInputKeyPress}
/>
<InputButtons>
<ChatButton onClick={() => setShowEmoji(!showEmoji)}>
<ChatButton
onClick={(e) => {
e.stopPropagation();
setShowEmoji(!showEmoji);
}}
>
<EmojiIcon isActive={showEmoji} />
</ChatButton>
<ChatButton>