Sync 293-fix-follower-counter with master

backend/Dockerfile

@@ -1,4 +1,4 @@
-FROM node:12.9-alpine as base
+FROM node:12.10.0-alpine as base
 LABEL Description="Backend of the Social Network Human-Connection.org" Vendor="Human Connection gGmbH" Version="0.0.1" Maintainer="Human Connection gGmbH (developer@human-connection.org)"
 
 EXPOSE 4000

backend/package.json

@@ -120,7 +120,7 @@
     "eslint-config-prettier": "~6.2.0",
     "eslint-config-standard": "~14.1.0",
     "eslint-plugin-import": "~2.18.2",
-    "eslint-plugin-jest": "~22.16.0",
+    "eslint-plugin-jest": "~22.17.0",
     "eslint-plugin-node": "~10.0.0",
     "eslint-plugin-prettier": "~3.1.0",
     "eslint-plugin-promise": "~4.2.1",

backend/src/middleware/index.js

@@ -2,7 +2,7 @@ import { applyMiddleware } from 'graphql-middleware'
 import CONFIG from './../config'
 
 import activityPub from './activityPubMiddleware'
-import softDelete from './softDeleteMiddleware'
+import softDelete from './softDelete/softDeleteMiddleware'
 import sluggify from './sluggifyMiddleware'
 import excerpt from './excerptMiddleware'
 import dateTime from './dateTimeMiddleware'

backend/src/middleware/nodes/locations.js

@@ -1,9 +1,12 @@
 import request from 'request'
 import { UserInputError } from 'apollo-server'
 import isEmpty from 'lodash/isEmpty'
+import Debug from 'debug'
 import asyncForEach from '../../helpers/asyncForEach'
 import CONFIG from './../../config'
 
+const debug = Debug('human-connection:location')
+
 const fetch = url => {
   return new Promise((resolve, reject) => {
     request(url, function(error, response, body) {
@@ -59,6 +62,7 @@ const createOrUpdateLocations = async (userId, locationName, driver) => {
   if (isEmpty(locationName)) {
     return
   }
+
   const res = await fetch(
     `https://api.mapbox.com/geocoding/v5/mapbox.places/${encodeURIComponent(
       locationName,
@@ -67,6 +71,8 @@ const createOrUpdateLocations = async (userId, locationName, driver) => {
     )}`,
   )
 
+  debug(res)
+
   if (!res || !res.features || !res.features[0]) {
     throw new UserInputError('locationName is invalid')
   }

backend/src/middleware/softDelete/softDeleteMiddleware.spec.js

@@ -1,7 +1,7 @@
-import Factory from '../seed/factories'
-import { gql } from '../jest/helpers'
-import { neode as getNeode, getDriver } from '../bootstrap/neo4j'
-import createServer from '../server'
+import Factory from '../../seed/factories'
+import { gql } from '../../jest/helpers'
+import { neode as getNeode, getDriver } from '../../bootstrap/neo4j'
+import createServer from '../../server'
 import { createTestClient } from 'apollo-server-testing'
 
 const factory = Factory()

backend/src/schema/resolvers/registration.spec.js

@@ -1,18 +1,33 @@
-import { GraphQLClient } from 'graphql-request'
 import Factory from '../../seed/factories'
-import { host, login } from '../../jest/helpers'
-import { neode } from '../../bootstrap/neo4j'
+import { gql } from '../../jest/helpers'
+import { getDriver, neode as getNeode } from '../../bootstrap/neo4j'
+import createServer from '../../server'
+import { createTestClient } from 'apollo-server-testing'
 
-let factory
-let client
+const factory = Factory()
+const neode = getNeode()
+
+let mutate
+let authenticatedUser
+let user
 let variables
-let action
-let userParams
-const instance = neode()
+const driver = getDriver()
 
 beforeEach(async () => {
   variables = {}
-  factory = Factory()
+})
+
+beforeAll(() => {
+  const { server } = createServer({
+    context: () => {
+      return {
+        driver,
+        neode,
+        user: authenticatedUser,
+      }
+    },
+  })
+  mutate = createTestClient(server).mutate
 })
 
 afterEach(async () => {
@@ -20,83 +35,77 @@ afterEach(async () => {
 })
 
 describe('CreateInvitationCode', () => {
-  const mutation = `mutation { CreateInvitationCode { token } }`
+  const mutation = gql`
+    mutation {
+      CreateInvitationCode {
+        token
+      }
+    }
+  `
 
-  it('throws Authorization error', async () => {
-    const client = new GraphQLClient(host)
-    await expect(client.request(mutation)).rejects.toThrow('Not Authorised!')
+  describe('unauthenticated', () => {
+    beforeEach(() => {
+      authenticatedUser = null
+    })
+
+    it('throws Authorization error', async () => {
+      await expect(mutate({ mutation })).resolves.toMatchObject({
+        errors: [{ message: 'Not Authorised!' }],
+      })
+    })
   })
 
   describe('authenticated', () => {
     beforeEach(async () => {
-      userParams = {
+      user = await factory.create('User', {
         id: 'i123',
         name: 'Inviter',
         email: 'inviter@example.org',
         password: '1234',
         termsAndConditionsAgreedVersion: '0.0.1',
-      }
-      action = async () => {
-        const factory = Factory()
-        await factory.create('User', userParams)
-        const headers = await login(userParams)
-        client = new GraphQLClient(host, { headers })
-        return client.request(mutation)
-      }
+      })
+      authenticatedUser = await user.toJson()
     })
 
     it('resolves', async () => {
-      await expect(action()).resolves.toEqual({
-        CreateInvitationCode: { token: expect.any(String) },
+      await expect(mutate({ mutation })).resolves.toMatchObject({
+        data: { CreateInvitationCode: { token: expect.any(String) } },
       })
     })
 
     it('creates an InvitationCode with a `createdAt` attribute', async () => {
-      await action()
-      const codes = await instance.all('InvitationCode')
+      await mutate({ mutation })
+      const codes = await neode.all('InvitationCode')
       const invitation = await codes.first().toJson()
       expect(invitation.createdAt).toBeTruthy()
       expect(Date.parse(invitation.createdAt)).toEqual(expect.any(Number))
     })
 
     it('relates inviting User to InvitationCode', async () => {
-      await action()
-      const result = await instance.cypher(
+      await mutate({ mutation })
+      const result = await neode.cypher(
         'MATCH(code:InvitationCode)<-[:GENERATED]-(user:User) RETURN user',
       )
-      const inviter = instance.hydrateFirst(result, 'user', instance.model('User'))
+      const inviter = neode.hydrateFirst(result, 'user', neode.model('User'))
       await expect(inviter.toJson()).resolves.toEqual(expect.objectContaining({ name: 'Inviter' }))
     })
 
     describe('who has invited a lot of users already', () => {
-      beforeEach(() => {
-        action = async () => {
-          const factory = Factory()
-          await factory.create('User', userParams)
-          const headers = await login(userParams)
-          client = new GraphQLClient(host, { headers })
-          await Promise.all(
-            [1, 2, 3].map(() => {
-              return client.request(mutation)
-            }),
-          )
-          return client.request(mutation, variables)
-        }
+      beforeEach(async () => {
+        await Promise.all([mutate({ mutation }), mutate({ mutation }), mutate({ mutation })])
       })
 
       describe('as ordinary `user`', () => {
         it('throws `Not Authorised` because of maximum number of invitations', async () => {
-          await expect(action()).rejects.toThrow('Not Authorised')
+          await expect(mutate({ mutation })).resolves.toMatchObject({
+            errors: [{ message: 'Not Authorised!' }],
+          })
         })
 
-        it('creates no additional invitation codes', async done => {
-          try {
-            await action()
-          } catch (e) {
-            const invitationCodes = await instance.all('InvitationCode')
-            await expect(invitationCodes.toJson()).resolves.toHaveLength(3)
-            done()
-          }
+        it('creates no additional invitation codes', async () => {
+          await mutate({ mutation })
+          const invitationCodes = await neode.all('InvitationCode')
+          await expect(invitationCodes.toJson()).resolves.toHaveLength(3)
         })
       })
 
@@ -118,132 +127,144 @@ describe('CreateInvitationCode', () => {
 })
 
 describe('SignupByInvitation', () => {
-  const mutation = `mutation($email: String!, $token: String!) {
-    SignupByInvitation(email: $email, token: $token) { email }
-  }`
-
-  beforeEach(() => {
-    client = new GraphQLClient(host)
-    action = async () => {
-      return client.request(mutation, variables)
+  const mutation = gql`
+    mutation($email: String!, $token: String!) {
+      SignupByInvitation(email: $email, token: $token) {
+        email
+      }
     }
-  })
+  `
 
   describe('with valid email but invalid InvitationCode', () => {
     beforeEach(() => {
-      variables.email = 'any-email@example.org'
-      variables.token = 'wut?'
+      variables = {
+        ...variables,
+        email: 'any-email@example.org',
+        token: 'wut?',
+      }
     })
 
     it('throws UserInputError', async () => {
-      await expect(action()).rejects.toThrow('Invitation code already used or does not exist.')
-    })
-  })
-
-  describe('with valid InvitationCode', () => {
-    beforeEach(async () => {
-      const inviterParams = {
-        name: 'Inviter',
-        email: 'inviter@example.org',
-        password: '1234',
-      }
-      const factory = Factory()
-      await factory.create('User', inviterParams)
-      const headersOfInviter = await login(inviterParams)
-      const anotherClient = new GraphQLClient(host, { headers: headersOfInviter })
-      const invitationMutation = `mutation { CreateInvitationCode { token } }`
-      const {
-        CreateInvitationCode: { token },
-      } = await anotherClient.request(invitationMutation)
-      variables.token = token
+      await expect(mutate({ mutation, variables })).resolves.toMatchObject({
+        errors: [{ message: 'UserInputError: Invitation code already used or does not exist.' }],
+      })
     })
 
-    describe('given an invalid email', () => {
-      beforeEach(() => {
-        variables.email = 'someuser'
-      })
-
-      it('throws `email is not a valid email`', async () => {
-        await expect(action()).rejects.toThrow('"email" must be a valid email')
-      })
-
-      it('creates no additional EmailAddress node', async done => {
-        try {
-          await action()
-        } catch (e) {
-          let emailAddresses = await instance.all('EmailAddress')
-          emailAddresses = await emailAddresses.toJson
-          expect(emailAddresses).toHaveLength(0)
-          done()
+    describe('with valid InvitationCode', () => {
+      beforeEach(async () => {
+        const inviter = await factory.create('User', {
+          name: 'Inviter',
+          email: 'inviter@example.org',
+          password: '1234',
+        })
+        authenticatedUser = await inviter.toJson()
+        const invitationMutation = gql`
+          mutation {
+            CreateInvitationCode {
+              token
+            }
+          }
+        `
+        const {
+          data: {
+            CreateInvitationCode: { token },
+          },
+        } = await mutate({ mutation: invitationMutation })
+        authenticatedUser = null
+        variables = {
+          ...variables,
+          token,
         }
       })
-    })
 
-    describe('given a valid email', () => {
-      beforeEach(() => {
-        variables.email = 'someUser@example.org'
-      })
+      describe('given an invalid email', () => {
+        beforeEach(() => {
+          variables = { ...variables, email: 'someuser' }
+        })
 
-      it('resolves', async () => {
-        await expect(action()).resolves.toEqual({
-          SignupByInvitation: { email: 'someuser@example.org' },
+        it('throws `email is not a valid email`', async () => {
+          await expect(mutate({ mutation, variables })).resolves.toMatchObject({
+            errors: [{ message: expect.stringContaining('"email" must be a valid email') }],
+          })
+        })
+
+        it('creates no additional EmailAddress node', async () => {
+          let emailAddresses = await neode.all('EmailAddress')
+          emailAddresses = await emailAddresses.toJson()
+          expect(emailAddresses).toHaveLength(1)
+          await mutate({ mutation, variables })
+          emailAddresses = await neode.all('EmailAddress')
+          emailAddresses = await emailAddresses.toJson()
+          expect(emailAddresses).toHaveLength(1)
         })
       })
 
-      describe('creates a EmailAddress node', () => {
-        it('with a `createdAt` attribute', async () => {
-          await action()
-          let emailAddress = await instance.first('EmailAddress', { email: 'someuser@example.org' })
-          emailAddress = await emailAddress.toJson()
-          expect(emailAddress.createdAt).toBeTruthy()
-          expect(Date.parse(emailAddress.createdAt)).toEqual(expect.any(Number))
+      describe('given a valid email', () => {
+        beforeEach(() => {
+          variables = { ...variables, email: 'someUser@example.org' }
         })
 
-        it('with a cryptographic `nonce`', async () => {
-          await action()
-          let emailAddress = await instance.first('EmailAddress', { email: 'someuser@example.org' })
-          emailAddress = await emailAddress.toJson()
-          expect(emailAddress.nonce).toEqual(expect.any(String))
-        })
-
-        it('connects inviter through invitation code', async () => {
-          await action()
-          const result = await instance.cypher(
-            'MATCH(inviter:User)-[:GENERATED]->(:InvitationCode)-[:ACTIVATED]->(email:EmailAddress {email: {email}}) RETURN inviter',
-            { email: 'someuser@example.org' },
-          )
-          const inviter = instance.hydrateFirst(result, 'inviter', instance.model('User'))
-          await expect(inviter.toJson()).resolves.toEqual(
-            expect.objectContaining({ name: 'Inviter' }),
-          )
-        })
-
-        describe('using the same InvitationCode twice', () => {
-          it('rejects because codes can be used only once', async done => {
-            await action()
-            try {
-              variables.email = 'yetanotheremail@example.org'
-              await action()
-            } catch (e) {
-              expect(e.message).toMatch(/Invitation code already used/)
-              done()
-            }
+        it('resolves', async () => {
+          await expect(mutate({ mutation, variables })).resolves.toMatchObject({
+            data: { SignupByInvitation: { email: 'someuser@example.org' } },
           })
         })
 
-        describe('if a user account with the given email already exists', () => {
-          beforeEach(async () => {
-            await factory.create('User', { email: 'someuser@example.org' })
+        describe('creates a EmailAddress node', () => {
+          it('with a `createdAt` attribute', async () => {
+            await mutate({ mutation, variables })
+            let emailAddress = await neode.first('EmailAddress', { email: 'someuser@example.org' })
+            emailAddress = await emailAddress.toJson()
+            expect(emailAddress.createdAt).toBeTruthy()
+            expect(Date.parse(emailAddress.createdAt)).toEqual(expect.any(Number))
           })
 
-          it('throws unique violation error', async () => {
-            await expect(action()).rejects.toThrow('User account with this email already exists.')
+          it('with a cryptographic `nonce`', async () => {
+            await mutate({ mutation, variables })
+            let emailAddress = await neode.first('EmailAddress', { email: 'someuser@example.org' })
+            emailAddress = await emailAddress.toJson()
+            expect(emailAddress.nonce).toEqual(expect.any(String))
           })
-        })
 
-        describe('if the EmailAddress already exists but without user account', () => {
-          // shall we re-send the registration email?
-          it.todo('decide what to do')
+          it('connects inviter through invitation code', async () => {
+            await mutate({ mutation, variables })
+            const result = await neode.cypher(
+              'MATCH(inviter:User)-[:GENERATED]->(:InvitationCode)-[:ACTIVATED]->(email:EmailAddress {email: {email}}) RETURN inviter',
+              { email: 'someuser@example.org' },
+            )
+            const inviter = neode.hydrateFirst(result, 'inviter', neode.model('User'))
+            await expect(inviter.toJson()).resolves.toEqual(
+              expect.objectContaining({ name: 'Inviter' }),
+            )
+          })
+
+          describe('using the same InvitationCode twice', () => {
+            it('rejects because codes can be used only once', async () => {
+              await mutate({ mutation, variables })
+              variables = { ...variables, email: 'yetanotheremail@example.org' }
+              await expect(mutate({ mutation, variables })).resolves.toMatchObject({
+                errors: [
+                  { message: 'UserInputError: Invitation code already used or does not exist.' },
+                ],
+              })
+            })
+          })
+
+          describe('if a user account with the given email already exists', () => {
+            beforeEach(async () => {
+              await factory.create('User', { email: 'someuser@example.org' })
+            })
+
+            it('throws unique violation error', async () => {
+              await expect(mutate({ mutation, variables })).resolves.toMatchObject({
+                errors: [{ message: 'User account with this email already exists.' }],
+              })
+            })
+          })
+
+          describe('if the EmailAddress already exists but without user account', () => {
+            it.todo('shall we re-send the registration email?')
+          })
         })
       })
     })
@@ -251,61 +272,79 @@ describe('SignupByInvitation', () => {
 })
 
 describe('Signup', () => {
-  const mutation = `mutation($email: String!) {
-    Signup(email: $email) { email }
-  }`
-
-  it('throws AuthorizationError', async () => {
-    client = new GraphQLClient(host)
-    await expect(
-      client.request(mutation, { email: 'get-me-a-user-account@example.org' }),
-    ).rejects.toThrow('Not Authorised')
+  const mutation = gql`
+    mutation($email: String!) {
+      Signup(email: $email) {
+        email
+      }
+    }
+  `
+  beforeEach(() => {
+    variables = { ...variables, email: 'someuser@example.org' }
   })
 
-  describe('as admin', () => {
-    beforeEach(async () => {
-      userParams = {
-        role: 'admin',
-        email: 'admin@example.org',
-        password: '1234',
-      }
-      variables.email = 'someuser@example.org'
-      const factory = Factory()
-      await factory.create('User', userParams)
-      const headers = await login(userParams)
-      client = new GraphQLClient(host, { headers })
-      action = async () => {
-        return client.request(mutation, variables)
-      }
+  describe('unauthenticated', () => {
+    beforeEach(() => {
+      authenticatedUser = null
     })
 
-    it('is allowed to signup users by email', async () => {
-      await expect(action()).resolves.toEqual({ Signup: { email: 'someuser@example.org' } })
+    it('throws AuthorizationError', async () => {
+      await expect(mutate({ mutation, variables })).resolves.toMatchObject({
+        errors: [{ message: 'Not Authorised!' }],
+      })
     })
 
-    it('creates a Signup with a cryptographic `nonce`', async () => {
-      await action()
-      let emailAddress = await instance.first('EmailAddress', { email: 'someuser@example.org' })
-      emailAddress = await emailAddress.toJson()
-      expect(emailAddress.nonce).toEqual(expect.any(String))
+    describe('as admin', () => {
+      beforeEach(async () => {
+        const admin = await factory.create('User', {
+          role: 'admin',
+          email: 'admin@example.org',
+          password: '1234',
+        })
+        authenticatedUser = await admin.toJson()
+      })
+
+      it('is allowed to signup users by email', async () => {
+        await expect(mutate({ mutation, variables })).resolves.toMatchObject({
+          data: { Signup: { email: 'someuser@example.org' } },
+        })
+      })
+
+      it('creates a Signup with a cryptographic `nonce`', async () => {
+        await mutate({ mutation, variables })
+        let emailAddress = await neode.first('EmailAddress', { email: 'someuser@example.org' })
+        emailAddress = await emailAddress.toJson()
+        expect(emailAddress.nonce).toEqual(expect.any(String))
+      })
     })
   })
 })
 
 describe('SignupVerification', () => {
-  const mutation = `
-      mutation($name: String!, $password: String!, $email: String!, $nonce: String!, $termsAndConditionsAgreedVersion: String!) {
-        SignupVerification(name: $name, password: $password, email: $email, nonce: $nonce, termsAndConditionsAgreedVersion: $termsAndConditionsAgreedVersion) {
-          id
-          termsAndConditionsAgreedVersion
-        }
+  const mutation = gql`
+    mutation(
+      $name: String!
+      $password: String!
+      $email: String!
+      $nonce: String!
+      $termsAndConditionsAgreedVersion: String!
+    ) {
+      SignupVerification(
+        name: $name
+        password: $password
+        email: $email
+        nonce: $nonce
+        termsAndConditionsAgreedVersion: $termsAndConditionsAgreedVersion
+      ) {
+        id
+        termsAndConditionsAgreedVersion
       }
-    `
+    }
+  `
   describe('given valid password and email', () => {
-    let variables
-
     beforeEach(async () => {
       variables = {
+        ...variables,
         nonce: '123456',
         name: 'John Doe',
         password: '123',
@@ -316,15 +355,15 @@ describe('SignupVerification', () => {
 
     describe('unauthenticated', () => {
       beforeEach(async () => {
-        client = new GraphQLClient(host)
+        authenticatedUser = null
       })
 
       describe('EmailAddress exists, but is already related to a user account', () => {
         beforeEach(async () => {
           const { email, nonce } = variables
           const [emailAddress, user] = await Promise.all([
-            instance.model('EmailAddress').create({ email, nonce }),
-            instance
+            neode.model('EmailAddress').create({ email, nonce }),
+            neode
               .model('User')
               .create({ name: 'Somebody', password: '1234', email: 'john@example.org' }),
           ])
@@ -333,13 +372,13 @@ describe('SignupVerification', () => {
 
         describe('sending a valid nonce', () => {
           beforeEach(() => {
-            variables.nonce = '123456'
+            variables = { ...variables, nonce: '123456' }
           })
 
           it('rejects', async () => {
-            await expect(client.request(mutation, variables)).rejects.toThrow(
-              'Invalid email or nonce',
-            )
+            await expect(mutate({ mutation, variables })).resolves.toMatchObject({
+              errors: [{ message: 'Invalid email or nonce' }],
+            })
           })
         })
       })
@@ -350,22 +389,23 @@ describe('SignupVerification', () => {
             email: 'john@example.org',
             nonce: '123456',
           }
-          await instance.model('EmailAddress').create(args)
+          await neode.model('EmailAddress').create(args)
         })
 
         describe('sending a valid nonce', () => {
           it('creates a user account', async () => {
-            const expected = {
-              SignupVerification: expect.objectContaining({
-                id: expect.any(String),
-              }),
-            }
-            await expect(client.request(mutation, variables)).resolves.toEqual(expected)
+            await expect(mutate({ mutation, variables })).resolves.toMatchObject({
+              data: {
+                SignupVerification: expect.objectContaining({
+                  id: expect.any(String),
+                }),
+              },
+            })
           })
 
           it('sets `verifiedAt` attribute of EmailAddress', async () => {
-            await client.request(mutation, variables)
-            const email = await instance.first('EmailAddress', { email: 'john@example.org' })
+            await mutate({ mutation, variables })
+            const email = await neode.first('EmailAddress', { email: 'john@example.org' })
             await expect(email.toJson()).resolves.toEqual(
               expect.objectContaining({
                 verifiedAt: expect.any(String),
@@ -378,8 +418,8 @@ describe('SignupVerification', () => {
                 MATCH(email:EmailAddress)-[:BELONGS_TO]->(u:User {name: {name}})
                 RETURN email
               `
-            await client.request(mutation, variables)
-            const { records: emails } = await instance.cypher(cypher, { name: 'John Doe' })
+            await mutate({ mutation, variables })
+            const { records: emails } = await neode.cypher(cypher, { name: 'John Doe' })
             expect(emails).toHaveLength(1)
           })
 
@@ -388,39 +428,38 @@ describe('SignupVerification', () => {
                 MATCH(email:EmailAddress)<-[:PRIMARY_EMAIL]-(u:User {name: {name}})
                 RETURN email
               `
-            await client.request(mutation, variables)
-            const { records: emails } = await instance.cypher(cypher, { name: 'John Doe' })
+            await mutate({ mutation, variables })
+            const { records: emails } = await neode.cypher(cypher, { name: 'John Doe' })
             expect(emails).toHaveLength(1)
           })
 
           it('is version of terms and conditions saved correctly', async () => {
-            const expected = {
-              SignupVerification: expect.objectContaining({
-                termsAndConditionsAgreedVersion: '0.0.1',
-              }),
-            }
-            await expect(client.request(mutation, variables)).resolves.toEqual(expected)
+            await expect(mutate({ mutation, variables })).resolves.toMatchObject({
+              data: {
+                SignupVerification: expect.objectContaining({
+                  termsAndConditionsAgreedVersion: '0.0.1',
+                }),
+              },
+            })
           })
 
           it('rejects if version of terms and conditions has wrong format', async () => {
-            await expect(
-              client.request(mutation, {
-                ...variables,
-                termsAndConditionsAgreedVersion: 'invalid version format',
-              }),
-            ).rejects.toThrow('Invalid version format!')
+            variables = { ...variables, termsAndConditionsAgreedVersion: 'invalid version format' }
+            await expect(mutate({ mutation, variables })).resolves.toMatchObject({
+              errors: [{ message: 'Invalid version format!' }],
+            })
           })
         })
 
         describe('sending invalid nonce', () => {
           beforeEach(() => {
-            variables.nonce = 'wut2'
+            variables = { ...variables, nonce: 'wut2' }
           })
 
           it('rejects', async () => {
-            await expect(client.request(mutation, variables)).rejects.toThrow(
-              'Invalid email or nonce',
-            )
+            await expect(mutate({ mutation, variables })).resolves.toMatchObject({
+              errors: [{ message: 'Invalid email or nonce' }],
+            })
           })
         })
       })

backend/src/schema/resolvers/statistics.js

@@ -1,68 +1,37 @@
-export const query = (cypher, session) => {
-  return new Promise((resolve, reject) => {
-    const data = []
-    session.run(cypher).subscribe({
-      onNext: function(record) {
-        const item = {}
-        record.keys.forEach(key => {
-          item[key] = record.get(key)
-        })
-        data.push(item)
-      },
-      onCompleted: function() {
-        session.close()
-        resolve(data)
-      },
-      onError: function(error) {
-        reject(error)
-      },
-    })
-  })
-}
-const queryOne = (cypher, session) => {
-  return new Promise((resolve, reject) => {
-    query(cypher, session)
-      .then(res => {
-        resolve(res.length ? res.pop() : {})
-      })
-      .catch(err => {
-        reject(err)
-      })
-  })
-}
-
 export default {
   Query: {
     statistics: async (parent, args, { driver, user }) => {
-      return new Promise(resolve => {
-        const session = driver.session()
-        const queries = {
-          countUsers:
-            'MATCH (r:User) WHERE r.deleted <> true OR NOT exists(r.deleted) RETURN COUNT(r) AS countUsers',
-          countPosts:
-            'MATCH (r:Post) WHERE r.deleted <> true OR NOT exists(r.deleted) RETURN COUNT(r) AS countPosts',
-          countComments:
-            'MATCH (r:Comment) WHERE r.deleted <> true OR NOT exists(r.deleted) RETURN COUNT(r) AS countComments',
-          countNotifications: 'MATCH ()-[r:NOTIFIED]->()  RETURN COUNT(r) AS countNotifications',
-          countInvites: 'MATCH (r:InvitationCode) RETURN COUNT(r) AS countInvites',
-          countFollows: 'MATCH (:User)-[r:FOLLOWS]->(:User) RETURN COUNT(r) AS countFollows',
-          countShouts: 'MATCH (:User)-[r:SHOUTED]->(:Post) RETURN COUNT(r) AS countShouts',
+      const session = driver.session()
+      const response = {}
+      try {
+        const mapping = {
+          countUsers: 'User',
+          countPosts: 'Post',
+          countComments: 'Comment',
+          countNotifications: 'NOTIFIED',
+          countInvites: 'InvitationCode',
+          countFollows: 'FOLLOWS',
+          countShouts: 'SHOUTED',
         }
-        const data = {
-          countUsers: queryOne(queries.countUsers, session).then(res => res.countUsers.low),
-          countPosts: queryOne(queries.countPosts, session).then(res => res.countPosts.low),
-          countComments: queryOne(queries.countComments, session).then(
-            res => res.countComments.low,
-          ),
-          countNotifications: queryOne(queries.countNotifications, session).then(
-            res => res.countNotifications.low,
-          ),
-          countInvites: queryOne(queries.countInvites, session).then(res => res.countInvites.low),
-          countFollows: queryOne(queries.countFollows, session).then(res => res.countFollows.low),
-          countShouts: queryOne(queries.countShouts, session).then(res => res.countShouts.low),
-        }
-        resolve(data)
-      })
+        const cypher = `
+          CALL apoc.meta.stats() YIELD labels, relTypesCount
+          RETURN labels, relTypesCount
+        `
+        const result = await session.run(cypher)
+        const [statistics] = await result.records.map(record => {
+          return {
+            ...record.get('labels'),
+            ...record.get('relTypesCount'),
+          }
+        })
+        Object.keys(mapping).forEach(key => {
+          const stat = statistics[mapping[key]]
+          response[key] = stat ? stat.toNumber() : 0
+        })
+      } finally {
+        session.close()
+      }
+      return response
     },
   },
 }

backend/src/schema/types/schema.gql

@@ -2,8 +2,6 @@ type Query {
   isLoggedIn: Boolean!
   # Get the currently logged in User based on the given JWT Token
   currentUser: User
-  # Get the latest Network Statistics
-  statistics: Statistics!
   findPosts(query: String!, limit: Int = 10, filter: _PostFilter): [Post]!
     @cypher(
       statement: """
@@ -39,16 +37,6 @@ type Mutation {
   unfollow(id: ID!, type: FollowTypeEnum): Boolean!
 }
 
-type Statistics {
-  countUsers: Int!
-  countPosts: Int!
-  countComments: Int!
-  countNotifications: Int!
-  countInvites: Int!
-  countFollows: Int!
-  countShouts: Int!
-}
-
 type Report {
   id: ID!
   submitter: User @relation(name: "REPORTED", direction: "IN")

backend/src/schema/types/type/Statistics.gql

@@ -0,0 +1,14 @@
+type Query {
+  statistics: Statistics!
+}
+
+type Statistics {
+  countUsers: Int!
+  countPosts: Int!
+  countComments: Int!
+  countNotifications: Int!
+  countInvites: Int!
+  countFollows: Int!
+  countShouts: Int!
+}
+

backend/yarn.lock

@@ -3336,10 +3336,10 @@ eslint-plugin-import@~2.18.2:
     read-pkg-up "^2.0.0"
     resolve "^1.11.0"
 
-eslint-plugin-jest@~22.16.0:
-  version "22.16.0"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-jest/-/eslint-plugin-jest-22.16.0.tgz#30c4e0e9dc331beb2e7369b70dd1363690c1ce05"
-  integrity sha512-eBtSCDhO1k7g3sULX/fuRK+upFQ7s548rrBtxDyM1fSoY7dTWp/wICjrJcDZKVsW7tsFfH22SG+ZaxG5BZodIg==
+eslint-plugin-jest@~22.17.0:
+  version "22.17.0"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-jest/-/eslint-plugin-jest-22.17.0.tgz#dc170ec8369cd1bff9c5dd8589344e3f73c88cf6"
+  integrity sha512-WT4DP4RoGBhIQjv+5D0FM20fAdAUstfYAf/mkufLNTojsfgzc5/IYW22cIg/Q4QBavAZsROQlqppiWDpFZDS8Q==
   dependencies:
     "@typescript-eslint/experimental-utils" "^1.13.0"
 

neo4j/Dockerfile

@@ -1,4 +1,4 @@
-FROM neo4j:3.5.8
+FROM neo4j:3.5.9
 LABEL Description="Neo4J database of the Social Network Human-Connection.org with preinstalled database constraints and indices" Vendor="Human Connection gGmbH" Version="0.0.1" Maintainer="Human Connection gGmbH (developer@human-connection.org)"
 
 ARG BUILD_COMMIT

webapp/Dockerfile

@@ -1,4 +1,4 @@
-FROM node:12.9-alpine as base
+FROM node:12.10.0-alpine as base
 LABEL Description="Web Frontend of the Social Network Human-Connection.org" Vendor="Human-Connection gGmbH" Version="0.0.1" Maintainer="Human-Connection gGmbH (developer@human-connection.org)"
 
 EXPOSE 3000

webapp/components/Comment.vue

@@ -59,7 +59,7 @@
 
 <script>
 import { mapGetters, mapMutations } from 'vuex'
-import HcUser from '~/components/User'
+import HcUser from '~/components/User/User'
 import ContentMenu from '~/components/ContentMenu'
 import ContentViewer from '~/components/Editor/ContentViewer'
 import HcEditCommentForm from '~/components/EditCommentForm/EditCommentForm'

webapp/components/CommentList/CommentList.spec.js

@@ -34,6 +34,7 @@ describe('CommentList.vue', () => {
       }
       store = new Vuex.Store({
         getters: {
+          'auth/isModerator': () => false,
           'auth/user': () => {
             return {}
           },

webapp/components/ContributionForm/ContributionForm.spec.js

@@ -86,6 +86,7 @@ describe('ContributionForm.vue', () => {
       'editor/placeholder': () => {
         return 'some cool placeholder'
       },
+      'auth/isModerator': () => false,
       'auth/user': () => {
         return {
           id: '4711',

webapp/components/ContributionForm/ContributionForm.vue

@@ -1,14 +1,14 @@
 <template>
   <ds-form ref="contributionForm" v-model="form" :schema="formSchema">
     <template slot-scope="{ errors }">
+      <hc-teaser-image :contribution="contribution" @addTeaserImage="addTeaserImage">
+        <img
+          v-if="contribution"
+          class="contribution-image"
+          :src="contribution.image | proxyApiUrl"
+        />
+      </hc-teaser-image>
       <ds-card>
-        <hc-teaser-image :contribution="contribution" @addTeaserImage="addTeaserImage">
-          <img
-            v-if="contribution"
-            class="contribution-image"
-            :src="contribution.image | proxyApiUrl"
-          />
-        </hc-teaser-image>
         <ds-space />
         <hc-user :user="currentUser" :trunc="35" />
         <ds-space />
@@ -79,7 +79,7 @@ import locales from '~/locales'
 import PostMutations from '~/graphql/PostMutations.js'
 import HcCategoriesSelect from '~/components/CategoriesSelect/CategoriesSelect'
 import HcTeaserImage from '~/components/TeaserImage/TeaserImage'
-import HcUser from '~/components/User'
+import HcUser from '~/components/User/User'
 
 export default {
   components: {

webapp/components/FilterPosts/FilterPosts.spec.js

@@ -55,6 +55,7 @@ describe('FilterPosts.vue', () => {
     }
     getters = {
       'postsFilter/isActive': () => false,
+      'auth/isModerator': () => false,
       'auth/user': () => {
         return { id: 'u34' }
       },

webapp/components/PostCard/index.spec.js

@@ -33,13 +33,6 @@ describe('PostCard', () => {
         disabled: false,
       },
     }
-    store = new Vuex.Store({
-      getters: {
-        'auth/user': () => {
-          return {}
-        },
-      },
-    })
     stubs = {
       NuxtLink: RouterLinkStub,
     }
@@ -56,6 +49,7 @@ describe('PostCard', () => {
       },
     }
     getters = {
+      'auth/isModerator': () => false,
       'auth/user': () => {
         return {}
       },
@@ -64,6 +58,7 @@ describe('PostCard', () => {
 
   describe('shallowMount', () => {
     Wrapper = () => {
+      store = new Vuex.Store({ getters })
       return shallowMount(PostCard, {
         store,
         propsData,

webapp/components/PostCard/index.vue

@@ -69,7 +69,7 @@
 </template>
 
 <script>
-import HcUser from '~/components/User'
+import HcUser from '~/components/User/User'
 import ContentMenu from '~/components/ContentMenu'
 import HcCategory from '~/components/Category'
 import HcRibbon from '~/components/Ribbon'

webapp/components/TeaserImage/TeaserImage.vue

@@ -3,6 +3,7 @@
     :options="dropzoneOptions"
     ref="el"
     id="postdropzone"
+    class="ds-card-image"
     :use-custom-slot="true"
     @vdropzone-thumbnail="thumbnail"
     @vdropzone-error="verror"
@@ -10,14 +11,14 @@
     <div class="dz-message">
       <div
         :class="{
-          'hc-attachments-upload-area-post': createAndUpdate,
+          'hc-attachments-upload-area-post': true,
           'hc-attachments-upload-area-update-post': contribution,
         }"
       >
         <slot></slot>
         <div
           :class="{
-            'hc-drag-marker-post': createAndUpdate,
+            'hc-drag-marker-post': true,
             'hc-drag-marker-update-post': contribution,
           }"
         >
@@ -46,7 +47,6 @@ export default {
         previewTemplate: this.template(),
       },
       error: false,
-      createAndUpdate: true,
     }
   },
   watch: {
@@ -75,18 +75,21 @@ export default {
       return ''
     },
     thumbnail: (file, dataUrl) => {
-      let thumbnailElement, contributionImage, uploadArea
+      let thumbnailElement, contributionImage, uploadArea, thumbnailPreview, image
       if (file.previewElement) {
         thumbnailElement = document.querySelectorAll('#postdropzone')[0]
         contributionImage = document.querySelectorAll('.contribution-image')[0]
+        thumbnailPreview = document.querySelectorAll('.thumbnail-preview')[0]
         if (contributionImage) {
           uploadArea = document.querySelectorAll('.hc-attachments-upload-area-update-post')[0]
           uploadArea.removeChild(contributionImage)
           uploadArea.classList.remove('hc-attachments-upload-area-update-post')
         }
-        thumbnailElement.classList.add('image-preview')
-        thumbnailElement.alt = file.name
-        thumbnailElement.style.backgroundImage = 'url("' + dataUrl + '")'
+        image = new Image()
+        image.src = URL.createObjectURL(file)
+        image.classList.add('thumbnail-preview')
+        if (thumbnailPreview) return thumbnailElement.replaceChild(image, thumbnailPreview)
+        thumbnailElement.appendChild(image)
       }
     },
   },
@@ -99,25 +102,9 @@ export default {
   background-color: $background-color-softest;
 }
 
-#postdropzone.image-preview {
-  background-repeat: no-repeat;
-  background-size: cover;
-  background-position: center;
-  height: auto;
-  transition: all 0.2s ease-out;
-
-  width: 100%;
-}
-
-@media only screen and (max-width: 400px) {
-  #postdropzone.image-preview {
-    height: 200px;
-  }
-}
-
-@media only screen and (min-width: 401px) and (max-width: 960px) {
-  #postdropzone.image-preview {
-    height: 300px;
+@media only screen and (max-width: 960px) {
+  #postdropzone {
+    min-height: 200px;
   }
 }
 

webapp/components/User/User.spec.js

@@ -1,5 +1,5 @@
 import { mount, createLocalVue, RouterLinkStub } from '@vue/test-utils'
-import User from './index'
+import User from './User.vue'
 import Vuex from 'vuex'
 import VTooltip from 'v-tooltip'
 import Filters from '~/plugins/vue-filters'
@@ -67,6 +67,30 @@ describe('User', () => {
         expect(wrapper.text()).toMatch('Tilda Swinton')
       })
 
+      describe('user is deleted', () => {
+        beforeEach(() => {
+          propsData.user.deleted = true
+        })
+
+        it('renders anonymous user', () => {
+          const wrapper = Wrapper()
+          expect(wrapper.text()).not.toMatch('Tilda Swinton')
+          expect(mocks.$t).toHaveBeenCalledWith('profile.userAnonym')
+        })
+
+        describe('even if the current user is a moderator', () => {
+          beforeEach(() => {
+            getters['auth/isModerator'] = () => true
+          })
+
+          it('renders anonymous user', () => {
+            const wrapper = Wrapper()
+            expect(wrapper.text()).not.toMatch('Tilda Swinton')
+            expect(mocks.$t).toHaveBeenCalledWith('profile.userAnonym')
+          })
+        })
+      })
+
       describe('user is disabled', () => {
         beforeEach(() => {
           propsData.user.disabled = true

webapp/components/User/User.vue

@@ -1,25 +1,17 @@
 <template>
-  <div v-if="!user || ((user.disabled || user.deleted) && !isModerator)">
-    <div
-      style="display: inline-block; float: left; margin-right: 4px;  height: 100%; vertical-align: middle;"
-    >
-      <hc-avatar />
-    </div>
-    <div style="display: inline-block; height: 100%; vertical-align: middle;">
-      <b class="username" style="vertical-align: middle;">{{ $t('profile.userAnonym') }}</b>
+  <div class="user" v-if="displayAnonymous">
+    <hc-avatar class="avatar" />
+    <div>
+      <b class="username">{{ $t('profile.userAnonym') }}</b>
     </div>
   </div>
   <dropdown v-else :class="{ 'disabled-content': user.disabled }" placement="top-start" offset="0">
     <template slot="default" slot-scope="{ openMenu, closeMenu, isOpen }">
       <nuxt-link :to="userLink" :class="['user', isOpen && 'active']">
         <div @mouseover="openMenu(true)" @mouseleave="closeMenu(true)">
-          <div
-            style="display: inline-block; float: left; margin-right: 4px;  height: 100%; vertical-align: middle;"
-          >
-            <hc-avatar :user="user" />
-          </div>
-          <div style="display: inline-block; height: 100%; vertical-align: middle;">
-            <b class="username" style="vertical-align: middle;">{{ userName | truncate(18) }}</b>
+          <hc-avatar class="avatar" :user="user" />
+          <div>
+            <b class="username">{{ userName | truncate(18) }}</b>
           </div>
           <!-- Time -->
           <div v-if="dateTime" style="display: inline;">
@@ -125,6 +117,10 @@ export default {
     itsMe() {
       return this.user.slug === this.$store.getters['auth/user'].slug
     },
+    displayAnonymous() {
+      const { user, isModerator } = this
+      return !user || user.deleted || (user.disabled && !isModerator)
+    },
     userLink() {
       const { id, slug } = this.user
       if (!(id && slug)) return ''
@@ -148,7 +144,15 @@ export default {
 }
 </script>
 
-<style lang="scss">
+<style scoped lang="scss">
+.avatar {
+  display: inline-block;
+  float: left;
+  margin-right: 4px;
+  height: 100%;
+  vertical-align: middle;
+}
+
 .user {
   white-space: nowrap;
   position: relative;

webapp/components/notifications/Notification/Notification.spec.js

@@ -1,10 +1,12 @@
 import { config, mount, createLocalVue, RouterLinkStub } from '@vue/test-utils'
-import Notification from './Notification'
+import Notification from './Notification.vue'
 import Styleguide from '@human-connection/styleguide'
 import Filters from '~/plugins/vue-filters'
+import Vuex from 'vuex'
 
 const localVue = createLocalVue()
 
+localVue.use(Vuex)
 localVue.use(Styleguide)
 localVue.use(Filters)
 
@@ -12,6 +14,7 @@ config.stubs['client-only'] = '<span><slot /></span>'
 
 describe('Notification', () => {
   let stubs
+  let getters
   let mocks
   let propsData
   let wrapper
@@ -23,11 +26,21 @@ describe('Notification', () => {
     stubs = {
       NuxtLink: RouterLinkStub,
     }
+    getters = {
+      'auth/user': () => {
+        return {}
+      },
+      'auth/isModerator': () => false,
+    }
   })
 
   const Wrapper = () => {
+    const store = new Vuex.Store({
+      getters,
+    })
     return mount(Notification, {
       stubs,
+      store,
       mocks,
       propsData,
       localVue,

webapp/components/notifications/Notification/Notification.vue

@@ -33,7 +33,7 @@
 </template>
 
 <script>
-import HcUser from '~/components/User'
+import HcUser from '~/components/User/User'
 
 export default {
   name: 'Notification',

webapp/components/notifications/NotificationList/NotificationList.spec.js

@@ -26,6 +26,7 @@ describe('NotificationList.vue', () => {
   beforeEach(() => {
     store = new Vuex.Store({
       getters: {
+        'auth/isModerator': () => false,
         'auth/user': () => {
           return {}
         },

webapp/graphql/ModerationListQuery.js

@@ -1,7 +1,7 @@
 import gql from 'graphql-tag'
 
 export default app => {
-  return gql(`
+  return gql`
     query {
       Report(first: 20, orderBy: createdAt_desc) {
         id
@@ -30,6 +30,7 @@ export default app => {
           }
         }
         comment {
+          id
           contentExcerpt
           author {
             id
@@ -76,5 +77,5 @@ export default app => {
         }
       }
     }
-  `)
+  `
 }

webapp/graphql/admin/Statistics.js

@@ -0,0 +1,15 @@
+import gql from 'graphql-tag'
+
+export const Statistics = gql`
+  query {
+    statistics {
+      countUsers
+      countPosts
+      countComments
+      countNotifications
+      countInvites
+      countFollows
+      countShouts
+    }
+  }
+`

webapp/locales/de.json

@@ -22,6 +22,7 @@
   },
   "site": {
     "thanks": "Danke!",
+    "error-occurred": "Ein Fehler ist aufgetreten.",
     "made": "Mit ❤ gemacht",
     "imprint": "Impressum",
     "data-privacy": "Datenschutz",

webapp/locales/en.json

@@ -22,6 +22,7 @@
   },
   "site": {
     "thanks": "Thanks!",
+    "error-occurred": "An error occurred.",
     "made": "Made with ❤",
     "imprint": "Imprint",
     "termsAndConditions": "Terms and conditions",

webapp/package.json

@@ -107,7 +107,7 @@
     "eslint-config-standard": "~12.0.0",
     "eslint-loader": "~3.0.0",
     "eslint-plugin-import": "~2.18.2",
-    "eslint-plugin-jest": "~22.16.0",
+    "eslint-plugin-jest": "~22.17.0",
     "eslint-plugin-node": "~10.0.0",
     "eslint-plugin-prettier": "~3.1.0",
     "eslint-plugin-promise": "~4.2.1",

webapp/pages/admin/index.spec.js

@@ -0,0 +1,53 @@
+import { mount, createLocalVue } from '@vue/test-utils'
+import AdminIndexPage from './index.vue'
+import Styleguide from '@human-connection/styleguide'
+import VueApollo from 'vue-apollo'
+
+const localVue = createLocalVue()
+
+localVue.use(Styleguide)
+localVue.use(VueApollo)
+
+describe('admin/index.vue', () => {
+  let Wrapper
+  let store
+  let mocks
+
+  beforeEach(() => {
+    mocks = {
+      $t: jest.fn(),
+    }
+  })
+
+  describe('mount', () => {
+    Wrapper = () => {
+      return mount(AdminIndexPage, {
+        store,
+        mocks,
+        localVue,
+      })
+    }
+
+    describe('in loading state', () => {
+      beforeEach(() => {
+        mocks = { ...mocks, $apolloData: { loading: true } }
+      })
+
+      it.skip('shows a loading spinner', () => {
+        // I don't know how to mock the data that gets passed to
+        // ApolloQuery component
+        // What I found:
+        // https://github.com/Akryum/vue-apollo/issues/656
+        // https://github.com/Akryum/vue-apollo/issues/609
+        Wrapper()
+        const calls = mocks.$t.mock.calls
+        const expected = [['site.error-occurred']]
+        expect(calls).toEqual(expected)
+      })
+    })
+
+    describe('in error state', () => {
+      it.todo('displays an error message')
+    })
+  })
+})

webapp/pages/admin/index.vue

@@ -1,90 +1,134 @@
 <template>
   <ds-card>
-    <client-only>
-      <ds-space margin="large">
-        <ds-flex>
-          <ds-flex-item :width="{ base: '100%', sm: '50%', md: '33%' }">
-            <ds-space margin="small">
-              <ds-number :count="0" :label="$t('admin.dashboard.users')" size="x-large" uppercase>
-                <client-only slot="count">
-                  <hc-count-to :end-val="statistics.countUsers" />
-                </client-only>
-              </ds-number>
+    <ApolloQuery :query="Statistics">
+      <template v-slot="{ result: { loading, error, data } }">
+        <template v-if="loading">
+          <ds-space centered>
+            <ds-spinner size="large"></ds-spinner>
+          </ds-space>
+        </template>
+        <template v-else-if="error">
+          <ds-space centered>
+            <ds-space>
+              <img :src="errorIconPath" width="40" />
             </ds-space>
-          </ds-flex-item>
-          <ds-flex-item :width="{ base: '100%', sm: '50%', md: '33%' }">
-            <ds-space margin="small">
-              <ds-number :count="0" :label="$t('admin.dashboard.posts')" size="x-large" uppercase>
-                <client-only slot="count">
-                  <hc-count-to :end-val="statistics.countPosts" />
-                </client-only>
-              </ds-number>
-            </ds-space>
-          </ds-flex-item>
-          <ds-flex-item :width="{ base: '100%', sm: '50%', md: '33%' }">
-            <ds-space margin="small">
-              <ds-number
-                :count="0"
-                :label="$t('admin.dashboard.comments')"
-                size="x-large"
-                uppercase
-              >
-                <client-only slot="count">
-                  <hc-count-to :end-val="statistics.countComments" />
-                </client-only>
-              </ds-number>
-            </ds-space>
-          </ds-flex-item>
-          <ds-flex-item :width="{ base: '100%', sm: '50%', md: '33%' }">
-            <ds-space margin="small">
-              <ds-number
-                :count="0"
-                :label="$t('admin.dashboard.notifications')"
-                size="x-large"
-                uppercase
-              >
-                <client-only slot="count">
-                  <hc-count-to :end-val="statistics.countNotifications" />
-                </client-only>
-              </ds-number>
-            </ds-space>
-          </ds-flex-item>
-          <ds-flex-item :width="{ base: '100%', sm: '50%', md: '33%' }">
-            <ds-space margin="small">
-              <ds-number :count="0" :label="$t('admin.dashboard.invites')" size="x-large" uppercase>
-                <client-only slot="count">
-                  <hc-count-to :end-val="statistics.countInvites" />
-                </client-only>
-              </ds-number>
-            </ds-space>
-          </ds-flex-item>
-          <ds-flex-item :width="{ base: '100%', sm: '50%', md: '33%' }">
-            <ds-space margin="small">
-              <ds-number :count="0" :label="$t('admin.dashboard.follows')" size="x-large" uppercase>
-                <client-only slot="count">
-                  <hc-count-to :end-val="statistics.countFollows" />
-                </client-only>
-              </ds-number>
-            </ds-space>
-          </ds-flex-item>
-          <ds-flex-item :width="{ base: '100%', sm: '50%', md: '33%' }">
-            <ds-space margin="small">
-              <ds-number :count="0" :label="$t('admin.dashboard.shouts')" size="x-large" uppercase>
-                <client-only slot="count">
-                  <hc-count-to :end-val="statistics.countShouts" />
-                </client-only>
-              </ds-number>
-            </ds-space>
-          </ds-flex-item>
-        </ds-flex>
-      </ds-space>
-    </client-only>
+            <ds-text>
+              {{ $t('site.error-occurred') }}
+            </ds-text>
+          </ds-space>
+        </template>
+        <template v-else-if="data">
+          <ds-space margin="large">
+            <ds-flex>
+              <ds-flex-item :width="{ base: '100%', sm: '50%', md: '33%' }">
+                <ds-space margin="small">
+                  <ds-number
+                    :count="0"
+                    :label="$t('admin.dashboard.users')"
+                    size="x-large"
+                    uppercase
+                  >
+                    <client-only slot="count">
+                      <hc-count-to :end-val="data.statistics.countUsers" />
+                    </client-only>
+                  </ds-number>
+                </ds-space>
+              </ds-flex-item>
+              <ds-flex-item :width="{ base: '100%', sm: '50%', md: '33%' }">
+                <ds-space margin="small">
+                  <ds-number
+                    :count="0"
+                    :label="$t('admin.dashboard.posts')"
+                    size="x-large"
+                    uppercase
+                  >
+                    <client-only slot="count">
+                      <hc-count-to :end-val="data.statistics.countPosts" />
+                    </client-only>
+                  </ds-number>
+                </ds-space>
+              </ds-flex-item>
+              <ds-flex-item :width="{ base: '100%', sm: '50%', md: '33%' }">
+                <ds-space margin="small">
+                  <ds-number
+                    :count="0"
+                    :label="$t('admin.dashboard.comments')"
+                    size="x-large"
+                    uppercase
+                  >
+                    <client-only slot="count">
+                      <hc-count-to :end-val="data.statistics.countComments" />
+                    </client-only>
+                  </ds-number>
+                </ds-space>
+              </ds-flex-item>
+              <ds-flex-item :width="{ base: '100%', sm: '50%', md: '33%' }">
+                <ds-space margin="small">
+                  <ds-number
+                    :count="0"
+                    :label="$t('admin.dashboard.notifications')"
+                    size="x-large"
+                    uppercase
+                  >
+                    <client-only slot="count">
+                      <hc-count-to :end-val="data.statistics.countNotifications" />
+                    </client-only>
+                  </ds-number>
+                </ds-space>
+              </ds-flex-item>
+              <ds-flex-item :width="{ base: '100%', sm: '50%', md: '33%' }">
+                <ds-space margin="small">
+                  <ds-number
+                    :count="0"
+                    :label="$t('admin.dashboard.invites')"
+                    size="x-large"
+                    uppercase
+                  >
+                    <client-only slot="count">
+                      <hc-count-to :end-val="data.statistics.countInvites" />
+                    </client-only>
+                  </ds-number>
+                </ds-space>
+              </ds-flex-item>
+              <ds-flex-item :width="{ base: '100%', sm: '50%', md: '33%' }">
+                <ds-space margin="small">
+                  <ds-number
+                    :count="0"
+                    :label="$t('admin.dashboard.follows')"
+                    size="x-large"
+                    uppercase
+                  >
+                    <client-only slot="count">
+                      <hc-count-to :end-val="data.statistics.countFollows" />
+                    </client-only>
+                  </ds-number>
+                </ds-space>
+              </ds-flex-item>
+              <ds-flex-item :width="{ base: '100%', sm: '50%', md: '33%' }">
+                <ds-space margin="small">
+                  <ds-number
+                    :count="0"
+                    :label="$t('admin.dashboard.shouts')"
+                    size="x-large"
+                    uppercase
+                  >
+                    <client-only slot="count">
+                      <hc-count-to :end-val="data.statistics.countShouts" />
+                    </client-only>
+                  </ds-number>
+                </ds-space>
+              </ds-flex-item>
+            </ds-flex>
+          </ds-space>
+        </template>
+      </template>
+    </ApolloQuery>
   </ds-card>
 </template>
 
 <script>
-import gql from 'graphql-tag'
 import HcCountTo from '~/components/CountTo.vue'
+import { Statistics } from '~/graphql/admin/Statistics'
 
 export default {
   components: {
@@ -92,30 +136,9 @@ export default {
   },
   data() {
     return {
-      statistics: {},
+      errorIconPath: '/img/svg/emoji/cry.svg',
+      Statistics,
     }
   },
-  computed: {
-    isClient() {
-      return process.client
-    },
-  },
-  apollo: {
-    statistics: {
-      query: gql`
-        query {
-          statistics {
-            countUsers
-            countPosts
-            countComments
-            countNotifications
-            countInvites
-            countFollows
-            countShouts
-          }
-        }
-      `,
-    },
-  },
 }
 </script>

webapp/pages/index.spec.js

@@ -88,6 +88,8 @@ describe('PostIndex', () => {
     })
 
     it('clears the search when the filter menu emits clearSearch', () => {
+      mocks.$route.query.hashtag = '#samplehashtag'
+      wrapper = Wrapper()
       wrapper.find(FilterMenu).vm.$emit('clearSearch')
       expect(wrapper.vm.hashtag).toBeNull()
     })

webapp/pages/index.vue

@@ -222,7 +222,6 @@ export default {
   width: 250px;
   position: relative;
   float: right;
-  padding: 0 18px;
   margin: 4px 0;
 }
 </style>

webapp/pages/moderation/index.vue

@@ -1,8 +1,6 @@
 <template>
   <ds-card space="small">
-    <ds-heading tag="h3">
-      {{ $t('moderation.reports.name') }}
-    </ds-heading>
+    <ds-heading tag="h3">{{ $t('moderation.reports.name') }}</ds-heading>
     <ds-table v-if="Report && Report.length" :data="Report" :fields="fields" condensed>
       <template slot="name" slot-scope="scope">
         <div v-if="scope.row.type === 'Post'">
@@ -15,23 +13,23 @@
             <b>{{ scope.row.post.title | truncate(50) }}</b>
           </nuxt-link>
           <br />
-          <ds-text size="small" color="soft">
-            {{ scope.row.post.author.name }}
-          </ds-text>
+          <ds-text size="small" color="soft">{{ scope.row.post.author.name }}</ds-text>
         </div>
         <div v-else-if="scope.row.type === 'Comment'">
           <nuxt-link
             :to="{
               name: 'post-id-slug',
-              params: { id: scope.row.comment.post.id, slug: scope.row.comment.post.slug },
+              params: {
+                id: scope.row.comment.post.id,
+                slug: scope.row.comment.post.slug,
+              },
+              hash: `#commentId-${scope.row.comment.id}`,
             }"
           >
-            <b>{{ scope.row.comment.contentExcerpt | truncate(50) }}</b>
+            <b>{{ scope.row.comment.contentExcerpt | removeHtml | truncate(50) }}</b>
           </nuxt-link>
           <br />
-          <ds-text size="small" color="soft">
-            {{ scope.row.comment.author.name }}
-          </ds-text>
+          <ds-text size="small" color="soft">{{ scope.row.comment.author.name }}</ds-text>
         </div>
         <div v-else>
           <nuxt-link

webapp/pages/post/_id/_slug/index.vue

@@ -79,7 +79,7 @@ import ContentViewer from '~/components/Editor/ContentViewer'
 import HcCategory from '~/components/Category'
 import HcTag from '~/components/Tag'
 import ContentMenu from '~/components/ContentMenu'
-import HcUser from '~/components/User'
+import HcUser from '~/components/User/User'
 import HcShoutButton from '~/components/ShoutButton.vue'
 import HcCommentForm from '~/components/CommentForm/CommentForm'
 import HcCommentList from '~/components/CommentList/CommentList'

webapp/pages/post/create.vue

@@ -1,6 +1,6 @@
 <template>
   <ds-flex :width="{ base: '100%' }" gutter="base">
-    <ds-flex-item :width="{ base: '100%', md: 3 }">
+    <ds-flex-item :width="{ base: '100%', md: 5 }">
       <hc-contribution-form />
     </ds-flex-item>
     <ds-flex-item :width="{ base: '100%', md: 1 }">&nbsp;</ds-flex-item>

webapp/pages/profile/_id/_slug.spec.js

@@ -68,6 +68,7 @@ describe('ProfileSlug', () => {
         }
         mocks.$store = {
           getters: {
+            'auth/isModerator': () => false,
             'auth/user': {
               id: 'u23',
             },

webapp/pages/profile/_id/_slug.vue

@@ -258,7 +258,7 @@
 
 <script>
 import uniqBy from 'lodash/uniqBy'
-import User from '~/components/User'
+import User from '~/components/User/User'
 import HcPostCard from '~/components/PostCard'
 import HcFollowButton from '~/components/FollowButton.vue'
 import HcCountTo from '~/components/CountTo.vue'
@@ -388,7 +388,7 @@ export default {
     resetPostList() {
       this.offset = 0
       this.posts = []
-      this.hasMore = false
+      this.hasMore = true
     },
     async block(user) {
       await this.$apollo.mutate({ mutation: Block(), variables: { id: user.id } })

webapp/pages/settings/index.vue

@@ -101,7 +101,7 @@ export default {
     async submit() {
       this.loadingData = true
       const { name, about } = this.formData
-      let { locationName } = this.formData
+      let { locationName } = this.formData || this.currentUser
       locationName = locationName && (locationName['label'] || locationName)
       try {
         await this.$apollo.mutate({
@@ -159,7 +159,6 @@ export default {
         this.cities = []
         return
       }
-
       this.loadingGeo = true
       this.axiosSource = CancelToken.source()
 

webapp/yarn.lock

@@ -6392,10 +6392,10 @@ eslint-plugin-import@~2.18.2:
     read-pkg-up "^2.0.0"
     resolve "^1.11.0"
 
-eslint-plugin-jest@~22.16.0:
-  version "22.16.0"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-jest/-/eslint-plugin-jest-22.16.0.tgz#30c4e0e9dc331beb2e7369b70dd1363690c1ce05"
-  integrity sha512-eBtSCDhO1k7g3sULX/fuRK+upFQ7s548rrBtxDyM1fSoY7dTWp/wICjrJcDZKVsW7tsFfH22SG+ZaxG5BZodIg==
+eslint-plugin-jest@~22.17.0:
+  version "22.17.0"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-jest/-/eslint-plugin-jest-22.17.0.tgz#dc170ec8369cd1bff9c5dd8589344e3f73c88cf6"
+  integrity sha512-WT4DP4RoGBhIQjv+5D0FM20fAdAUstfYAf/mkufLNTojsfgzc5/IYW22cIg/Q4QBavAZsROQlqppiWDpFZDS8Q==
   dependencies:
     "@typescript-eslint/experimental-utils" "^1.13.0"