merge master

.github/workflows/build-test.yml

@@ -14,7 +14,7 @@ jobs:
       - name: Setup node
         uses: actions/setup-node@v2
         with:
-          node-version: 14
+          node-version: 16
       - name: Install dependencies
         run: yarn --frozen-lockfile
       - name: Run tests

.github/workflows/edge_ghpage.yml

@@ -13,7 +13,7 @@ jobs:
         uses: actions/checkout@v2.3.1
       - uses: actions/setup-node@v2
         with:
-          node-version: "14"
+          node-version: "16"
       - name: Install and Build 🔧
         run: |
           yarn install

.github/workflows/github-release.yml

@@ -16,7 +16,7 @@ jobs:
       - uses: actions/checkout@v2
       - uses: actions/setup-node@v2
         with:
-          node-version: "14"
+          node-version: "16"
       - run: yarn install
       - run: yarn build
       - run: |

Dockerfile

@@ -1,11 +1,14 @@
 # Builder
 FROM node:lts as builder
 
+ARG PUBLIC_URL=/
+ARG REACT_APP_SERVER
+
 WORKDIR /src
 
 COPY . /src
 RUN yarn --network-timeout=100000 install
-RUN yarn build
+RUN PUBLIC_URL=$PUBLIC_URL REACT_APP_SERVER=$REACT_APP_SERVER yarn build
 
 
 # App

README.md

@@ -5,13 +5,19 @@
 
 This project is built using [react-admin](https://marmelab.com/react-admin/).
 
-It needs at least Synapse v1.42.0 for all functions to work as expected!
+## Usage
+
+### Supported Synapse
+
+It needs at least [Synapse](https://github.com/matrix-org/synapse) v1.42.0 for all functions to work as expected!
 
 You get your server version with the request `/_synapse/admin/v1/server_version`.
 See also [Synapse version API](https://matrix-org.github.io/synapse/develop/admin_api/version_api.html).
 
 After entering the URL on the login page of synapse-admin the server version appears below the input field.
 
+### Prerequisites
+
 You need access to the following endpoints:
 
 - `/_matrix`
@@ -19,7 +25,17 @@ You need access to the following endpoints:
 
 See also [Synapse administration endpoints](https://matrix-org.github.io/synapse/develop/reverse_proxy.html#synapse-administration-endpoints)
 
-## Step-By-Step install
+### Use without install
+
+You can use the current version of Synapse Admin without own installation direct
+via [GitHub Pages](https://awesome-technologies.github.io/synapse-admin/).
+
+**Note:**
+If you want to use the deployment, you have to make sure that the admin endpoints (`/_synapse/admin`) are accessible for your browser.
+**Remember: You have no need to expose these endpoints to the internet but to your network.**
+If you want your own deployment, follow the [Step-By-Step Install Guide](#step-by-step-install) below.
+
+### Step-By-Step install
 
 You have three options:
 
@@ -27,7 +43,7 @@ You have three options:
 2.  [Download the source code from github and run using nodejs](#steps-for-2)
 3.  [Run the Docker container](#steps-for-3)
 
-### Steps for 1)
+#### Steps for 1)
 
 - make sure you have a webserver installed that can serve static files (any webserver like nginx or apache will do)
 - configure a vhost for synapse admin on your webserver
@@ -36,7 +52,7 @@ You have three options:
 - move or symlink the `synapse-admin-x.x.x` into your vhosts root dir
 - open the url of the vhost in your browser
 
-### Steps for 2)
+#### Steps for 2)
 
 - make sure you have installed the following: git, yarn, nodejs
 - download the source code: `git clone https://github.com/Awesome-Technologies/synapse-admin.git`
@@ -49,7 +65,7 @@ Either you define it at startup (e.g. `REACT_APP_SERVER=https://yourmatrixserver
 or by editing it in the [.env](.env) file. See also the
 [documentation](https://create-react-app.dev/docs/adding-custom-environment-variables/).
 
-### Steps for 3)
+#### Steps for 3)
 
 - run the Docker container from the public docker registry: `docker run -p 8080:80 awesometechnologies/synapse-admin` or use the [docker-compose.yml](docker-compose.yml): `docker-compose up -d`
 
@@ -66,6 +82,9 @@ or by editing it in the [.env](.env) file. See also the
         context: https://github.com/Awesome-Technologies/synapse-admin.git
         # args:
         #   - NODE_OPTIONS="--max_old_space_size=1024"
+        #   # see #266
+        #   - PUBLIC_URL="/synapse-admin"
+        #   - REACT_APP_SERVER="https://matrix.example.com"
       ports:
         - "8080:80"
       restart: unless-stopped

package.json

@@ -1,6 +1,6 @@
 {
   "name": "synapse-admin",
-  "version": "0.8.4",
+  "version": "0.8.5",
   "description": "Admin GUI for the Matrix.org server Synapse",
   "author": "Awesome Technologies Innovationslabor GmbH",
   "license": "Apache-2.0",
@@ -15,6 +15,7 @@
     "@testing-library/user-event": "^13.1.8",
     "eslint": "^7.25.0",
     "eslint-config-prettier": "^8.3.0",
+    "eslint-config-react-app": "^7.0.1",
     "eslint-plugin-prettier": "^3.1.2",
     "jest-fetch-mock": "^3.0.3",
     "prettier": "^2.2.0",
@@ -30,9 +31,9 @@
     "ra-language-chinese": "^2.0.10",
     "ra-language-german": "^3.13.4",
     "react": "^17.0.0",
-    "react-admin": "^3.15.0",
+    "react-admin": "^3.19.7",
     "react-dom": "^17.0.2",
-    "react-scripts": "^4.0.0"
+    "react-scripts": "^5.0.1"
   },
   "scripts": {
     "start": "REACT_APP_VERSION=$(git describe --tags) react-scripts start",

src/components/EventReports.js

@@ -70,7 +70,6 @@ export const ReportShow = props => {
           icon={<PageviewIcon />}
           path="detail"
         >
-          {" "}
           <DateField
             source="event_json.origin_server_ts"
             showTime

src/components/rooms.js

@@ -158,7 +158,11 @@ export const RoomShow = props => {
           />
         </Tab>
 
-        <Tab label="synapseadmin.rooms.tabs.members" icon={<UserIcon />}>
+        <Tab
+          label="synapseadmin.rooms.tabs.members"
+          icon={<UserIcon />}
+          path="members"
+        >
           <ReferenceManyField
             reference="room_members"
             target="room_id"

src/components/users.js

@@ -278,7 +278,7 @@ export const UserCreate = props => (
       />
       <BooleanInput source="admin" />
       <ArrayInput source="threepids">
-        <SimpleFormIterator>
+        <SimpleFormIterator disableReordering>
           <SelectInput
             source="medium"
             choices={[
@@ -291,7 +291,7 @@ export const UserCreate = props => (
         </SimpleFormIterator>
       </ArrayInput>
       <ArrayInput source="external_ids" label="synapseadmin.users.tabs.sso">
-        <SimpleFormIterator>
+        <SimpleFormIterator disableReordering>
           <TextInput source="auth_provider" validate={required()} />
           <TextInput
             source="external_id"
@@ -348,7 +348,7 @@ export const UserEdit = props => {
           path="threepid"
         >
           <ArrayInput source="threepids">
-            <SimpleFormIterator>
+            <SimpleFormIterator disableReordering>
               <SelectInput
                 source="medium"
                 choices={[
@@ -367,7 +367,7 @@ export const UserEdit = props => {
           path="sso"
         >
           <ArrayInput source="external_ids" label={false}>
-            <SimpleFormIterator>
+            <SimpleFormIterator disableReordering>
               <TextInput source="auth_provider" validate={required()} />
               <TextInput
                 source="external_id"