From 375649756f473e89d4e6a15b976ef84161fcac85 Mon Sep 17 00:00:00 2001
From: Manuel Stahl <manuel.stahl@awesome-technologies.de>
Date: Tue, 21 Apr 2020 14:51:40 +0200
Subject: [PATCH] Add page to show room details

Change-Id: Iec4f402c4322d775cc14c567069a3295ad383b44
---
 src/App.js                  |  3 ++-
 src/components/rooms.js     | 40 ++++++++++++++++++++++++++++++++++++-
 src/i18n/de.js              |  1 +
 src/i18n/en.js              |  1 +
 src/synapse/dataProvider.js |  2 --
 5 files changed, 43 insertions(+), 4 deletions(-)

diff --git a/src/App.js b/src/App.js
index 01ea17c..c646d2d 100644
--- a/src/App.js
+++ b/src/App.js
@@ -4,7 +4,7 @@ import polyglotI18nProvider from "ra-i18n-polyglot";
 import authProvider from "./synapse/authProvider";
 import dataProvider from "./synapse/dataProvider";
 import { UserList, UserCreate, UserEdit } from "./components/users";
-import { RoomList, RoomCreate } from "./components/rooms";
+import { RoomList, RoomCreate, RoomShow } from "./components/rooms";
 import LoginPage from "./components/LoginPage";
 import UserIcon from "@material-ui/icons/Group";
 import { ViewListIcon as RoomIcon } from "@material-ui/icons/ViewList";
@@ -44,6 +44,7 @@ const App = () => (
       name="rooms"
       list={RoomList}
       create={RoomCreate}
+      show={RoomShow}
       icon={RoomIcon}
     />
     <Resource name="connections" />
diff --git a/src/components/rooms.js b/src/components/rooms.js
index 5e5cd7c..5e7606a 100644
--- a/src/components/rooms.js
+++ b/src/components/rooms.js
@@ -1,14 +1,22 @@
 import React from "react";
 import {
+  BooleanField,
   BooleanInput,
   Create,
   Datagrid,
   List,
   Pagination,
+  ReferenceArrayField,
+  Show,
   SimpleForm,
+  Tab,
+  TabbedShowLayout,
   TextField,
   TextInput,
+  useTranslate,
 } from "react-admin";
+import ViewListIcon from "@material-ui/icons/ViewList";
+import UserIcon from "@material-ui/icons/Group";
 
 const RoomPagination = props => (
   <Pagination {...props} rowsPerPageOptions={[10, 25, 50, 100, 500, 1000]} />
@@ -16,7 +24,7 @@ const RoomPagination = props => (
 
 export const RoomList = props => (
   <List {...props} pagination={<RoomPagination />}>
-    <Datagrid>
+    <Datagrid rowClick="show">
       <TextField source="room_id" />
       <TextField source="name" />
       <TextField source="canonical_alias" />
@@ -108,3 +116,33 @@ export const RoomCreate = props => (
     </SimpleForm>
   </Create>
 );
+
+const RoomTitle = ({ record }) => {
+  const translate = useTranslate();
+  return (
+    <span>
+      {translate("resources.rooms.name", 1)} {record ? `"${record.name}"` : ""}
+    </span>
+  );
+};
+export const RoomShow = props => (
+  <Show {...props} title={<RoomTitle />}>
+    <TabbedShowLayout>
+      <Tab label="synapseadmin.rooms.details" icon={<ViewListIcon />}>
+        <TextField source="id" disabled />
+        <TextField source="name" />
+        <TextField source="canonical_alias" />
+        <TextField source="join_rules" />
+        <TextField source="guest_access" />
+      </Tab>
+      <Tab label="resources.rooms.fields.joined_members" icon={<UserIcon />}>
+        <ReferenceArrayField reference="users" source="members">
+          <Datagrid>
+            <TextField source="id" />
+            <TextField source="displayname" />
+          </Datagrid>
+        </ReferenceArrayField>
+      </Tab>
+    </TabbedShowLayout>
+  </Show>
+);
diff --git a/src/i18n/de.js b/src/i18n/de.js
index 0c5dd74..f4a4c38 100644
--- a/src/i18n/de.js
+++ b/src/i18n/de.js
@@ -17,6 +17,7 @@ export default {
         "Muss eine vollständige Matrix Benutzer-ID sein, z.B. @benutzer_id:homeserver",
     },
     rooms: {
+      details: "Raumdetails",
       room_name: "Raumname",
       make_public: "Öffentlicher Raum",
       room_name_required: "Muss angegeben werden",
diff --git a/src/i18n/en.js b/src/i18n/en.js
index 0cb5f5e..f8cc133 100644
--- a/src/i18n/en.js
+++ b/src/i18n/en.js
@@ -17,6 +17,7 @@ export default {
         "Must be a fully qualified Matrix user-id, e.g. @user_id:homeserver",
     },
     rooms: {
+      details: "Room Details",
       room_name: "Room Name",
       make_public: "Make room public",
       room_name_required: "Must be provided",
diff --git a/src/synapse/dataProvider.js b/src/synapse/dataProvider.js
index 3eb84e8..9bd8a2a 100644
--- a/src/synapse/dataProvider.js
+++ b/src/synapse/dataProvider.js
@@ -37,8 +37,6 @@ const resourceMap = {
     map: r => ({
       ...r,
       id: r.room_id,
-      alias: r.canonical_alias,
-      members: r.joined_members,
     }),
     data: "rooms",
     total: json => json.total_rooms,