Add a new tab to user page with media

This commit is contained in:
dklimpel 2021-01-23 19:04:33 +01:00
parent 2f96951c19
commit 232fe9773f
5 changed files with 105 additions and 1 deletions

View File

@ -52,6 +52,7 @@ const App = () => (
<Resource name="connections" /> <Resource name="connections" />
<Resource name="devices" /> <Resource name="devices" />
<Resource name="room_members" /> <Resource name="room_members" />
<Resource name="users_media" />
<Resource name="servernotices" /> <Resource name="servernotices" />
</Admin> </Admin>
); );

View File

@ -5,6 +5,7 @@ import ContactMailIcon from "@material-ui/icons/ContactMail";
import DevicesIcon from "@material-ui/icons/Devices"; import DevicesIcon from "@material-ui/icons/Devices";
import GetAppIcon from "@material-ui/icons/GetApp"; import GetAppIcon from "@material-ui/icons/GetApp";
import SettingsInputComponentIcon from "@material-ui/icons/SettingsInputComponent"; import SettingsInputComponentIcon from "@material-ui/icons/SettingsInputComponent";
import PermMediaIcon from "@material-ui/icons/PermMedia";
import { import {
ArrayInput, ArrayInput,
ArrayField, ArrayField,
@ -40,6 +41,7 @@ import {
ExportButton, ExportButton,
TopToolbar, TopToolbar,
sanitizeListRestProps, sanitizeListRestProps,
NumberField,
} from "react-admin"; } from "react-admin";
import { ServerNoticeButton, ServerNoticeBulkButton } from "./ServerNotices"; import { ServerNoticeButton, ServerNoticeBulkButton } from "./ServerNotices";
import { DeviceRemoveButton } from "./devices"; import { DeviceRemoveButton } from "./devices";
@ -312,6 +314,7 @@ export const UserEdit = props => {
/> />
<TextField source="consent_version" /> <TextField source="consent_version" />
</FormTab> </FormTab>
<FormTab <FormTab
label="resources.users.threepid" label="resources.users.threepid"
icon={<ContactMailIcon />} icon={<ContactMailIcon />}
@ -330,6 +333,7 @@ export const UserEdit = props => {
</SimpleFormIterator> </SimpleFormIterator>
</ArrayInput> </ArrayInput>
</FormTab> </FormTab>
<FormTab <FormTab
label={translate("resources.devices.name", { smart_count: 2 })} label={translate("resources.devices.name", { smart_count: 2 })}
icon={<DevicesIcon />} icon={<DevicesIcon />}
@ -361,6 +365,7 @@ export const UserEdit = props => {
</Datagrid> </Datagrid>
</ReferenceManyField> </ReferenceManyField>
</FormTab> </FormTab>
<FormTab <FormTab
label="resources.connections.name" label="resources.connections.name"
icon={<SettingsInputComponentIcon />} icon={<SettingsInputComponentIcon />}
@ -400,6 +405,56 @@ export const UserEdit = props => {
</ArrayField> </ArrayField>
</ReferenceField> </ReferenceField>
</FormTab> </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> </TabbedForm>
</Edit> </Edit>
); );

View File

@ -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: { servernotices: {
name: "Serverbenachrichtigungen", name: "Serverbenachrichtigungen",
send: "Servernachricht versenden", send: "Servernachricht versenden",

View File

@ -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: { servernotices: {
name: "Server Notices", name: "Server Notices",
send: "Send server notices", send: "Send server notices",

View File

@ -113,6 +113,24 @@ const resourceMap = {
data: "members", data: "members",
total: json => json.members.length, 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: { servernotices: {
map: n => ({ id: n.event_id }), map: n => ({ id: n.event_id }),
create: data => ({ create: data => ({
@ -210,6 +228,10 @@ const dataProvider = {
console.log("getManyReference " + resource); console.log("getManyReference " + resource);
const { page, perPage } = params.pagination; const { page, perPage } = params.pagination;
const from = (page - 1) * perPage; const from = (page - 1) * perPage;
const query = {
from: from,
limit: perPage,
};
const homeserver = localStorage.getItem("base_url"); const homeserver = localStorage.getItem("base_url");
if (!homeserver || !(resource in resourceMap)) return Promise.reject(); if (!homeserver || !(resource in resourceMap)) return Promise.reject();
@ -217,7 +239,7 @@ const dataProvider = {
const res = resourceMap[resource]; const res = resourceMap[resource];
const ref = res["reference"](params.id); 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 }) => ({ return jsonClient(endpoint_url).then(({ headers, json }) => ({
data: json[res.data].map(res.map), data: json[res.data].map(res.map),