sync master

This commit is contained in:
Dirk Klimpel 2020-05-04 19:25:22 +02:00 committed by GitHub
parent e6a1be74de
commit 36fbd70a42
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
11 changed files with 1645 additions and 1183 deletions

View File

@ -6,5 +6,6 @@
"singleQuote": false,
"trailingComma": "es5",
"bracketSpacing": true,
"jsxBracketSameLine": false
"jsxBracketSameLine": false,
"arrowParens": "avoid",
}

View File

@ -4,28 +4,29 @@
"description": "Admin GUI for the Matrix.org server Synapse",
"author": "Awesome Technologies Innovationslabor GmbH",
"license": "Apache-2.0",
"homepage": ".",
"repository": {
"type": "git",
"url": "https://github.com/Awesome-Technologies/synapse-admin"
},
"devDependencies": {
"@testing-library/jest-dom": "^5.1.1",
"@testing-library/react": "^9.4.0",
"@testing-library/user-event": "^8.1.0",
"@testing-library/react": "^10.0.2",
"@testing-library/user-event": "^10.0.1",
"enzyme": "^3.11.0",
"enzyme-adapter-react-16": "^1.15.2",
"eslint": "^6.8.0",
"eslint-config-prettier": "^6.10.0",
"eslint-config-prettier": "^6.10.1",
"eslint-plugin-prettier": "^3.1.2",
"prettier": "^1.19.1"
"prettier": "^2.0.0"
},
"dependencies": {
"prop-types": "^15.7.2",
"ra-language-german": "^2.1.2",
"react": "^16.12.0",
"react-admin": "^3.1.3",
"react-dom": "^16.12.0",
"react-scripts": "^3.3.0"
"react": "^16.13.1",
"react-admin": "^3.4.0",
"react-dom": "^16.13.1",
"react-scripts": "^3.4.1"
},
"scripts": {
"start": "react-scripts start",

View File

@ -36,6 +36,7 @@ const App = () => (
icon={UserIcon}
/>
<Resource name="rooms" list={RoomList} icon={RoomIcon} />
<Resource name="connections" />
</Admin>
);

View File

@ -1,13 +1,17 @@
import React, { useState } from "react";
import {
fetchUtils,
FormDataConsumer,
Notification,
useLogin,
useNotify,
useLocale,
useSetLocale,
useTranslate,
PasswordInput,
TextInput,
} from "react-admin";
import { Field, Form } from "react-final-form";
import { Form, useForm } from "react-final-form";
import {
Avatar,
Button,
@ -34,7 +38,7 @@ const useStyles = makeStyles(theme => ({
backgroundSize: "cover",
},
card: {
minWidth: 300,
minWidth: "30em",
marginTop: "6em",
},
avatar: {
@ -70,7 +74,7 @@ const LoginPage = ({ theme }) => {
var locale = useLocale();
const setLocale = useSetLocale();
const translate = useTranslate();
const homeserver = localStorage.getItem("base_url");
const base_url = localStorage.getItem("base_url");
const renderInput = ({
meta: { touched, error } = {},
@ -88,15 +92,21 @@ const LoginPage = ({ theme }) => {
const validate = values => {
const errors = {};
if (!values.homeserver) {
errors.homeserver = translate("ra.validation.required");
}
if (!values.username) {
errors.username = translate("ra.validation.required");
}
if (!values.password) {
errors.password = translate("ra.validation.required");
}
if (!values.base_url) {
errors.base_url = translate("ra.validation.required");
} else {
if (!values.base_url.match(/^(http|https):\/\//)) {
errors.base_url = translate("synapseadmin.auth.protocol_error");
} else if (!values.base_url.match(/^(http|https):\/\/[a-zA-Z0-9\-.]+$/)) {
errors.base_url = translate("synapseadmin.auth.url_error");
}
}
return errors;
};
@ -115,9 +125,75 @@ const LoginPage = ({ theme }) => {
});
};
const extractHomeServer = username => {
const usernameRegex = /@[a-zA-Z0-9._=\-/]+:([a-zA-Z0-9\-.]+\.[a-zA-Z]+)/;
if (!username) return null;
const res = username.match(usernameRegex);
if (res) return res[1];
return null;
};
const UserData = ({ formData }) => {
const form = useForm();
const handleUsernameChange = _ => {
if (formData.base_url) return;
// check if username is a full qualified userId then set base_url accordially
const home_server = extractHomeServer(formData.username);
const wellKnownUrl = `https://${home_server}/.well-known/matrix/client`;
if (home_server) {
// fetch .well-known entry to get base_url
fetchUtils
.fetchJson(wellKnownUrl, { method: "GET" })
.then(({ json }) => {
form.change("base_url", json["m.homeserver"].base_url);
})
.catch(_ => {
// if there is no .well-known entry, try the home server name
form.change("base_url", `https://${home_server}`);
});
}
};
return (
<div>
<div className={classes.input}>
<TextInput
autoFocus
name="username"
component={renderInput}
label={translate("ra.auth.username")}
disabled={loading}
onBlur={handleUsernameChange}
fullWidth
/>
</div>
<div className={classes.input}>
<PasswordInput
name="password"
component={renderInput}
label={translate("ra.auth.password")}
type="password"
disabled={loading}
fullWidth
/>
</div>
<div className={classes.input}>
<TextInput
name="base_url"
component={renderInput}
label={translate("synapseadmin.auth.base_url")}
disabled={loading}
fullWidth
/>
</div>
</div>
);
};
return (
<Form
initialValues={{ homeserver: homeserver }}
initialValues={{ base_url: base_url }}
onSubmit={handleSubmit}
validate={validate}
render={({ handleSubmit }) => (
@ -146,32 +222,9 @@ const LoginPage = ({ theme }) => {
<MenuItem value="en">English</MenuItem>
</Select>
</div>
<div className={classes.input}>
<Field
autoFocus
name="homeserver"
component={renderInput}
label={translate("synapseadmin.auth.homeserver")}
disabled={loading}
/>
</div>
<div className={classes.input}>
<Field
name="username"
component={renderInput}
label={translate("ra.auth.username")}
disabled={loading}
/>
</div>
<div className={classes.input}>
<Field
name="password"
component={renderInput}
label={translate("ra.auth.password")}
type="password"
disabled={loading}
/>
</div>
<FormDataConsumer>
{formDataProps => <UserData {...formDataProps} />}
</FormDataConsumer>
</div>
<CardActions className={classes.actions}>
<Button

View File

@ -1,8 +1,12 @@
import React from "react";
import { Datagrid, List, TextField } from "react-admin";
import { Datagrid, List, TextField, Pagination } from "react-admin";
const RoomPagination = props => (
<Pagination {...props} rowsPerPageOptions={[10, 25, 50, 100, 500, 1000]} />
);
export const RoomList = props => (
<List {...props}>
<List {...props} pagination={<RoomPagination />}>
<Datagrid>
<TextField source="room_id" />
<TextField source="name" />

View File

@ -1,11 +1,20 @@
import React from "react";
import React, { Fragment } from "react";
import PersonPinIcon from "@material-ui/icons/PersonPin";
import SettingsInputComponentIcon from "@material-ui/icons/SettingsInputComponent";
import {
ArrayInput,
ArrayField,
Datagrid,
DateField,
Create,
Edit,
List,
Filter,
Toolbar,
SimpleForm,
SimpleFormIterator,
TabbedForm,
FormTab,
BooleanField,
BooleanInput,
ImageField,
@ -13,9 +22,19 @@ import {
TextField,
TextInput,
ReferenceField,
SelectInput,
BulkDeleteButton,
DeleteButton,
SaveButton,
regex,
useTranslate,
Pagination,
} from "react-admin";
const UserPagination = props => (
<Pagination {...props} rowsPerPageOptions={[10, 25, 50, 100, 500, 1000]} />
);
const UserFilter = props => (
<Filter {...props}>
<BooleanInput source="guests" alwaysOn />
@ -27,12 +46,26 @@ const UserFilter = props => (
</Filter>
);
const UserBulkActionButtons = props => {
const translate = useTranslate();
return (
<Fragment>
<BulkDeleteButton
{...props}
label="resources.users.action.erase"
title={translate("resources.users.helper.erase")}
/>
</Fragment>
);
};
export const UserList = props => (
<List
{...props}
filters={<UserFilter />}
filterDefaultValues={{ guests: true, deactivated: false }}
bulkActionButtons={false}
bulkActionButtons={<UserBulkActionButtons />}
pagination={<UserPagination />}
>
<Datagrid rowClick="edit">
<ReferenceField
@ -66,6 +99,19 @@ const validateUser = regex(
"synapseadmin.users.invalid_user_id"
);
const UserEditToolbar = props => {
const translate = useTranslate();
return (
<Toolbar {...props}>
<SaveButton submitOnEnter={true} />
<DeleteButton
label="resources.users.action.erase"
title={translate("resources.users.helper.erase")}
/>
</Toolbar>
);
};
export const UserCreate = props => (
<Create {...props}>
<SimpleForm>
@ -73,18 +119,89 @@ export const UserCreate = props => (
<TextInput source="displayname" />
<PasswordInput source="password" autoComplete="new-password" />
<BooleanInput source="admin" />
<ArrayInput source="threepids">
<SimpleFormIterator>
<SelectInput
source="medium"
choices={[
{ id: "email", name: "resources.users.email" },
{ id: "msisdn", name: "resources.users.msisdn" },
]}
/>
<TextInput source="address" />
</SimpleFormIterator>
</ArrayInput>
</SimpleForm>
</Create>
);
const UserTitle = ({ record }) => {
const translate = useTranslate();
return (
<span>
{translate("resources.users.name")}{" "}
{record ? `"${record.displayname}"` : ""}
</span>
);
};
export const UserEdit = props => (
<Edit {...props}>
<SimpleForm>
<TextInput source="id" disabled />
<TextInput source="displayname" />
<PasswordInput source="password" autoComplete="new-password" />
<BooleanInput source="admin" />
<BooleanInput source="deactivated" />
</SimpleForm>
<Edit {...props} title={<UserTitle />}>
<TabbedForm toolbar={<UserEditToolbar />}>
<FormTab label="resources.users.name" icon={<PersonPinIcon />}>
<TextInput source="id" disabled />
<TextInput source="displayname" />
<PasswordInput source="password" autoComplete="new-password" />
<BooleanInput source="admin" />
<BooleanInput
source="deactivated"
helperText="resources.users.helper.deactivate"
/>
<ArrayInput source="threepids">
<SimpleFormIterator>
<SelectInput
source="medium"
choices={[
{ id: "email", name: "resources.users.email" },
{ id: "msisdn", name: "resources.users.msisdn" },
]}
/>
<TextInput source="address" />
</SimpleFormIterator>
</ArrayInput>
</FormTab>
<FormTab
label="resources.connections.name"
icon={<SettingsInputComponentIcon />}
>
<ReferenceField reference="connections" source="id" addLabel={false}>
<ArrayField
source="devices[].sessions[0].connections"
label="resources.connections.name"
>
<Datagrid style={{ width: "100%" }}>
<TextField source="ip" sortable={false} />
<DateField
source="last_seen"
showTime
options={{
year: "numeric",
month: "2-digit",
day: "2-digit",
hour: "2-digit",
minute: "2-digit",
second: "2-digit",
}}
sortable={false}
/>
<TextField
source="user_agent"
sortable={false}
style={{ width: "100%" }}
/>
</Datagrid>
</ArrayField>
</ReferenceField>
</FormTab>
</TabbedForm>
</Edit>
);

View File

@ -4,8 +4,11 @@ export default {
...germanMessages,
synapseadmin: {
auth: {
homeserver: "Heimserver",
base_url: "Heimserver URL",
welcome: "Willkommen bei Synapse-admin",
username_error: "Bitte vollständigen Nutzernamen angeben: '@user:domain'",
protocol_error: "Die URL muss mit 'http://' oder 'https://' beginnen",
url_error: "Keine gültige Matrix Server URL",
},
users: {
invalid_user_id:
@ -14,7 +17,10 @@ export default {
},
resources: {
users: {
backtolist: "Zurück zur Liste",
name: "Benutzer",
email: "E-Mail",
msisdn: "Telefon",
fields: {
avatar: "Avatar",
id: "Benutzer-ID",
@ -27,6 +33,17 @@ export default {
user_id: "Suche Benutzer",
displayname: "Anzeigename",
password: "Passwort",
avatar_url: "Avatar URL",
medium: "Medium",
threepids: "3PIDs",
address: "Adresse",
},
helper: {
deactivate: "Deaktivierte Nutzer können nicht wieder aktiviert werden.",
erase: "DSGVO konformes Löschen der Benutzerdaten",
},
action: {
erase: "Lösche Benutzerdaten",
},
},
rooms: {
@ -38,5 +55,32 @@ export default {
joined_members: "Mitglieder",
},
},
connections: {
name: "Verbindungen",
fields: {
last_seen: "Datum",
ip: "IP-Adresse",
user_agent: "User Agent",
},
},
},
ra: {
...germanMessages.ra,
auth: {
...germanMessages.ra.auth,
auth_check_error: "Anmeldung fehlgeschlagen",
},
input: {
...germanMessages.ra.input,
password: {
...germanMessages.ra.input.password,
toggle_hidden: "Anzeigen",
toggle_visible: "Verstecken",
},
},
notification: {
...germanMessages.ra.notifiaction,
logged_out: "Abgemeldet",
},
},
};

View File

@ -4,8 +4,11 @@ export default {
...englishMessages,
synapseadmin: {
auth: {
homeserver: "Homeserver",
base_url: "Homeserver URL",
welcome: "Welcome to Synapse-admin",
username_error: "Please enter fully qualified user ID: '@user:domain'",
protocol_error: "URL has to start with 'http://' or 'https://'",
url_error: "Not a valid Matrix server URL",
},
users: {
invalid_user_id:
@ -14,7 +17,10 @@ export default {
},
resources: {
users: {
backtolist: "Back to list",
name: "User |||| Users",
email: "Email",
msisdn: "Phone",
fields: {
avatar: "Avatar",
id: "User-ID",
@ -27,6 +33,17 @@ export default {
user_id: "Search user",
displayname: "Displayname",
password: "Password",
avatar_url: "Avatar URL",
medium: "Medium",
threepids: "3PIDs",
address: "Address",
},
helper: {
deactivate: "Deactivated users cannot be reactivated",
erase: "Mark the user as GDPR-erased",
},
action: {
erase: "Erase user data",
},
},
rooms: {
@ -38,5 +55,13 @@ export default {
joined_members: "Members",
},
},
connections: {
name: "Connections",
fields: {
last_seen: "Date",
ip: "IP address",
user_agent: "User agent",
},
},
},
};

View File

@ -1,23 +1,8 @@
import { fetchUtils } from "react-admin";
const ensureHttpsForUrl = url => {
if (/^https:\/\//i.test(url)) {
return url;
}
const domain = url.replace(/http.?:\/\//g, "");
return "https://" + domain;
};
const stripTrailingSlash = str => {
if (!str) {
return;
}
return str.endsWith("/") ? str.slice(0, -1) : str;
};
const authProvider = {
// called when the user attempts to log in
login: ({ homeserver, username, password }) => {
login: ({ base_url, username, password }) => {
console.log("login ");
const options = {
method: "POST",
@ -28,17 +13,16 @@ const authProvider = {
}),
};
const url = window.decodeURIComponent(homeserver);
const trimmed_url = url.trim().replace(/\s/g, "");
const login_api_url =
ensureHttpsForUrl(trimmed_url) + "/_matrix/client/r0/login";
// use the base_url from login instead of the well_known entry from the
// server, since the admin might want to access the admin API via some
// private address
localStorage.setItem("base_url", base_url);
const decoded_base_url = window.decodeURIComponent(base_url);
const login_api_url = decoded_base_url + "/_matrix/client/r0/login";
return fetchUtils.fetchJson(login_api_url, options).then(({ json }) => {
const normalized_base_url = stripTrailingSlash(
json.well_known["m.homeserver"].base_url
);
localStorage.setItem("base_url", normalized_base_url);
localStorage.setItem("home_server_url", json.home_server);
localStorage.setItem("home_server", json.home_server);
localStorage.setItem("user_id", json.user_id);
localStorage.setItem("access_token", json.access_token);
localStorage.setItem("device_id", json.device_id);

View File

@ -26,8 +26,20 @@ const resourceMap = {
}),
data: "users",
total: (json, from, perPage) => {
return json.next_token ? parseInt(json.next_token, 10) + perPage : from + json.users.length;
return json.next_token
? parseInt(json.next_token, 10) + perPage
: from + json.users.length;
},
create: data => ({
endpoint: `/_synapse/admin/v2/users/${data.id}`,
body: data,
method: "PUT",
}),
delete: id => ({
endpoint: `/_synapse/admin/v1/deactivate/${id}`,
body: { erase: true },
method: "POST",
}),
},
rooms: {
path: "/_synapse/admin/v1/rooms",
@ -42,6 +54,14 @@ const resourceMap = {
return json.total_rooms;
},
},
connections: {
path: "/_synapse/admin/v1/whois",
map: c => ({
...c,
id: c.user_id,
}),
data: "connections",
},
};
function filterNullValues(key, value) {
@ -70,8 +90,8 @@ const dataProvider = {
const res = resourceMap[resource];
const homeserver_url = homeserver + res.path;
const url = `${homeserver_url}?${stringify(query)}`;
const endpoint_url = homeserver + res.path;
const url = `${endpoint_url}?${stringify(query)}`;
return jsonClient(url).then(({ json }) => ({
data: json[res.data].map(res.map),
@ -86,8 +106,8 @@ const dataProvider = {
const res = resourceMap[resource];
const homeserver_url = homeserver + res.path;
return jsonClient(`${homeserver_url}/${params.id}`).then(({ json }) => ({
const endpoint_url = homeserver + res.path;
return jsonClient(`${endpoint_url}/${params.id}`).then(({ json }) => ({
data: res.map(json),
}));
},
@ -99,9 +119,9 @@ const dataProvider = {
const res = resourceMap[resource];
const homeserver_url = homeserver + res.path;
const endpoint_url = homeserver + res.path;
return Promise.all(
params.ids.map(id => jsonClient(`${homeserver_url}/${id}`))
params.ids.map(id => jsonClient(`${endpoint_url}/${id}`))
).then(responses => ({
data: responses.map(({ json }) => res.map(json)),
}));
@ -126,18 +146,12 @@ const dataProvider = {
const res = resourceMap[resource];
const homeserver_url = homeserver + res.path;
const url = `${homeserver_url}?${stringify(query)}`;
const endpoint_url = homeserver + res.path;
const url = `${endpoint_url}?${stringify(query)}`;
return jsonClient(url).then(({ headers, json }) => ({
data: json,
total: parseInt(
headers
.get("content-range")
.split("/")
.pop(),
10
),
total: parseInt(headers.get("content-range").split("/").pop(), 10),
}));
},
@ -148,8 +162,8 @@ const dataProvider = {
const res = resourceMap[resource];
const homeserver_url = homeserver + res.path;
return jsonClient(`${homeserver_url}/${params.data.id}`, {
const endpoint_url = homeserver + res.path;
return jsonClient(`${endpoint_url}/${params.data.id}`, {
method: "PUT",
body: JSON.stringify(params.data, filterNullValues),
}).then(({ json }) => ({
@ -164,9 +178,9 @@ const dataProvider = {
const res = resourceMap[resource];
const homeserver_url = homeserver + res.path;
const endpoint_url = homeserver + res.path;
return Promise.all(
params.ids.map(id => jsonClient(`${homeserver_url}/${id}`), {
params.ids.map(id => jsonClient(`${endpoint_url}/${id}`), {
method: "PUT",
body: JSON.stringify(params.data, filterNullValues),
})
@ -181,11 +195,13 @@ const dataProvider = {
if (!homeserver || !(resource in resourceMap)) return Promise.reject();
const res = resourceMap[resource];
if (!("create" in res)) return Promise.reject();
const homeserver_url = homeserver + res.path;
return jsonClient(`${homeserver_url}/${params.data.id}`, {
method: "PUT",
body: JSON.stringify(params.data, filterNullValues),
const create = res["create"](params.data);
const endpoint_url = homeserver + create.endpoint;
return jsonClient(endpoint_url, {
method: create.method,
body: JSON.stringify(create.body, filterNullValues),
}).then(({ json }) => ({
data: res.map(json),
}));
@ -198,12 +214,24 @@ const dataProvider = {
const res = resourceMap[resource];
const homeserver_url = homeserver + res.path;
return jsonClient(`${homeserver_url}/${params.id}`, {
method: "DELETE",
}).then(({ json }) => ({
data: json,
}));
if ("delete" in res) {
const del = res["delete"](params.id);
const endpoint_url = homeserver + del.endpoint;
return jsonClient(endpoint_url, {
method: del.method,
body: JSON.stringify(del.body),
}).then(({ json }) => ({
data: json,
}));
} else {
const endpoint_url = homeserver + res.path;
return jsonClient(`${endpoint_url}/${params.id}`, {
method: "DELETE",
body: JSON.stringify(params.data, filterNullValues),
}).then(({ json }) => ({
data: json,
}));
}
},
deleteMany: (resource, params) => {
@ -213,17 +241,32 @@ const dataProvider = {
const res = resourceMap[resource];
const homeserver_url = homeserver + res.path;
return Promise.all(
params.ids.map(id =>
jsonClient(`${homeserver_url}/${id}`, {
method: "DELETE",
body: JSON.stringify(params.data, filterNullValues),
}).then(responses => ({
data: responses.map(({ json }) => json),
}))
)
);
if ("delete" in res) {
return Promise.all(
params.ids.map(id => {
const del = res["delete"](id);
const endpoint_url = homeserver + del.endpoint;
return jsonClient(endpoint_url, {
method: del.method,
body: JSON.stringify(del.body),
});
})
).then(responses => ({
data: responses.map(({ json }) => json),
}));
} else {
const endpoint_url = homeserver + res.path;
return Promise.all(
params.ids.map(id =>
jsonClient(`${endpoint_url}/${id}`, {
method: "DELETE",
body: JSON.stringify(params.data, filterNullValues),
})
)
).then(responses => ({
data: responses.map(({ json }) => json),
}));
}
},
};

2311
yarn.lock

File diff suppressed because it is too large Load Diff