feat: comments

* create comment
* reply to comment thread
* edit comment
* delete comment
* resolve comment

client/src/features/comment/comments.tsx

@@ -0,0 +1,34 @@
+import { useParams } from 'react-router-dom';
+import { useAtom } from 'jotai';
+import { commentsAtom } from '@/features/comment/atoms/comment-atom';
+import React, { useEffect } from 'react';
+import { getPageComments } from '@/features/comment/services/comment-service';
+import classes from '@/features/comment/components/comment.module.css';
+import { Text } from '@mantine/core';
+import CommentList from '@/features/comment/components/comment-list';
+
+export default function Comments() {
+  const { pageId } = useParams();
+  const [comments, setComments] = useAtom(commentsAtom(pageId));
+
+  useEffect(() => {
+    const fetchComments = async () => {
+      try {
+        const response = await getPageComments(pageId);
+        setComments(response);
+      } catch (error) {
+        console.error('Failed to fetch comments:', error);
+      }
+    };
+
+    fetchComments();
+  }, [pageId]);
+
+  return (
+    <div className={classes.wrapper}>
+      <Text mb="md" fw={500}>Comments</Text>
+
+      <CommentList comments={comments} />
+    </div>
+  );
+}