From 8b37980da344cadb4f33b65737fa34e5cff8f56f Mon Sep 17 00:00:00 2001
From: Alejandro Gomez <alejandro@strike.me>
Date: Fri, 6 Jan 2023 12:04:25 +0100
Subject: [PATCH] feat: link to user profile from name

---
 src/element/ProfileImage.css | 10 +++++++++-
 src/element/ProfileImage.js  | 11 +++++++----
 2 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/src/element/ProfileImage.css b/src/element/ProfileImage.css
index 4838fb72..90db64ce 100644
--- a/src/element/ProfileImage.css
+++ b/src/element/ProfileImage.css
@@ -9,4 +9,12 @@
     margin-right: 20px;
     border-radius: 10px;
     cursor: pointer;
-}
\ No newline at end of file
+}
+
+.pfp a {
+    text-decoration: none;
+}
+
+.pfp a:hover {
+    text-decoration: underline;
+}
diff --git a/src/element/ProfileImage.js b/src/element/ProfileImage.js
index 6ad60000..e9b3c85c 100644
--- a/src/element/ProfileImage.js
+++ b/src/element/ProfileImage.js
@@ -1,8 +1,11 @@
-import "./ProfileImage.css";
-import { useNavigate } from "react-router-dom";
+import { useMemo } from "react";
+
+import { Link, useNavigate } from "react-router-dom";
+
 import useProfile from "../feed/ProfileFeed";
 import Nostrich from "../nostrich.jpg";
-import { useMemo } from "react";
+
+import "./ProfileImage.css";
 
 export default function ProfileImage(props) {
     const pubkey = props.pubkey;
@@ -24,7 +27,7 @@ export default function ProfileImage(props) {
         <div className="pfp">
             <img src={hasImage ? user.picture : Nostrich} onClick={() => navigate(`/p/${pubkey}`)} />
             <div>
-                {name}
+                <Link key={pubkey} to={`/p/${pubkey}`}>{name}</Link>
                 {subHeader ? <div>{subHeader}</div> : null}
             </div>
         </div>