From 232fe9773f30fbf6ee2ec5fb70e8e0005eced24d Mon Sep 17 00:00:00 2001
From: dklimpel <5740567+dklimpel@users.noreply.github.com>
Date: Sat, 23 Jan 2021 19:04:33 +0100
Subject: [PATCH] Add a new tab to user page with media

---
 src/App.js                  |  1 +
 src/components/users.js     | 55 +++++++++++++++++++++++++++++++++++++
 src/i18n/de.js              | 13 +++++++++
 src/i18n/en.js              | 13 +++++++++
 src/synapse/dataProvider.js | 24 +++++++++++++++-
 5 files changed, 105 insertions(+), 1 deletion(-)

diff --git a/src/App.js b/src/App.js
index 5b784c4..f305d0b 100644
--- a/src/App.js
+++ b/src/App.js
@@ -52,6 +52,7 @@ const App = () => (
     <Resource name="connections" />
     <Resource name="devices" />
     <Resource name="room_members" />
+    <Resource name="users_media" />
     <Resource name="servernotices" />
   </Admin>
 );
diff --git a/src/components/users.js b/src/components/users.js
index 5f8caf8..609de70 100644
--- a/src/components/users.js
+++ b/src/components/users.js
@@ -5,6 +5,7 @@ import ContactMailIcon from "@material-ui/icons/ContactMail";
 import DevicesIcon from "@material-ui/icons/Devices";
 import GetAppIcon from "@material-ui/icons/GetApp";
 import SettingsInputComponentIcon from "@material-ui/icons/SettingsInputComponent";
+import PermMediaIcon from "@material-ui/icons/PermMedia";
 import {
   ArrayInput,
   ArrayField,
@@ -40,6 +41,7 @@ import {
   ExportButton,
   TopToolbar,
   sanitizeListRestProps,
+  NumberField,
 } from "react-admin";
 import { ServerNoticeButton, ServerNoticeBulkButton } from "./ServerNotices";
 import { DeviceRemoveButton } from "./devices";
@@ -312,6 +314,7 @@ export const UserEdit = props => {
           />
           <TextField source="consent_version" />
         </FormTab>
+
         <FormTab
           label="resources.users.threepid"
           icon={<ContactMailIcon />}
@@ -330,6 +333,7 @@ export const UserEdit = props => {
             </SimpleFormIterator>
           </ArrayInput>
         </FormTab>
+
         <FormTab
           label={translate("resources.devices.name", { smart_count: 2 })}
           icon={<DevicesIcon />}
@@ -361,6 +365,7 @@ export const UserEdit = props => {
             </Datagrid>
           </ReferenceManyField>
         </FormTab>
+
         <FormTab
           label="resources.connections.name"
           icon={<SettingsInputComponentIcon />}
@@ -400,6 +405,56 @@ export const UserEdit = props => {
             </ArrayField>
           </ReferenceField>
         </FormTab>
+
+        <FormTab
+          label={translate("resources.users_media.name", { smart_count: 2 })}
+          icon={<PermMediaIcon />}
+          path="media"
+        >
+          <ReferenceManyField
+            reference="users_media"
+            target="user_id"
+            addLabel={false}
+            pagination={<UserPagination />}
+            perPage={50}
+          >
+            <Datagrid style={{ width: "100%" }}>
+              <DateField
+                source="created_ts"
+                showTime
+                options={{
+                  year: "numeric",
+                  month: "2-digit",
+                  day: "2-digit",
+                  hour: "2-digit",
+                  minute: "2-digit",
+                  second: "2-digit",
+                }}
+                sortable={false}
+              />
+              <DateField
+                source="last_access_ts"
+                showTime
+                options={{
+                  year: "numeric",
+                  month: "2-digit",
+                  day: "2-digit",
+                  hour: "2-digit",
+                  minute: "2-digit",
+                  second: "2-digit",
+                }}
+                sortable={false}
+              />
+              <TextField source="media_id" sortable={false} />
+              <NumberField source="media_length" sortable={false} />
+              <TextField source="media_type" sortable={false} />
+              <TextField source="upload_name" sortable={false} />
+              <TextField source="quarantined_by" sortable={false} />
+              <BooleanField source="safe_from_quarantine" sortable={false} />
+              <DeleteButton undoable={false} redirect={false} />
+            </Datagrid>
+          </ReferenceManyField>
+        </FormTab>
       </TabbedForm>
     </Edit>
   );
diff --git a/src/i18n/de.js b/src/i18n/de.js
index 1b60545..e780b8e 100644
--- a/src/i18n/de.js
+++ b/src/i18n/de.js
@@ -223,6 +223,19 @@ export default {
         },
       },
     },
+    users_media: {
+      name: "Medien",
+      fields: {
+        media_id: "Medien ID",
+        media_length: "Größe",
+        media_type: "Typ",
+        upload_name: "Dateiname",
+        quarantined_by: "Zur Quarantäne hinzugefügt",
+        safe_from_quarantine: "Geschützt vor Quarantäne",
+        created_ts: "Erstellt",
+        last_access_ts: "Letzter Zugriff",
+      },
+    },
     servernotices: {
       name: "Serverbenachrichtigungen",
       send: "Servernachricht versenden",
diff --git a/src/i18n/en.js b/src/i18n/en.js
index 76b33aa..591bfbc 100644
--- a/src/i18n/en.js
+++ b/src/i18n/en.js
@@ -220,6 +220,19 @@ export default {
         },
       },
     },
+    users_media: {
+      name: "Media",
+      fields: {
+        media_id: "Media ID",
+        media_length: "Lenght",
+        media_type: "Type",
+        upload_name: "File name",
+        quarantined_by: "Quarantined by",
+        safe_from_quarantine: "Safe from quarantine",
+        created_ts: "Created",
+        last_access_ts: "Last access",
+      },
+    },
     servernotices: {
       name: "Server Notices",
       send: "Send server notices",
diff --git a/src/synapse/dataProvider.js b/src/synapse/dataProvider.js
index 560bdb9..f41500a 100644
--- a/src/synapse/dataProvider.js
+++ b/src/synapse/dataProvider.js
@@ -113,6 +113,24 @@ const resourceMap = {
     data: "members",
     total: json => json.members.length,
   },
+  users_media: {
+    map: um => ({
+      ...um,
+      id: um.media_id,
+    }),
+    reference: id => ({
+      endpoint: `/_synapse/admin/v1/users/${id}/media`,
+    }),
+    data: "media",
+    total: json => {
+      return json.total;
+    },
+    delete: params => ({
+      endpoint: `/_synapse/admin/v1/media/${localStorage.getItem(
+        "home_server"
+      )}/${params.id}`,
+    }),
+  },
   servernotices: {
     map: n => ({ id: n.event_id }),
     create: data => ({
@@ -210,6 +228,10 @@ const dataProvider = {
     console.log("getManyReference " + resource);
     const { page, perPage } = params.pagination;
     const from = (page - 1) * perPage;
+    const query = {
+      from: from,
+      limit: perPage,
+    };
 
     const homeserver = localStorage.getItem("base_url");
     if (!homeserver || !(resource in resourceMap)) return Promise.reject();
@@ -217,7 +239,7 @@ const dataProvider = {
     const res = resourceMap[resource];
 
     const ref = res["reference"](params.id);
-    const endpoint_url = homeserver + ref.endpoint;
+    const endpoint_url = `${homeserver}${ref.endpoint}?${stringify(query)}`;
 
     return jsonClient(endpoint_url).then(({ headers, json }) => ({
       data: json[res.data].map(res.map),