UserLink component

1 files changed, 28 insertions, 1 deletions

diff --git a/vnext/src/components/UserInfo.js b/vnext/src/components/UserInfo.js
index c76ef0c7..0a601834 100644
--- a/vnext/src/components/UserInfo.js
+++ b/vnext/src/components/UserInfo.js
@@ -4,7 +4,7 @@ import { Link } from 'react-router-dom';
 
 import { UserType } from './Types';
 
-import { info } from '../api';
+import { info, fetchUserUri } from '../api';
 
 import Avatar from './Avatar';
 import Icon from './Icon';
@@ -65,8 +65,35 @@ export default function UserInfo(props) {
     );
 }
 
+export function UserLink(props) {
+    const [user, setUser] = useState(props.user);
+    useEffect(() => {
+        setUser(props.user);
+        isMounted = true;
+        if (!user.uid && user.uri) {
+            fetchUserUri(user.uri).then(response => {
+                if (isMounted) {
+                    setUser(response.data);
+                }
+            });
+            return () => {
+                isMounted = false;
+            };
+        }
+    }, [props.user]);
+    return (
+        user.uid ?
+            <Link key={user.uid} to={`/${user.uname}/`}>{user.uname}</Link>
+            : <a href={user.uri}>{user.uname}</a>
+    )
+}
+
 UserInfo.propTypes = {
     user: PropTypes.string.isRequired,
     onUpdate: PropTypes.func,
     children: PropTypes.node
 };
+
+UserLink.propTypes = {
+    user: UserType.isRequired
+}