Allow importing csv files

Change-Id: I8f4c417c1762ba6dbc0fa929ecf8262e6e8a2e42

package.json

@@ -20,15 +20,13 @@
     "prettier": "^2.0.0"
   },
   "dependencies": {
-    "@progress/kendo-drawing": "^1.6.0",
-    "@progress/kendo-react-pdf": "^3.10.1",
     "prop-types": "^15.7.2",
-    "qrcode.react": "^1.0.0",
     "ra-language-german": "^2.1.2",
     "react": "^16.13.1",
     "react-admin": "^3.4.0",
     "react-dom": "^16.13.1",
-    "react-scripts": "^3.4.1"
+    "react-scripts": "^3.4.1",
+    "react-admin-import-csv": "^0.2.5"
   },
   "scripts": {
     "start": "react-scripts start",

src/App.js

@@ -10,8 +10,6 @@ import UserIcon from "@material-ui/icons/Group";
 import { ViewListIcon as RoomIcon } from "@material-ui/icons/ViewList";
 import germanMessages from "./i18n/de";
 import englishMessages from "./i18n/en";
-import ShowUserPdf from "./components/ShowUserPdf";
-import { Route } from "react-router-dom";
 
 // TODO: Can we use lazy loading together with browser locale?
 const messages = {
@@ -29,9 +27,6 @@ const App = () => (
     authProvider={authProvider}
     dataProvider={dataProvider}
     i18nProvider={i18nProvider}
-    customRoutes={[
-      <Route key="showpdf" path="/showpdf" component={ShowUserPdf} />,
-    ]}
   >
     <Resource
       name="users"

src/components/SaveQrButton.js

@@ -1,35 +0,0 @@
-import React, { useCallback } from "react";
-import { SaveButton, useCreate, useRedirect, useNotify } from "react-admin";
-
-const SaveQrButton = props => {
-  const [create] = useCreate("users");
-  const redirectTo = useRedirect();
-  const notify = useNotify();
-  const { basePath } = props;
-
-  const handleSave = useCallback(
-    (values, redirect) => {
-      create(
-        {
-          payload: { data: { ...values } },
-        },
-        {
-          onSuccess: ({ data: newRecord }) => {
-            notify("ra.notification.created", "info", {
-              smart_count: 1,
-            });
-            redirectTo(redirect, basePath, newRecord.id, {
-              password: values.password,
-              ...newRecord,
-            });
-          },
-        }
-      );
-    },
-    [create, notify, redirectTo, basePath]
-  );
-
-  return <SaveButton {...props} onSave={handleSave} />;
-};
-
-export default SaveQrButton;

src/components/ShowUserPdf.js

@@ -1,132 +0,0 @@
-import React from "react";
-import { Title, Button } from "react-admin";
-import { makeStyles } from "@material-ui/core/styles";
-import { PDFExport } from "@progress/kendo-react-pdf";
-import QRCode from "qrcode.react";
-
-function xor(a, b) {
-  var res = "";
-  for (var i = 0; i < a.length; i++) {
-    res += String.fromCharCode(a.charCodeAt(i) ^ b.charCodeAt(i % b.length));
-  }
-  return res;
-}
-
-function calculateQrString(serverUrl, username, password) {
-  const magicString = "wo9k5tep252qxsa5yde7366kugy6c01w7oeeya9hrmpf0t7ii7";
-  var urlString = "user=" + username + "&password=" + password;
-
-  urlString = xor(urlString, magicString); // xor with magic string
-  urlString = btoa(urlString); // to base64
-
-  return serverUrl + "/#" + urlString;
-}
-
-const ShowUserPdf = props => {
-  const useStyles = makeStyles(theme => ({
-    page: {
-      height: 800,
-      width: 566,
-      padding: "none",
-      backgroundColor: "white",
-      boxShadow: "5px 5px 5px black",
-      margin: "auto",
-      overflowX: "hidden",
-      overflowY: "hidden",
-    },
-    header: {
-      height: 144,
-      width: 534,
-      marginLeft: 32,
-      marginTop: 15,
-    },
-    name: {
-      width: 233,
-      fontSize: 40,
-      float: "left",
-      marginTop: 15,
-    },
-    logo: {
-      width: 90,
-      marginTop: 20,
-      marginRight: 32,
-      float: "left",
-    },
-    code: {
-      marginLeft: 330,
-      marginTop: 86,
-    },
-    qr: {
-      marginRight: 40,
-      float: "right",
-    },
-    note: {
-      fontSize: 18,
-      marginTop: 100,
-      marginLeft: 32,
-      marginRight: 32,
-    },
-  }));
-
-  const classes = useStyles();
-
-  var resume;
-
-  const exportPDF = () => {
-    resume.save();
-  };
-
-  var qrCode = "";
-  var displayname = "";
-
-  if (
-    props.location.state &&
-    props.location.state.id &&
-    props.location.state.password
-  ) {
-    const { id, password } = props.location.state;
-
-    const username = id.substring(1, id.indexOf(":"));
-    const serverUrl = "https://" + id.substring(id.indexOf(":") + 1);
-
-    const qrString = calculateQrString(serverUrl, username, password);
-
-    qrCode = <QRCode value={qrString} size={128} />;
-    displayname = props.location.state.displayname;
-  }
-
-  return (
-    <div>
-      <Title title="PDF" />
-      <Button label="synapseadmin.action.download_pdf" onClick={exportPDF} />
-
-      <PDFExport
-        paperSize={"A4"}
-        fileName="User.pdf"
-        title=""
-        subject=""
-        keywords=""
-        ref={r => (resume = r)}
-      >
-        <div className={classes.page}>
-          <div className={classes.code}>Ihr persönlicher Anmeldecode:</div>
-          <div className={classes.header}>
-            <div className={classes.name}>{displayname}</div>
-            <img className={classes.logo} alt="Logo" src="images/logo.png" />
-            <div className={classes.qr}>{qrCode}</div>
-          </div>
-          <div className={classes.note}>
-            Hier können Sie Ihre selbst gewählte Schlüsselsicherungs-Passphrase
-            notieren:
-            <br />
-            <br />
-            <br />
-            <hr />
-          </div>
-        </div>
-      </PDFExport>
-    </div>
-  );
-};
-
-export default ShowUserPdf;

src/components/users.js

@@ -1,4 +1,4 @@
-import React, { Fragment } from "react";
+import React from "react";
 import PersonPinIcon from "@material-ui/icons/PersonPin";
 import SettingsInputComponentIcon from "@material-ui/icons/SettingsInputComponent";
 import {
@@ -10,7 +10,6 @@ import {
   Edit,
   List,
   Filter,
-  Toolbar,
   SimpleForm,
   SimpleFormIterator,
   TabbedForm,
@@ -21,17 +20,15 @@ import {
   PasswordInput,
   TextField,
   TextInput,
-  SearchInput,
   ReferenceField,
+  Toolbar,
+  TopToolbar,
   SelectInput,
-  BulkDeleteButton,
-  DeleteButton,
-  SaveButton,
   regex,
-  useTranslate,
   Pagination,
 } from "react-admin";
-import SaveQrButton from "./SaveQrButton";
+import { ImportButton } from "react-admin-import-csv";
+import { CreateButton, ExportButton } from "ra-ui-materialui";
 
 const UserPagination = props => (
   <Pagination {...props} rowsPerPageOptions={[10, 25, 50, 100, 500, 1000]} />
@@ -39,7 +36,6 @@ const UserPagination = props => (
 
 const UserFilter = props => (
   <Filter {...props}>
-    <SearchInput source="q" alwaysOn />
     <BooleanInput source="guests" alwaysOn />
     <BooleanInput
       label="resources.users.fields.show_deactivated"
@@ -49,16 +45,28 @@ const UserFilter = props => (
   </Filter>
 );
 
-const UserBulkActionButtons = props => {
+const ListActions = props => {
-  const translate = useTranslate();
+  const {
+    className,
+    basePath,
+    total,
+    resource,
+    currentSort,
+    filterValues,
+    exporter
+  } = props;
   return (
-    <Fragment>
+    <TopToolbar className={className}>
-      <BulkDeleteButton
+      <CreateButton basePath={basePath} />
-        {...props}
+      <ImportButton {...props} />
-        label="resources.users.action.erase"
+      <ExportButton
-        title={translate("resources.users.helper.erase")}
+        disabled={total === 0}
+        resource={resource}
+        sort={currentSort}
+        filter={filterValues}
+        exporter={exporter}
       />
-    </Fragment>
+    </TopToolbar>
   );
 };
 
@@ -67,8 +75,9 @@ export const UserList = props => (
     {...props}
     filters={<UserFilter />}
     filterDefaultValues={{ guests: true, deactivated: false }}
-    bulkActionButtons={<UserBulkActionButtons />}
+    bulkActionButtons={false}
     pagination={<UserPagination />}
+    actions={<ListActions />}
   >
     <Datagrid rowClick="edit">
       <ReferenceField
@@ -96,107 +105,15 @@ export const UserList = props => (
   </List>
 );
 
-function generateRandomUser() {
-  const homeserver = localStorage.getItem("home_server");
-  const user_id =
-    "@" +
-    Array(8)
-      .fill("0123456789abcdefghijklmnopqrstuvwxyz")
-      .map(
-        x =>
-          x[
-            Math.floor(
-              (crypto.getRandomValues(new Uint32Array(1))[0] /
-                (0xffffffff + 1)) *
-                x.length
-            )
-          ]
-      )
-      .join("") +
-    ":" +
-    homeserver;
-
-  const password = Array(20)
-    .fill(
-      "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz~!@-#$"
-    )
-    .map(
-      x =>
-        x[
-          Math.floor(
-            (crypto.getRandomValues(new Uint32Array(1))[0] / (0xffffffff + 1)) *
-              x.length
-          )
-        ]
-    )
-    .join("");
-
-  return {
-    id: user_id,
-    password: password,
-  };
-}
-
-// redirect to the related Author show page
-const redirect = (basePath, id, data) => {
-  return {
-    pathname: "/showpdf",
-    state: {
-      id: data.id,
-      displayname: data.displayname,
-      password: data.password,
-    },
-  };
-};
-
-const UserCreateToolbar = props => (
-  <Toolbar {...props}>
-    <SaveQrButton
-      label="synapseadmin.action.save_and_show"
-      redirect={redirect}
-      submitOnEnter={true}
-    />
-    <SaveButton
-      label="synapseadmin.action.save_only"
-      redirect="list"
-      submitOnEnter={false}
-      variant="text"
-    />
-  </Toolbar>
-);
-
 // https://matrix.org/docs/spec/appendices#user-identifiers
 const validateUser = regex(
   /^@[a-z0-9._=\-/]+:.*/,
   "synapseadmin.users.invalid_user_id"
 );
 
-const UserEditToolbar = props => {
-  const translate = useTranslate();
-  return (
-    <Toolbar {...props}>
-      <SaveQrButton
-        label="synapseadmin.action.save_and_show"
-        redirect={redirect}
-        submitOnEnter={true}
-      />
-      <SaveButton
-        label="synapseadmin.action.save_only"
-        redirect="list"
-        submitOnEnter={false}
-        variant="text"
-      />
-      <DeleteButton
-        label="resources.users.action.erase"
-        title={translate("resources.users.helper.erase")}
-      />
-    </Toolbar>
-  );
-};
-
 export const UserCreate = props => (
-  <Create record={generateRandomUser()} {...props}>
+  <Create {...props}>
-    <SimpleForm toolbar={<UserCreateToolbar />}>
+    <SimpleForm>
       <TextInput source="id" autoComplete="off" validate={validateUser} />
       <TextInput source="displayname" />
       <PasswordInput source="password" autoComplete="new-password" />
@@ -219,7 +136,7 @@ export const UserCreate = props => (
 
 export const UserEdit = props => (
   <Edit {...props}>
-    <TabbedForm toolbar={<UserEditToolbar />}>
+    <TabbedForm>
       <FormTab label="resources.users.name" icon={<PersonPinIcon />}>
         <TextInput source="id" disabled />
         <TextInput source="displayname" />

src/i18n/de.js

@@ -7,11 +7,6 @@ export default {
       homeserver: "Heimserver",
       welcome: "Willkommen bei Synapse-admin",
     },
-    action: {
-      save_and_show: "Speichern und QR Code erzeugen",
-      save_only: "Nur speichern",
-      download_pdf: "PDF speichern",
-    },
     users: {
       invalid_user_id:
         "Muss eine vollständige Matrix Benutzer-ID sein, z.B. @benutzer_id:homeserver",
@@ -42,10 +37,6 @@ export default {
       },
       helper: {
         deactivate: "Deaktivierte Nutzer können nicht wieder aktiviert werden.",
-        erase: "DSGVO konformes Löschen der Benutzerdaten",
-      },
-      action: {
-        erase: "Lösche Benutzerdaten",
       },
     },
     rooms: {
@@ -66,15 +57,4 @@ export default {
       },
     },
   },
-  ra: {
-    ...germanMessages.ra,
-    input: {
-      ...germanMessages.ra.input,
-      password: {
-        ...germanMessages.ra.input.password,
-        toggle_hidden: "Anzeigen",
-        toggle_visible: "Verstecken",
-      },
-    },
-  },
 };

src/i18n/en.js

@@ -7,11 +7,6 @@ export default {
       homeserver: "Homeserver",
       welcome: "Welcome to Synapse-admin",
     },
-    action: {
-      save_and_show: "Create QR code",
-      save_only: "Save",
-      download_pdf: "Download PDF",
-    },
     users: {
       invalid_user_id:
         "Must be a fully qualified Matrix user-id, e.g. @user_id:homeserver",
@@ -42,10 +37,6 @@ export default {
       },
       helper: {
         deactivate: "Deactivated users cannot be reactivated",
-        erase: "Mark the user as GDPR-erased",
-      },
-      action: {
-        erase: "Erase user data",
       },
     },
     rooms: {

src/synapse/dataProvider.js

@@ -30,11 +30,6 @@ const resourceMap = {
         ? parseInt(json.next_token, 10) + perPage
         : from + json.users.length;
     },
-    delete: id => ({
-      endpoint: `/_synapse/admin/v1/deactivate/${id}`,
-      body: { erase: true },
-      method: "POST",
-    }),
   },
   rooms: {
     path: "/_synapse/admin/v1/rooms",
@@ -88,25 +83,6 @@ const dataProvider = {
     const homeserver_url = homeserver + res.path;
     const url = `${homeserver_url}?${stringify(query)}`;
 
-    // searching for users is not implemented in admin api
-    if (params.filter.q) {
-      console.log("searching");
-      const search_query = { limit: perPage, search_term: params.filter.q };
-      const search_url =
-        homeserver + `/_matrix/client/r0/user_directory/search`;
-      return jsonClient(search_url, {
-        method: "POST",
-        body: JSON.stringify(search_query),
-      }).then(({ json }) => ({
-        data: json["results"].map(u => ({
-          ...u,
-          id: u.user_id,
-          name: u.user_id,
-        })),
-        total: json.limited ? perPage * 2 : json.results.length,
-      }));
-    }
-
     return jsonClient(url).then(({ json }) => ({
       data: json[res.data].map(res.map),
       total: res.total(json, from, perPage),
@@ -226,24 +202,12 @@ const dataProvider = {
 
     const res = resourceMap[resource];
 
-    if ("delete" in res) {
+    const homeserver_url = homeserver + res.path;
-      const del = res["delete"](params.id);
+    return jsonClient(`${homeserver_url}/${params.id}`, {
-      const homeserver_url = homeserver + del.endpoint;
+      method: "DELETE",
-      return jsonClient(homeserver_url, {
+    }).then(({ json }) => ({
-        method: del.method,
+      data: json,
-        body: JSON.stringify(del.body),
+    }));
-      }).then(({ json }) => ({
-        data: json,
-      }));
-    } else {
-      const homeserver_url = homeserver + res.path;
-      return jsonClient(`${homeserver_url}/${params.id}`, {
-        method: "DELETE",
-        body: JSON.stringify(params.data, filterNullValues),
-      }).then(({ json }) => ({
-        data: json,
-      }));
-    }
   },
 
   deleteMany: (resource, params) => {
@@ -253,32 +217,17 @@ const dataProvider = {
 
     const res = resourceMap[resource];
 
-    if ("delete" in res) {
+    const homeserver_url = homeserver + res.path;
-      return Promise.all(
+    return Promise.all(
-        params.ids.map(id => {
+      params.ids.map(id =>
-          const del = res["delete"](id);
+        jsonClient(`${homeserver_url}/${id}`, {
-          const homeserver_url = homeserver + del.endpoint;
+          method: "DELETE",
-          return jsonClient(homeserver_url, {
+          body: JSON.stringify(params.data, filterNullValues),
-            method: del.method,
+        }).then(responses => ({
-            body: JSON.stringify(del.body),
+          data: responses.map(({ json }) => json),
-          });
+        }))
-        })
+      )
-      ).then(responses => ({
+    );
-        data: responses.map(({ json }) => json),
-      }));
-    } else {
-      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),
-      }));
-    }
   },
 };
 

yarn.lock

@@ -1235,25 +1235,6 @@
   resolved "https://registry.yarnpkg.com/@nodelib/fs.stat/-/fs.stat-1.1.3.tgz#2b5a3ab3f918cca48a8c754c08168e3f03eba61b"
   integrity sha512-shAmDyaQC4H92APFoIaVDHCx5bStIocgvbwQyxPRrbUY20V1EYTbSDchWbuwlMG3V17cprZhA6+78JfB+3DTPw==
 
-"@progress/kendo-drawing@^1.6.0":
-  version "1.6.0"
-  resolved "https://registry.yarnpkg.com/@progress/kendo-drawing/-/kendo-drawing-1.6.0.tgz#66e9df431f52c7dd9fd5567be80dcbfa3a162281"
-  integrity sha512-9dGlFvW9fMgqAgcbLi+SfTeMUpNYdoVthwNxwAtsRQ+QwcgXJcdzFpLrLBXp17pXpDDFpiOyMqiwjffNGwtc3w==
-  dependencies:
-    pako "^1.0.5"
-
-"@progress/kendo-file-saver@^1.0.1":
-  version "1.0.7"
-  resolved "https://registry.yarnpkg.com/@progress/kendo-file-saver/-/kendo-file-saver-1.0.7.tgz#5b602115d1b0b5e26f3e52451a3ed7c29ed76c51"
-  integrity sha512-8tsho/+DATzfTW4BBaHrkF3C3jqH2/bQ+XbjqA0KfmTiBRVK6ygK+tkvkYeDhFlQBbJ02MmJlEC6OmXvXRFkUg==
-
-"@progress/kendo-react-pdf@^3.10.1":
-  version "3.10.1"
-  resolved "https://registry.yarnpkg.com/@progress/kendo-react-pdf/-/kendo-react-pdf-3.10.1.tgz#348517daaddb366bbe840a92ec2fffbfd07ac2d2"
-  integrity sha512-2EKfQCwLFEa+mgCLKQ70iWVu7q2Dh/wJl6pPJ6Ix42BA7SiA2k5UmDk819FLY9pnMgv7WDxwqBP+8CvdkLoP5w==
-  dependencies:
-    "@progress/kendo-file-saver" "^1.0.1"
-
 "@redux-saga/core@^1.1.3":
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/@redux-saga/core/-/core-1.1.3.tgz#3085097b57a4ea8db5528d58673f20ce0950f6a4"
@@ -7927,7 +7908,7 @@ p-try@^2.0.0:
   resolved "https://registry.yarnpkg.com/p-try/-/p-try-2.2.0.tgz#cb2868540e313d61de58fafbe35ce9004d5540e6"
   integrity sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==
 
-pako@^1.0.5, pako@~1.0.5:
+pako@~1.0.5:
   version "1.0.11"
   resolved "https://registry.yarnpkg.com/pako/-/pako-1.0.11.tgz#6c9599d340d54dfd3946380252a35705a6b992bf"
   integrity sha512-4hLB8Py4zZce5s4yd9XzopqwVv/yGNhV1Bl8NTmCq1763HeK2+EwVTv+leGeL13Dnh2wfbqowVPXCIO0z4taYw==
@@ -9095,20 +9076,6 @@ q@^1.1.2:
   resolved "https://registry.yarnpkg.com/q/-/q-1.5.1.tgz#7e32f75b41381291d04611f1bf14109ac00651d7"
   integrity sha1-fjL3W0E4EpHQRhHxvxQQmsAGUdc=
 
-qr.js@0.0.0:
-  version "0.0.0"
-  resolved "https://registry.yarnpkg.com/qr.js/-/qr.js-0.0.0.tgz#cace86386f59a0db8050fa90d9b6b0e88a1e364f"
-  integrity sha1-ys6GOG9ZoNuAUPqQ2baw6IoeNk8=
-
-qrcode.react@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/qrcode.react/-/qrcode.react-1.0.0.tgz#7e8889db3b769e555e8eb463d4c6de221c36d5de"
-  integrity sha512-jBXleohRTwvGBe1ngV+62QvEZ/9IZqQivdwzo9pJM4LQMoCM2VnvNBnKdjvGnKyDZ/l0nCDgsPod19RzlPvm/Q==
-  dependencies:
-    loose-envify "^1.4.0"
-    prop-types "^15.6.0"
-    qr.js "0.0.0"
-
 qs@6.7.0:
   version "6.7.0"
   resolved "https://registry.yarnpkg.com/qs/-/qs-6.7.0.tgz#41dc1a015e3d581f1621776be31afb2876a9b1bc"