imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Update space panel expand mechanism (#7230)

Browse source
This commit is contained in:
Michael Telatynski 2021-12-07 09:32:00 +00:00 • committed by GitHub
parent e2ed00db85
commit 275e9c1d02
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
11 changed files with 107 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

36
src/components/views/spaces/SpacePanel.tsx
View file

@ -58,6 +58,11 @@ import QuickSettingsButton from "./QuickSettingsButton";
import { useSettingValue } from "../../../hooks/useSettings";
import UserMenu from "../../structures/UserMenu";
import IndicatorScrollbar from "../../structures/IndicatorScrollbar";
import { isMac } from "../../../Keyboard";
import { useDispatcher } from "../../../hooks/useDispatcher";
import defaultDispatcher from "../../../dispatcher/dispatcher";
import { ActionPayload } from "../../../dispatcher/payloads";
import { Action } from "../../../dispatcher/actions";
const useSpaces = (): [Room[], MetaSpace[], Room[], SpaceKey] => {
const invites = useEventEmitterState<Room[]>(SpaceStore.instance, UPDATE_INVITED_SPACES, () => {
@ -293,6 +298,12 @@ const SpacePanel = () => {
return () => UIStore.instance.stopTrackingElementDimensions("SpacePanel");
}, []);
useDispatcher(defaultDispatcher, (payload: ActionPayload) => {
if (payload.action === Action.ToggleSpacePanel) {
setPanelCollapsed(!isPanelCollapsed);
}
});
return (
<DragDropContext onDragEnd={result => {
if (!result.destination) return; // dropped outside the list
@ -307,7 +318,21 @@ const SpacePanel = () => {
aria-label={_t("Spaces")}
ref={ref}
>
<UserMenu isPanelCollapsed={isPanelCollapsed} />
<UserMenu isPanelCollapsed={isPanelCollapsed}>
<AccessibleTooltipButton
className={classNames("mx_SpacePanel_toggleCollapse", { expanded: !isPanelCollapsed })}
onClick={() => setPanelCollapsed(!isPanelCollapsed)}
title={isPanelCollapsed ? _t("Expand") : _t("Collapse")}
tooltip={<div>
<div className="mx_Tooltip_title">
{ isPanelCollapsed ? _t("Expand") : _t("Collapse") }
</div>
<div className="mx_Tooltip_sub">
{ isMac ? "⌘ + ⇧ + D" : "Ctrl + Shift + D" }
</div>
</div>}
/>
</UserMenu>
<Droppable droppableId="top-level-spaces">
{ (provided, snapshot) => (
<IndicatorScrollbar
@ -327,14 +352,7 @@ const SpacePanel = () => {
</IndicatorScrollbar>
) }
</Droppable>
<AccessibleTooltipButton
className={classNames("mx_SpacePanel_toggleCollapse", { expanded: !isPanelCollapsed })}
onClick={() => setPanelCollapsed(!isPanelCollapsed)}
title={isPanelCollapsed ? _t("Expand space panel") : _t("Collapse space panel")}
forceHide={!isPanelCollapsed}
>
{ !isPanelCollapsed ? _t("Collapse") : null }
</AccessibleTooltipButton>
{ metaSpacesEnabled && <QuickSettingsButton isPanelCollapsed={isPanelCollapsed} /> }
</ul>
) }