From 54234036a7281c9b10eb7a42d88632adbdfe6824 Mon Sep 17 00:00:00 2001 From: Tulir Asokan Date: Thu, 31 Oct 2024 00:14:13 +0200 Subject: [PATCH] web/rightpanel: close when same button is clicked again --- web/src/ui/MainScreen.tsx | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/web/src/ui/MainScreen.tsx b/web/src/ui/MainScreen.tsx index eb965a0..3db7601 100644 --- a/web/src/ui/MainScreen.tsx +++ b/web/src/ui/MainScreen.tsx @@ -13,7 +13,7 @@ // // You should have received a copy of the GNU Affero General Public License // along with this program. If not, see . -import { use, useCallback, useLayoutEffect, useMemo, useState } from "react" +import { use, useCallback, useLayoutEffect, useMemo, useReducer, useState } from "react" import type { RoomID } from "@/api/types" import ClientContext from "./ClientContext.ts" import MainScreenContext, { MainScreenContextFields } from "./MainScreenContext.ts" @@ -23,9 +23,16 @@ import RoomView from "./roomview/RoomView.tsx" import { useResizeHandle } from "./util/useResizeHandle.tsx" import "./MainScreen.css" +const rpReducer = (prevState: RightPanelProps | null, newState: RightPanelProps | null) => { + if (prevState?.type === newState?.type) { + return null + } + return newState +} + const MainScreen = () => { const [activeRoomID, setActiveRoomID] = useState(null) - const [rightPanel, setRightPanel] = useState(null) + const [rightPanel, setRightPanel] = useReducer(rpReducer, null) const client = use(ClientContext)! const activeRoom = activeRoomID ? client.store.rooms.get(activeRoomID) : undefined const setActiveRoom = useCallback((roomID: RoomID) => {