* create comment * reply to comment thread * edit comment * delete comment * resolve comment
34 lines
1 KiB
TypeScript
34 lines
1 KiB
TypeScript
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>
|
|
);
|
|
}
|