From 861fa2559fa16c3967a1d191a3a32d6eda6a4221 Mon Sep 17 00:00:00 2001
From: Vitaly Takmazov
Date: Sun, 15 Jul 2018 13:22:05 +0300
Subject: Friends and Readers components

---
 vnext/src/components/Message.js |  4 ++--
 vnext/src/components/Users.js   | 41 +++++++++++++++++++++++++++++++++++++++++
 2 files changed, 43 insertions(+), 2 deletions(-)
 create mode 100644 vnext/src/components/Users.js

(limited to 'vnext/src/components')

diff --git a/vnext/src/components/Message.js b/vnext/src/components/Message.js
index ad79f7f6..953276b5 100644
--- a/vnext/src/components/Message.js
+++ b/vnext/src/components/Message.js
@@ -106,8 +106,8 @@ function Tags({ data, user, ...rest }) {
 }
 
 Message.propTypes = {
-    data: MessageType,
-    visitor: UserType.isRequired,
+    data: PropTypes.instanceOf(MessageType),
+    visitor: PropTypes.instanceOf(UserType).isRequired,
     children: PropTypes.node
 };
 
diff --git a/vnext/src/components/Users.js b/vnext/src/components/Users.js
new file mode 100644
index 00000000..4201e1e0
--- /dev/null
+++ b/vnext/src/components/Users.js
@@ -0,0 +1,41 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Link } from 'react-router-dom';
+
+import { UserType } from './Types';
+
+export function Friends({ visitor, ...rest }) {
+    return <Users data={visitor.read || []} />;
+}
+
+export function Readers({ visitor, ...rest }) {
+    return <Users data={ visitor.readers || [] } />;
+}
+
+function Users({data, ...rest}) {
+    return (
+        <div className="users">
+            {
+                data.map(user => <span key={user.uid}>
+                        <Link to={`/${user.uname}/`}>
+                        <img src={`//i.juick.com/as/${user.uid}.png`} />
+                        <span>{user.uname}</span>
+                        </Link>
+                    </span>)
+            }
+        </div>
+    );
+}
+
+
+Friends.propTypes = {
+    visitor: UserType
+};
+
+Readers.propTypes = {
+    visitor: UserType
+};
+
+Users.propTypes = {
+    data: PropTypes.arrayOf(UserType).isRequired
+}
-- 
cgit v1.2.3