diff --git a/apps/web/src/components/Shout/ShoutList/Shout/ReplyModal/ReplyModal.tsx b/apps/web/src/components/Shout/ShoutList/Shout/ReplyModal/ReplyModal.tsx
index 9445eed1..85db528e 100644
--- a/apps/web/src/components/Shout/ShoutList/Shout/ReplyModal/ReplyModal.tsx
+++ b/apps/web/src/components/Shout/ShoutList/Shout/ReplyModal/ReplyModal.tsx
@@ -11,7 +11,7 @@ import {
 } from "baseui/modal";
 import { Spinner } from "baseui/spinner";
 import { Textarea } from "baseui/textarea";
-import { LabelMedium } from "baseui/typography";
+import { LabelMedium, LabelSmall } from "baseui/typography";
 import { useAtomValue, useSetAtom } from "jotai";
 import { useState } from "react";
 import { Controller, useForm } from "react-hook-form";
@@ -19,6 +19,7 @@ import z from "zod";
 import { profileAtom } from "../../../../../atoms/profile";
 import { shoutsAtom } from "../../../../../atoms/shouts";
 import useShout from "../../../../../hooks/useShout";
+import scrollToTop from "../../../../../lib/scrollToTop";
 
 const ShoutSchema = z.object({
   message: z.string().min(1).max(1000),
@@ -238,10 +239,18 @@ function ReplyModal(props: ReplyModalProps) {
           <div className="ml-[20px] w-full">
             <Header>
               <div>
-                <Link to={`/profile/${shout.user.handle}`} onClick={close}>
-                  <LabelMedium className="!text-[var(--color-text)]">
+                <Link
+                  to={`/profile/${shout.user.handle}`}
+                  className="flex no-underline"
+                  style={{ textDecoration: "none" }}
+                  onClick={() => scrollToTop()}
+                >
+                  <LabelMedium className="!text-[var(--color-text)] no-underline">
                     {shout.user.displayName}
                   </LabelMedium>
+                  <LabelSmall className="ml-[5px] mt-[4px] no-underline !text-[var(--color-text-muted)]">
+                    @{shout.user.handle}
+                  </LabelSmall>
                 </Link>
               </div>
             </Header>
diff --git a/apps/web/src/components/Shout/ShoutList/Shout/Shout.tsx b/apps/web/src/components/Shout/ShoutList/Shout/Shout.tsx
index ef1a9920..fad6db04 100644
--- a/apps/web/src/components/Shout/ShoutList/Shout/Shout.tsx
+++ b/apps/web/src/components/Shout/ShoutList/Shout/Shout.tsx
@@ -6,7 +6,7 @@ import { ListItem } from "baseui/list";
 import { NestedMenus, StatefulMenu } from "baseui/menu";
 import { PLACEMENT, StatefulPopover } from "baseui/popover";
 import { StatefulTooltip } from "baseui/tooltip";
-import { LabelMedium } from "baseui/typography";
+import { LabelMedium, LabelSmall } from "baseui/typography";
 import dayjs from "dayjs";
 import { useAtomValue } from "jotai";
 import { useState } from "react";
@@ -17,6 +17,7 @@ import HeartOutline from "../../../Icons/HeartOutline";
 import SignInModal from "../../../SignInModal";
 import DeleteShoutModal from "./DeleteShoutModal";
 import ReplyModal from "./ReplyModal";
+import scrollToTop from "../../../../lib/scrollToTop";
 
 const Link = styled(DefaultLink)`
   color: inherit;
@@ -183,10 +184,18 @@ function Shout(props: ShoutProps) {
           <div className="ml-[20px] w-full">
             <Header>
               <div>
-                <Link to={`/profile/${shout.user.handle}`}>
-                  <LabelMedium className="!text-[var(--color-text)]">
+                <Link
+                  to={`/profile/${shout.user.handle}`}
+                  className="flex no-underline"
+                  style={{ textDecoration: "none" }}
+                  onClick={() => scrollToTop()}
+                >
+                  <LabelMedium className="!text-[var(--color-text)] no-underline">
                     {shout.user.displayName}
                   </LabelMedium>
+                  <LabelSmall className="ml-[5px] mt-[4px] no-underline !text-[var(--color-text-muted)]">
+                    @{shout.user.handle}
+                  </LabelSmall>
                 </Link>
               </div>
               <div>