Add a new tab to rooms with forward extremities

README.md

@@ -4,7 +4,7 @@
 
 This project is built using [react-admin](https://marmelab.com/react-admin/).
 
-It needs at least Synapse v1.23.0 for all functions to work as expected!
+It needs at least Synapse v1.27.0 for all functions to work as expected!
 
 You get your server version with the request `/_synapse/admin/v1/server_version`.
 See also [Synapse version API](https://github.com/matrix-org/synapse/blob/develop/docs/admin_api/version_api.rst).

src/App.js

@@ -63,6 +63,7 @@ const App = () => (
     <Resource name="joined_rooms" />
     <Resource name="pushers" />
     <Resource name="servernotices" />
+    <Resource name="forward_extremities" />
   </Admin>
 );
 

src/components/rooms.js

@@ -4,9 +4,11 @@ import {
   BooleanField,
   BulkDeleteWithConfirmButton,
   Datagrid,
+  DateField,
   DeleteButton,
   Filter,
   List,
+  NumberField,
   Pagination,
   ReferenceField,
   ReferenceManyField,
@@ -21,6 +23,7 @@ import {
 } from "react-admin";
 import get from "lodash/get";
 import { Tooltip, Typography, Chip } from "@material-ui/core";
+import FastForwardIcon from "@material-ui/icons/FastForward";
 import HttpsIcon from "@material-ui/icons/Https";
 import NoEncryptionIcon from "@material-ui/icons/NoEncryption";
 import PageviewIcon from "@material-ui/icons/Pageview";
@@ -197,6 +200,36 @@ export const RoomShow = props => {
             ]}
           />
         </Tab>
+        <Tab
+          label="resources.forward_extremities.name"
+          icon={<FastForwardIcon />}
+          path="forward_extremities"
+        >
+          <ReferenceManyField
+            reference="forward_extremities"
+            target="room_id"
+            addLabel={false}
+          >
+            <Datagrid style={{ width: "100%" }}>
+              <TextField source="id" sortable={false} />
+              <DateField
+                source="received_ts"
+                showTime
+                options={{
+                  year: "numeric",
+                  month: "2-digit",
+                  day: "2-digit",
+                  hour: "2-digit",
+                  minute: "2-digit",
+                  second: "2-digit",
+                }}
+                sortable={false}
+              />
+              <NumberField source="depth" sortable={false} />
+              <TextField source="state_group" sortable={false} />
+            </Datagrid>
+          </ReferenceManyField>
+        </Tab>
       </TabbedShowLayout>
     </Show>
   );

src/i18n/de.js

@@ -273,6 +273,15 @@ export default {
         media_length: "Größe der Dateien",
       },
     },
+    forward_extremities: {
+      name: "Vorderextremitäten",
+      fields: {
+        id: "Event-ID",
+        received_ts: "Zeitstempel",
+        depth: "Tiefe",
+        state_group: "Zustandsgruppe",
+      },
+    },
   },
   ra: {
     ...germanMessages.ra,

src/i18n/en.js

@@ -270,5 +270,14 @@ export default {
         media_length: "Media length",
       },
     },
+    forward_extremities: {
+      name: "Forward Extremities",
+      fields: {
+        id: "Event ID",
+        received_ts: "Timestamp",
+        depth: "Depth",
+        state_group: "State group",
+      },
+    },
   },
 };

src/synapse/dataProvider.js

@@ -185,6 +185,22 @@ const resourceMap = {
       return json.total;
     },
   },
+  forward_extremities: {
+    map: fe => ({
+      ...fe,
+      id: fe.event_id,
+    }),
+    reference: id => ({
+      endpoint: `/_synapse/admin/v1/rooms/${id}/forward_extremities`,
+    }),
+    data: "results",
+    total: json => {
+      return json.count;
+    },
+    delete: params => ({
+      endpoint: `/_synapse/admin/v1/rooms/${params.id}/forward_extremities`,
+    }),
+  },
 };
 
 function filterNullValues(key, value) {