New published info location and author info

frontend/components/AuthorInfo/AuthorInfo.js

@@ -0,0 +1,42 @@
+// @flow
+import React, { Component } from 'react';
+import styled from 'styled-components';
+import type { User } from 'types';
+import { Flex } from 'reflexbox';
+
+const Container = styled(Flex)`
+  justify-content: space-between;
+  color: #bbb;
+  font-size: 13px;
+`;
+
+class AuthorInfo extends Component {
+  props: {
+    collaborators: Array<User>,
+    views: number,
+  };
+
+  render() {
+    const { collaborators, views } = this.props;
+
+    const users = collaborators.map((user, index, arr) => (
+      <span key={user.id}>
+        {user.name} {arr.length > 1 && (index < arr.length - 1 ? ',' : 'and')}
+      </span>
+    ));
+
+    return (
+      <Container align="center">
+        Recently edited by
+        {' '}
+        {users}
+        {' '}
+        and viewed
+        {` ${views} `}
+        times.
+      </Container>
+    );
+  }
+}
+
+export default AuthorInfo;