diff --git a/app/actions/comments.ts b/app/actions/comments.ts
index 7180af7..e8a775a 100644
--- a/app/actions/comments.ts
+++ b/app/actions/comments.ts
@@ -37,9 +37,9 @@ const notificationBody = (comment: { id: number, content: string }, user: { name
 }
 
 export async function addComment(prevState: { message: string }, formData: FormData) {
-    const general_error = 'There was an error with your comment, please try again later.'
+    const general_error = 'There was a problem with your comment, please try again later.'
     const authorisation_error = 'Error, you must be logged in to post a comment.'
-    const success_message = 'Your comment was submitted and is awaiting approval.'
+    const success_message = 'Thanks, your comment was submitted and is awaiting approval.'
 
     const schema = z.object({
         comment: z.string().min(3).max(255),
diff --git a/components/ui/Comments.tsx b/components/ui/Comments.tsx
index bb64885..2c8a9ea 100644
--- a/components/ui/Comments.tsx
+++ b/components/ui/Comments.tsx
@@ -20,6 +20,26 @@ type Comment = {
     }
 }
 
+Comments.Comment = function Comment({comment, isReply = false}: { comment: Comment, isReply?: boolean }) {
+    return (
+        <article className="flex gap-x-4 py-5">
+            <Image src={comment.user.image} alt={comment.user.name} width={64} height={64}
+                   className="size-12 rounded-full"/>
+            <div className="flex-auto">
+                <div className="flex items-baseline gap-x-1">
+                    <p className="font-semibold text-sm text-zinc-800 dark:text-zinc-100">{comment.user.name}</p>
+                    <p className="text-sm text-zinc-500 dark:text-zinc-400">
+                        <time dateTime={comment.created_at}>
+                            <span>&middot; {`${formatDistanceToNow(comment.created_at)} ago`}</span>
+                        </time>
+                    </p>
+                </div>
+                <p className="mt-1 text-sm text-zinc-600 dark:text-zinc-400 max-w-xl">{comment.content}</p>
+            </div>
+        </article>
+    )
+}
+
 type CommentsListProps = {
     comments: Comment[]
 }
@@ -33,21 +53,7 @@ Comments.List = function List({comments}: CommentsListProps) {
                         Comments
                     </h3>
                     {comments.map((comment) => (
-                        <article key={comment.id} className="flex gap-x-4 py-5">
-                            <Image src={comment.user.image} alt={comment.user.name} width={64} height={64}
-                                   className="size-12 rounded-full"/>
-                            <div className="flex-auto">
-                                <div className="flex items-baseline gap-x-1">
-                                    <p className="font-semibold text-sm text-zinc-800 dark:text-zinc-100">{comment.user.name}</p>
-                                    <p className="text-sm text-zinc-500 dark:text-zinc-400">
-                                        <time dateTime={comment.created_at}>
-                                            <span>&middot; {`${formatDistanceToNow(comment.created_at)} ago`}</span>
-                                        </time>
-                                    </p>
-                                </div>
-                                <p className="mt-1 text-sm text-zinc-600 dark:text-zinc-400 max-w-xl">{comment.content}</p>
-                            </div>
-                        </article>
+                        <Comments.Comment key={comment.id} comment={comment}/>
                     ))}
                 </section>
             }