Add RoomShow (detail view) to Rooms

API was added by synapse v1.14.0.
This commit is contained in:
dklimpel 2020-05-29 22:46:30 +02:00
parent 0ada5287d7
commit 3f005a19a6
4 changed files with 98 additions and 4 deletions

View File

@ -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 } from "./components/rooms";
import { RoomList, 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";
@ -35,7 +35,7 @@ const App = () => (
edit={UserEdit}
icon={UserIcon}
/>
<Resource name="rooms" list={RoomList} icon={RoomIcon} />
<Resource name="rooms" list={RoomList} show={RoomShow} icon={RoomIcon} />
<Resource name="connections" />
<Resource name="servernotices" />
</Admin>

View File

@ -1,5 +1,18 @@
import React from "react";
import { Datagrid, List, TextField, Pagination } from "react-admin";
import ViewAgendaIcon from "@material-ui/icons/ViewAgenda";
import PageviewIcon from "@material-ui/icons/Pageview";
import VisibilityIcon from "@material-ui/icons/Visibility";
import {
Datagrid,
List,
TextField,
Pagination,
Show,
TabbedShowLayout,
BooleanField,
useTranslate,
Tab,
} from "react-admin";
const RoomPagination = props => (
<Pagination {...props} rowsPerPageOptions={[10, 25, 50, 100, 500, 1000]} />
@ -7,7 +20,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" />
@ -15,3 +28,54 @@ export const RoomList = props => (
</Datagrid>
</List>
);
const RoomTitle = ({ record }) => {
const translate = useTranslate();
return (
<span>
{translate("resources.rooms.name", { smart_count: 1 })}{" "}
{record ? `"${record.name}"` : ""}
</span>
);
};
export const RoomShow = props => {
const translate = useTranslate();
return (
<Show {...props} title={<RoomTitle />}>
<TabbedShowLayout>
<Tab
label={translate("resources.rooms.tabs.basic")}
icon={<ViewAgendaIcon />}
>
<TextField source="room_id" />
<TextField source="name" />
<TextField source="canonical_alias" />
<TextField source="creator" />
</Tab>
<Tab
label={translate("resources.rooms.tabs.detail")}
icon={<PageviewIcon />}
path="detail"
>
<TextField source="joined_members" />
<TextField source="joined_local_members" />
<TextField source="state_events" />
<TextField source="version" />
<TextField source="encryption" />
</Tab>
<Tab
label={translate("resources.rooms.tabs.permission")}
icon={<VisibilityIcon />}
path="permission"
>
<BooleanField source="federatable" />
<BooleanField source="public" />
<TextField source="join_rules" />
<TextField source="guest_access" />
<TextField source="history_visibility" />
</Tab>
</TabbedShowLayout>
</Show>
);
};

View File

@ -54,6 +54,21 @@ export default {
name: "Name",
canonical_alias: "Alias",
joined_members: "Mitglieder",
joined_local_members: "lokale Mitglieder",
state_events: "Ereignisse",
version: "Version",
encryption: "Verschlüsselung",
federatable: "Fö­de­riert",
public: "Öffentlich",
creator: "Ersteller",
join_rules: "Beitrittsregeln",
guest_access: "Gastzugriff",
history_visibility: "Historie-Sichtbarkeit",
},
tabs: {
basic: "Einfach",
detail: "Details",
permission: "Berechtigungen",
},
},
connections: {

View File

@ -53,6 +53,21 @@ export default {
name: "Name",
canonical_alias: "Alias",
joined_members: "Members",
joined_local_members: "local members",
state_events: "State events",
version: "Version",
encryption: "Encryption",
federatable: "Federatable",
public: "Public",
creator: "Creator",
join_rules: "Join rules",
guest_access: "Guest access",
history_visibility: "History visibility",
},
tabs: {
basic: "Basic",
detail: "Details",
permission: "Permissions",
},
},
connections: {