cswimr/revite
1
0
Fork 0
mirror of https://github.com/revoltchat/revite.git synced 2024-11-25 16:40:58 -05:00
Code Issues Projects Releases Packages Wiki Activity

feat: make emoji picker close on select / interact elsewhere

Browse source
This commit is contained in:
Paul Makles 2022-07-14 17:13:51 +01:00
parent df1b39256d
commit f3822b625d
3 changed files with 61 additions and 50 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
package.json
View file

@ -73,7 +73,7 @@
"@hcaptcha/react-hcaptcha": "^0.3.6", "@hcaptcha/react-hcaptcha": "^0.3.6",
"@insertish/vite-plugin-babel-macros": "^1.0.5", "@insertish/vite-plugin-babel-macros": "^1.0.5",
"@preact/preset-vite": "^2.0.0", "@preact/preset-vite": "^2.0.0",
"@revoltchat/ui": "1.0.76", "@revoltchat/ui": "1.0.77",
"@rollup/plugin-replace": "^2.4.2", "@rollup/plugin-replace": "^2.4.2",
"@styled-icons/boxicons-logos": "^10.38.0", "@styled-icons/boxicons-logos": "^10.38.0",
"@styled-icons/boxicons-regular": "^10.38.0", "@styled-icons/boxicons-regular": "^10.38.0",

23
src/components/common/messaging/MessageBox.tsx
View file

@ -143,7 +143,8 @@ const RE_SED = new RegExp("^s/([^])*/([^])*$");
// Tests for code block delimiters (``` at start of line) // Tests for code block delimiters (``` at start of line)
const RE_CODE_DELIMITER = new RegExp("^```", "gm"); const RE_CODE_DELIMITER = new RegExp("^```", "gm");
const HackAlertThisFileWillBeReplaced = observer(({ channel }: Props) => { const HackAlertThisFileWillBeReplaced = observer(
({ channel, onClose }: Props & { onClose: () => void }) => {
const renderEmoji = useMemo( const renderEmoji = useMemo(
() => () =>
memo(({ emoji }: { emoji: string }) => ( memo(({ emoji }: { emoji: string }) => (
@ -153,7 +154,7 @@ const HackAlertThisFileWillBeReplaced = observer(({ channel }: Props) => {
); );
const emojis: Record<string, any> = { const emojis: Record<string, any> = {
default: Object.keys(emojiDictionary), default: Object.keys(emojiDictionary).map((id) => ({ id })),
}; };
// ! FIXME: also expose typing from component // ! FIXME: also expose typing from component
@ -163,7 +164,7 @@ const HackAlertThisFileWillBeReplaced = observer(({ channel }: Props) => {
// ! FIXME: add a separate map on each server for emoji // ! FIXME: add a separate map on each server for emoji
const list = [...channel.client.emojis.values()] const list = [...channel.client.emojis.values()]
.filter((emoji) => emoji.parent.id === server._id) .filter((emoji) => emoji.parent.id === server._id)
.map((x) => x._id); .map(({ _id, name }) => ({ id: _id, name }));
if (list.length > 0) { if (list.length > 0) {
emojis[server._id] = list; emojis[server._id] = list;
@ -188,11 +189,16 @@ const HackAlertThisFileWillBeReplaced = observer(({ channel }: Props) => {
renderEmoji={renderEmoji} renderEmoji={renderEmoji}
onSelect={(emoji) => { onSelect={(emoji) => {
const v = state.draft.get(channel._id); const v = state.draft.get(channel._id);
state.draft.set(channel._id, `${v ? `${v} ` : ""}:${emoji}:`); state.draft.set(
channel._id,
`${v ? `${v} ` : ""}:${emoji}:`,
);
}} }}
onClose={onClose}
/> />
); );
}); },
);
// ! FIXME: add to app config and load from app config // ! FIXME: add to app config and load from app config
export const CAN_UPLOAD_AT_ONCE = 5; export const CAN_UPLOAD_AT_ONCE = 5;
@ -209,6 +215,8 @@ export default observer(({ channel }: Props) => {
const client = useClient(); const client = useClient();
const translate = useTranslation(); const translate = useTranslation();
const closePicker = useCallback(() => setPicker(false), []);
const renderer = getRenderer(channel); const renderer = getRenderer(channel);
if (!channel.havePermission("SendMessage")) { if (!channel.havePermission("SendMessage")) {
@ -559,7 +567,10 @@ export default observer(({ channel }: Props) => {
/> />
<FloatingLayer> <FloatingLayer>
{picker && ( {picker && (
<HackAlertThisFileWillBeReplaced channel={channel} /> <HackAlertThisFileWillBeReplaced
channel={channel}
onClose={closePicker}
/>
)} )}
</FloatingLayer> </FloatingLayer>
<Base> <Base>

10
yarn.lock
View file

@ -2240,9 +2240,9 @@ __metadata:
languageName: node languageName: node
linkType: hard linkType: hard
"@revoltchat/ui@npm:1.0.76": "@revoltchat/ui@npm:1.0.77":
version: 1.0.76 version: 1.0.77
resolution: "@revoltchat/ui@npm:1.0.76" resolution: "@revoltchat/ui@npm:1.0.77"
dependencies: dependencies:
"@styled-icons/boxicons-logos": ^10.38.0 "@styled-icons/boxicons-logos": ^10.38.0
"@styled-icons/boxicons-regular": ^10.38.0 "@styled-icons/boxicons-regular": ^10.38.0
@ -2256,7 +2256,7 @@ __metadata:
react-virtuoso: ^2.12.0 react-virtuoso: ^2.12.0
peerDependencies: peerDependencies:
revolt.js: "*" revolt.js: "*"
checksum: b4051c759bd2e350eaab0f28c4d27b8df391086d63d58db14edf0c557d19da6d1f95df20327682086db46c6348ab7c7a0e6c696829e16d18fd341e4fbc8cbaf2 checksum: ac3cf9787ff11df2156db0e871e48072013d0827b14b5dbcb54e9fe7f8f97daa19325d0fda93ded7487c642df57d6aee998bbe0ccf20bb095b1027f247e47e64
languageName: node languageName: node
linkType: hard linkType: hard
@ -3626,7 +3626,7 @@ __metadata:
"@hcaptcha/react-hcaptcha": ^0.3.6 "@hcaptcha/react-hcaptcha": ^0.3.6
"@insertish/vite-plugin-babel-macros": ^1.0.5 "@insertish/vite-plugin-babel-macros": ^1.0.5
"@preact/preset-vite": ^2.0.0 "@preact/preset-vite": ^2.0.0
"@revoltchat/ui": 1.0.76 "@revoltchat/ui": 1.0.77
"@rollup/plugin-replace": ^2.4.2 "@rollup/plugin-replace": ^2.4.2
"@styled-icons/boxicons-logos": ^10.38.0 "@styled-icons/boxicons-logos": ^10.38.0
"@styled-icons/boxicons-regular": ^10.38.0 "@styled-icons/boxicons-regular": ^10.38.0