diff --git a/frontend/src/components/EventCard.js b/frontend/src/components/EventCard.js
index 85f29588b..389739b07 100644
--- a/frontend/src/components/EventCard.js
+++ b/frontend/src/components/EventCard.js
@@ -100,12 +100,25 @@ function EventCard(props) {
         style={{ height: "90%", overflowY: "auto" }}
       >
         <div className="gallery-card-header" style={{ height: "7.5rem" }}>
-          <Avatar
-            size={90}
-            icon={getImage(
-              create_user && create_user.image && create_user.image.url
-            )}
-          />
+          {create_user && create_user.role > 0 ? (
+            <NavLink
+              to={`/gallery/${create_user.role}/${event_item.user_id.$oid}`}
+            >
+              <Avatar
+                size={90}
+                icon={getImage(
+                  create_user && create_user.image && create_user.image.url
+                )}
+              />
+            </NavLink>
+          ) : (
+            <Avatar
+              size={90}
+              icon={getImage(
+                create_user && create_user.image && create_user.image.url
+              )}
+            />
+          )}
           <div className="gallery-header-text gallery-info-section">
             <Title style={styles.title} className="gallery-title-text">
               {truncate(event_item.title, 15)}
diff --git a/frontend/src/components/pages/EventDetail.js b/frontend/src/components/pages/EventDetail.js
index 95d2f873a..40f11acc0 100644
--- a/frontend/src/components/pages/EventDetail.js
+++ b/frontend/src/components/pages/EventDetail.js
@@ -14,6 +14,7 @@ import {
 import { useTranslation } from "react-i18next";
 import { ACCOUNT_TYPE, formatDateTime } from "utils/consts";
 import { useSelector } from "react-redux";
+import { NavLink } from "react-router-dom";
 
 const { Title, Paragraph } = Typography;
 
@@ -84,11 +85,25 @@ function EventDetail({ match }) {
           <div className={"mentor-profile-content-public"}>
             <div style={{ minWidth: "65%" }}>
               <div style={{ display: "flex" }}>
-                <Avatar
-                  size={120}
-                  src={createUser && createUser.image && createUser.image.url}
-                  icon={<UserOutlined />}
-                />
+                {createUser && createUser.role > 0 ? (
+                  <NavLink
+                    to={`/gallery/${createUser.role}/${event.user_id.$oid}`}
+                  >
+                    <Avatar
+                      size={120}
+                      src={
+                        createUser && createUser.image && createUser.image.url
+                      }
+                      icon={<UserOutlined />}
+                    />
+                  </NavLink>
+                ) : (
+                  <Avatar
+                    size={120}
+                    src={createUser && createUser.image && createUser.image.url}
+                    icon={<UserOutlined />}
+                  />
+                )}
                 <div style={{ marginLeft: "20px" }}>
                   <Title className="gallery-title-text">
                     {event && event.title}
diff --git a/frontend/src/utils/api.js b/frontend/src/utils/api.js
index a9aa5e6eb..04147d2e5 100644
--- a/frontend/src/utils/api.js
+++ b/frontend/src/utils/api.js
@@ -54,7 +54,11 @@ export const fetchAccountById = (id, type) => {
       account_type: type,
     },
   }).then(
-    (response) => response.data.result.account,
+    (response) => {
+      let res = response.data.result.account;
+      res.role = type;
+      return res;
+    },
     (err) => {
       console.error(err);
     }
@@ -98,7 +102,14 @@ export const fetchAccounts = (
       hub_user_id: hub_user_id,
     },
   }).then(
-    (response) => response.data.result.accounts,
+    (response) => {
+      let account_data = response.data.result.accounts;
+      account_data.map((account_item) => {
+        account_item.role = type;
+        return true;
+      });
+      return account_data;
+    },
     (err) => {
       console.error(err);
     }