aboutsummaryrefslogtreecommitdiff
path: root/vnext/src/ui/Users.js
diff options
context:
space:
mode:
Diffstat (limited to 'vnext/src/ui/Users.js')
-rw-r--r--vnext/src/ui/Users.js44
1 files changed, 44 insertions, 0 deletions
diff --git a/vnext/src/ui/Users.js b/vnext/src/ui/Users.js
new file mode 100644
index 00000000..a10bba7f
--- /dev/null
+++ b/vnext/src/ui/Users.js
@@ -0,0 +1,44 @@
+import React, { useState } from 'react';
+import PropTypes from 'prop-types';
+import ReactRouterPropTypes from 'react-router-prop-types';
+
+import UserInfo from './UserInfo';
+import Avatar from './Avatar';
+
+export function Friends({ match }) {
+ return <Users user={match.params.user} prop='read' />;
+}
+
+export function Readers({ match }) {
+ return <Users user={match.params.user} prop='readers' />;
+}
+
+function Users(props) {
+ const [user, setUser] = useState({ uid: 0, uname: props.user });
+ return (
+ <UserInfo user={user.uname} onUpdate={setUser}>
+ <div style={{ display: 'flex', flexWrap: 'wrap', flexDirection: 'row' }}>
+ {
+ user[props.prop] &&
+ user[props.prop].map(user =>
+ <Avatar key={user.uid} user={user} />
+ )
+ }
+ </div>
+ </UserInfo>
+ );
+}
+
+
+Friends.propTypes = {
+ match: ReactRouterPropTypes.match.isRequired
+};
+
+Readers.propTypes = {
+ match: ReactRouterPropTypes.match.isRequired
+};
+
+Users.propTypes = {
+ user: PropTypes.string.isRequired,
+ prop: PropTypes.string.isRequired
+};