cswimr/revite
1
0
Fork 0
mirror of https://github.com/revoltchat/revite.git synced 2024-09-20 01:57:12 -04:00
Code Issues Projects Releases Packages Wiki Activity

fix(channel header): fix action callbacks

Browse source
This commit is contained in:
Paul Makles 2021-12-30 19:44:15 +00:00
parent b065fba6a4
commit 4773b76ea9
2 changed files with 32 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/lib/defer.ts
View file

@ -1 +1,11 @@
/**
* Schedule a task at the end of the Event Loop
* @param cb Callback
*/
export const defer = (cb: () => void) => setTimeout(cb, 0); export const defer = (cb: () => void) => setTimeout(cb, 0);
/**
* Schedule a task at the end of the second Event Loop
* @param cb Callback
*/
export const chainedDefer = (cb: () => void) => defer(() => defer(cb));

37
src/pages/channels/actions/HeaderActions.tsx
View file

@ -10,6 +10,7 @@ import {
import { observer } from "mobx-react-lite"; import { observer } from "mobx-react-lite";
import { useHistory } from "react-router-dom"; import { useHistory } from "react-router-dom";
import { chainedDefer, defer } from "../../../lib/defer";
import { internalEmit } from "../../../lib/eventEmitter"; import { internalEmit } from "../../../lib/eventEmitter";
import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice"; import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
import { voiceState, VoiceStatus } from "../../../lib/vortex/VoiceState"; import { voiceState, VoiceStatus } from "../../../lib/vortex/VoiceState";
@ -29,7 +30,8 @@ export default function HeaderActions({ channel }: ChannelHeaderProps) {
const { openScreen } = useIntermediate(); const { openScreen } = useIntermediate();
const history = useHistory(); const history = useHistory();
function openRightSidebar() { function slideOpen() {
if (!isTouchscreenDevice) return;
const panels = document.querySelector("#app > div > div > div"); const panels = document.querySelector("#app > div > div > div");
panels?.scrollTo({ panels?.scrollTo({
behavior: "smooth", behavior: "smooth",
@ -37,12 +39,25 @@ export default function HeaderActions({ channel }: ChannelHeaderProps) {
}); });
} }
function openSidebar() { function openSearch() {
if (isTouchscreenDevice) { if (
openRightSidebar(); !isTouchscreenDevice &&
} else { !layout.getSectionState(SIDEBAR_MEMBERS, true)
) {
layout.toggleSectionState(SIDEBAR_MEMBERS, true); layout.toggleSectionState(SIDEBAR_MEMBERS, true);
} }
slideOpen();
chainedDefer(() => internalEmit("RightSidebar", "open", "search"));
}
function openMembers() {
if (!isTouchscreenDevice) {
layout.toggleSectionState(SIDEBAR_MEMBERS, true);
}
slideOpen();
chainedDefer(() => internalEmit("RightSidebar", "open", undefined));
} }
return ( return (
@ -74,21 +89,13 @@ export default function HeaderActions({ channel }: ChannelHeaderProps) {
)} )}
<VoiceActions channel={channel} /> <VoiceActions channel={channel} />
{channel.channel_type !== "VoiceChannel" && ( {channel.channel_type !== "VoiceChannel" && (
<IconButton <IconButton onClick={openSearch}>
onClick={() => {
internalEmit("RightSidebar", "open", "search");
openRightSidebar();
}}>
<Search size={25} /> <Search size={25} />
</IconButton> </IconButton>
)} )}
{(channel.channel_type === "Group" || {(channel.channel_type === "Group" ||
channel.channel_type === "TextChannel") && ( channel.channel_type === "TextChannel") && (
<IconButton <IconButton onClick={openMembers}>
onClick={() => {
internalEmit("RightSidebar", "open", undefined);
openRightSidebar();
}}>
<Group size={25} /> <Group size={25} />
</IconButton> </IconButton>
)} )}