From e6242a9c3763a2f0c5b3089451dcb03f3be03aac Mon Sep 17 00:00:00 2001
From: Tulir Asokan <tulir@maunium.net>
Date: Sun, 2 Mar 2025 20:31:25 +0200
Subject: [PATCH] web/roomview: add explore state button to header

---
 web/src/ui/roomview/RoomViewHeader.tsx | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/web/src/ui/roomview/RoomViewHeader.tsx b/web/src/ui/roomview/RoomViewHeader.tsx
index 12413fe..a30d8e2 100644
--- a/web/src/ui/roomview/RoomViewHeader.tsx
+++ b/web/src/ui/roomview/RoomViewHeader.tsx
@@ -19,8 +19,10 @@ import { RoomStateStore } from "@/api/statestore"
 import { useEventAsState } from "@/util/eventdispatcher.ts"
 import MainScreenContext from "../MainScreenContext.ts"
 import { LightboxContext, NestableModalContext } from "../modal"
+import RoomStateExplorer from "../settings/RoomStateExplorer.tsx"
 import SettingsView from "../settings/SettingsView.tsx"
 import BackIcon from "@/icons/back.svg?react"
+import CodeIcon from "@/icons/code.svg?react"
 import PeopleIcon from "@/icons/group.svg?react"
 import PinIcon from "@/icons/pin.svg?react"
 import SettingsIcon from "@/icons/settings.svg?react"
@@ -42,6 +44,14 @@ const RoomViewHeader = ({ room }: RoomViewHeaderProps) => {
 			content: <SettingsView room={room} />,
 		})
 	}
+	const openRoomStateExplorer = () => {
+		openModal({
+			dimmed: true,
+			boxed: true,
+			innerBoxClass: "room-state-explorer-box",
+			content: <RoomStateExplorer room={room} />,
+		})
+	}
 	return <div className="room-header">
 		<button className="back" onClick={mainScreen.clearActiveRoom}><BackIcon/></button>
 		<img
@@ -71,6 +81,7 @@ const RoomViewHeader = ({ room }: RoomViewHeaderProps) => {
 				onClick={mainScreen.clickRightPanelOpener}
 				title="Room Members"
 			><PeopleIcon/></button>
+			<button title="Explore room state" onClick={openRoomStateExplorer}><CodeIcon/></button>
 			<button title="Room Settings" onClick={openSettings}><SettingsIcon/></button>
 		</div>
 	</div>