From 7c9a87bc8667f74ebf0636e43bcc084d3e38c800 Mon Sep 17 00:00:00 2001
From: Michael Albert <michael.albert@awesome-technologies.de>
Date: Thu, 6 Aug 2020 21:43:19 +0200
Subject: [PATCH] Show room members in room detail view

Change-Id: I7d82f728de0e503d4834f6815bde000c7a0204a3
---
 README.md                   |  2 +-
 src/App.js                  |  1 +
 src/components/rooms.js     | 31 +++++++++++++++++++++++++++++++
 src/synapse/dataProvider.js |  9 +++++++++
 4 files changed, 42 insertions(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 6af447f..d742def 100644
--- a/README.md
+++ b/README.md
@@ -4,7 +4,7 @@
 
 This project is built using [react-admin](https://marmelab.com/react-admin/).
 
-It needs at least Synapse v1.15.0 for all functions to work as expected!
+It needs at least Synapse v1.18.0 for all functions to work as expected!
 
 ## Step-By-Step install:
 
diff --git a/src/App.js b/src/App.js
index a7fc125..8696936 100644
--- a/src/App.js
+++ b/src/App.js
@@ -38,6 +38,7 @@ const App = () => (
     <Resource name="rooms" list={RoomList} show={RoomShow} icon={RoomIcon} />
     <Resource name="connections" />
     <Resource name="devices" />
+    <Resource name="room_members" />
     <Resource name="servernotices" />
   </Admin>
 );
diff --git a/src/components/rooms.js b/src/components/rooms.js
index 4a8a4c9..0299efb 100644
--- a/src/components/rooms.js
+++ b/src/components/rooms.js
@@ -6,6 +6,8 @@ import {
   Filter,
   List,
   Pagination,
+  ReferenceField,
+  ReferenceManyField,
   SelectField,
   Show,
   Tab,
@@ -18,6 +20,7 @@ import { Tooltip, Typography, Chip } from "@material-ui/core";
 import HttpsIcon from "@material-ui/icons/Https";
 import NoEncryptionIcon from "@material-ui/icons/NoEncryption";
 import PageviewIcon from "@material-ui/icons/Pageview";
+import UserIcon from "@material-ui/icons/Group";
 import ViewListIcon from "@material-ui/icons/ViewList";
 import VisibilityIcon from "@material-ui/icons/Visibility";
 
@@ -92,6 +95,34 @@ export const RoomShow = props => {
           />
         </Tab>
 
+        <Tab label="synapseadmin.rooms.tabs.members" icon={<UserIcon />}>
+          <ReferenceManyField
+            reference="room_members"
+            target="room_id"
+            addLabel={false}
+          >
+            <Datagrid
+              style={{ width: "100%" }}
+              rowClick={(id, basePath, record) => "/users/" + id}
+            >
+              <TextField
+                source="id"
+                sortable={false}
+                label="resources.users.fields.id"
+              />
+              <ReferenceField
+                label="resources.users.fields.displayname"
+                source="id"
+                reference="users"
+                sortable={false}
+                link=""
+              >
+                <TextField source="displayname" sortable={false} />
+              </ReferenceField>
+            </Datagrid>
+          </ReferenceManyField>
+        </Tab>
+
         <Tab
           label="synapseadmin.rooms.tabs.permission"
           icon={<VisibilityIcon />}
diff --git a/src/synapse/dataProvider.js b/src/synapse/dataProvider.js
index d4c8bcd..9d3e015 100644
--- a/src/synapse/dataProvider.js
+++ b/src/synapse/dataProvider.js
@@ -88,6 +88,15 @@ const resourceMap = {
     }),
     data: "connections",
   },
+  room_members: {
+    map: m => ({
+      id: m,
+    }),
+    reference: id => ({
+      endpoint: `/_synapse/admin/v1/rooms/${id}/members`,
+    }),
+    data: "members",
+  },
   servernotices: {
     map: n => ({ id: n.event_id }),
     create: data => ({