Add rooms and connections to federation/destinations

src/App.js

@@ -83,6 +83,7 @@ const App = () => (
     <Resource name="servernotices" />
     <Resource name="forward_extremities" />
     <Resource name="room_state" />
+    <Resource name="destination_rooms" />
   </Admin>
 );
 

src/components/destinations.js

@@ -1,15 +1,28 @@
 import React from "react";
 import {
+  Button,
   Datagrid,
   DateField,
   Filter,
   List,
   Pagination,
+  ReferenceField,
+  ReferenceManyField,
   SearchInput,
-  SimpleShowLayout,
   Show,
+  Tab,
+  TabbedShowLayout,
   TextField,
+  TopToolbar,
+  useRecordContext,
+  useDelete,
+  useNotify,
+  useRefresh,
+  useTranslate,
 } from "react-admin";
+import AutorenewIcon from "@material-ui/icons/Autorenew";
+import FolderSharedIcon from "@material-ui/icons/FolderShared";
+import ViewListIcon from "@material-ui/icons/ViewList";
 
 const DestinationPagination = props => (
   <Pagination {...props} rowsPerPageOptions={[10, 25, 50, 100, 500, 1000]} />
@@ -36,6 +49,62 @@ const DestinationFilter = ({ ...props }) => {
   );
 };
 
+export const DestinationReconnectButton = props => {
+  const record = useRecordContext();
+  const refresh = useRefresh();
+  const notify = useNotify();
+  const [handleReconnect, { isLoading }] = useDelete("destinations");
+
+  // Reconnect is not required if no error has occurred. (`failure_ts`)
+  if (!record || !record.failure_ts) return null;
+
+  const handleClick = e => {
+    // Prevents redirection to the detail page when clicking in the list
+    e.stopPropagation();
+
+    handleReconnect(
+      { payload: { id: record.id } },
+      {
+        onSuccess: () => {
+          notify("ra.notification.updated", {
+            messageArgs: { smart_count: 1 },
+          });
+          refresh();
+        },
+        onFailure: () => {
+          notify("ra.message.error", { type: "error" });
+        },
+      }
+    );
+  };
+
+  return (
+    <Button
+      label="resources.destinations.action.reconnect"
+      onClick={handleClick}
+      disabled={isLoading}
+    >
+      <AutorenewIcon />
+    </Button>
+  );
+};
+
+const DestinationShowActions = props => (
+  <TopToolbar>
+    <DestinationReconnectButton />
+  </TopToolbar>
+);
+
+const DestinationTitle = props => {
+  const record = useRecordContext();
+  const translate = useTranslate();
+  return (
+    <span>
+      {translate("resources.destinations.name", 1)} {record.destination}
+    </span>
+  );
+};
+
 export const DestinationList = props => {
   return (
     <List
@@ -45,27 +114,72 @@ export const DestinationList = props => {
       sort={{ field: "destination", order: "ASC" }}
       bulkActionButtons={false}
     >
-      <Datagrid rowClick="show" rowStyle={destinationRowStyle}>
+      <Datagrid
+        rowStyle={destinationRowStyle}
+        rowClick={(id, basePath, record) => `${basePath}/${id}/show/rooms`}
+      >
         <TextField source="destination" />
         <DateField source="failure_ts" showTime options={date_format} />
         <DateField source="retry_last_ts" showTime options={date_format} />
         <TextField source="retry_interval" />
         <TextField source="last_successful_stream_ordering" />
+        <DestinationReconnectButton />
       </Datagrid>
     </List>
   );
 };
 
 export const DestinationShow = props => {
+  const translate = useTranslate();
   return (
-    <Show {...props}>
-      <SimpleShowLayout>
-        <TextField source="destination" />
-        <DateField source="failure_ts" showTime options={date_format} />
-        <DateField source="retry_last_ts" showTime options={date_format} />
-        <TextField source="retry_interval" />
-        <TextField source="last_successful_stream_ordering" />
-      </SimpleShowLayout>
+    <Show
+      actions={<DestinationShowActions />}
+      title={<DestinationTitle />}
+      {...props}
+    >
+      <TabbedShowLayout>
+        <Tab label="status" icon={<ViewListIcon />}>
+          <TextField source="destination" />
+          <DateField source="failure_ts" showTime options={date_format} />
+          <DateField source="retry_last_ts" showTime options={date_format} />
+          <TextField source="retry_interval" />
+          <TextField source="last_successful_stream_ordering" />
+        </Tab>
+
+        <Tab
+          label={translate("resources.rooms.name", { smart_count: 2 })}
+          icon={<FolderSharedIcon />}
+          path="rooms"
+        >
+          <ReferenceManyField
+            reference="destination_rooms"
+            target="destination"
+            addLabel={false}
+            pagination={<DestinationPagination />}
+            perPage={50}
+          >
+            <Datagrid
+              style={{ width: "100%" }}
+              rowClick={(id, basePath, record) => `/rooms/${id}/show`}
+            >
+              <TextField
+                source="room_id"
+                label="resources.rooms.fields.room_id"
+              />
+              <TextField source="stream_ordering" sortable={false} />
+              <ReferenceField
+                label="resources.rooms.fields.name"
+                source="id"
+                reference="rooms"
+                sortable={false}
+                link=""
+              >
+                <TextField source="name" sortable={false} />
+              </ReferenceField>
+            </Datagrid>
+          </ReferenceManyField>
+        </Tab>
+      </TabbedShowLayout>
     </Show>
   );
 };

src/i18n/de.js

@@ -360,7 +360,9 @@ const de = {
         retry_last_ts: "Letzter Wiederholungsversuch",
         retry_interval: "Wiederholungsintervall",
         last_successful_stream_ordering: "letzte erfogreicher Stream",
+        stream_ordering: "Stream",
       },
+      action: { reconnect: "Neu verbinden" },
     },
   },
   ra: {

src/i18n/en.js

@@ -356,7 +356,9 @@ const en = {
         retry_last_ts: "Last retry timestamp",
         retry_interval: "Retry interval",
         last_successful_stream_ordering: "Last successful stream",
+        stream_ordering: "Stream",
       },
+      action: { reconnect: "Reconnect" },
     },
   },
 };

src/synapse/dataProvider.js

@@ -285,6 +285,23 @@ const resourceMap = {
     total: json => {
       return json.total;
     },
+    delete: params => ({
+      endpoint: `/_synapse/admin/v1/federation/destinations/${params.id}/reset_connection`,
+      method: "POST",
+    }),
+  },
+  destination_rooms: {
+    map: dstroom => ({
+      ...dstroom,
+      id: dstroom.room_id,
+    }),
+    reference: id => ({
+      endpoint: `/_synapse/admin/v1/federation/destinations/${id}/rooms`,
+    }),
+    data: "rooms",
+    total: json => {
+      return json.total;
+    },
   },
 };