2 lines
5.0 KiB
JSON
2 lines
5.0 KiB
JSON
|
{"id":"chatcmpl-901c67d9b976f5f4","object":"chat.completion","created":1774200598,"model":"NousResearch\/Hermes-3-Llama-3.2-3B","choices":[{"index":0,"message":{"role":"assistant","content":"Here is the complete CommentSection.tsx component:\n\n```typescript\n\/\/ src\/components\/CommentSection.tsx\nimport React, { useState, useEffect, useRef, useCallback } from 'react';\nimport { Link, useHistory, useLocation } from 'react-router-dom';\nimport { TextField, InputAdornment, IconButton } from '@material-ui\/core';\nimport { makeStyles } from '@material-ui\/core\/styles';\nimport { useComments } from '..\/context';\nimport { useAuth } from '..\/context\/AuthContext';\nimport { useNotifications } from '..\/context\/NotificationsContext';\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n display: 'flex',\n flexDirection: 'column',\n },\n}));\n\nconst CommentSection: React.FC = () => {\n const { comments, addComment, updateComment, deleteComment } = useComments();\n const { user } = useAuth();\n const notifications = useNotifications();\n const history = useHistory();\n const location = useLocation();\n const commentRef = useRef(null);\n\n const handleAddComment = (content: string) => {\n addComment(content, user.id);\n commentRef.current.clear();\n };\n\n const handleUpdateComment = (comment_id: string, content: string) => {\n updateComment(comment_id, content);\n };\n\n const handleDeleteComment = (comment_id: string) => {\n deleteComment(comment_id);\n notifications.addNotification('success', 'Comment deleted successfully');\n };\n\n useEffect(() => {\n if (commentRef.current) {\n commentRef.current.clear();\n }\n }, [comments, addComment, updateComment, deleteComment]);\n\n return (\n <div className={classes.root}>\n <Container maxWidth=\"xl\">\n <div className={classes.commentList} ref={commentRef}>\n {\/* Comment list will be displayed here *\/}\n <\/div>\n <div className={classes.commentInput}>\n <TextField\n label=\"Add Comment\"\n multiline\n rows={4}\n variant=\"outlined\"\n fullWidth\n InputProps={{\n endAdornment: (\n <InputAdornment position=\"end\">\n <IconButton onClick={() => history.push(`\/tasks\/${comments[0]?.task_id}\/add_comment`)}>\n <Typography>Submit<\/Typography>\n <\/IconButton>\n <\/InputAdornment>\n ),\n }}\n \/>\n <\/div>\n <\/Container>\n <\/div>\n );\n};\n\nexport default CommentSection;\n```\n\nHere is the complete ActivityTimeline.tsx component:\n\n```typescript\n\/\/ src\/components\/ActivityTimeline.tsx\nimport React, { useState, useEffect, useRef, useCallback } from 'react';\nimport { Link, useHistory, useLocation } from 'react-router-dom';\nimport { IconButton, Tooltip, Chip, Typography } from '@material-ui\/core';\nimport { makeStyles } from '@material-ui\/core\/styles';\nimport { useActivities } from '..\/context';\nimport { useAuth } from '..\/context\/AuthContext';\nimport { useNotifications } from '..\/context\/NotificationsContext';\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n display: 'flex',\n flexDirection: 'column',\n },\n}));\n\nconst ActivityTimeline: React.FC = () => {\n const { activities } = useActivities();\n const { user } = useAuth();\n const notifications = useNotifications();\n const history = useHistory();\n const location = useLocation();\n const activityTimelineRef = useRef(null);\n\n const handleActivityUpdate = (activity_id: string) => {\n history.push(`\/tasks\/${activities[0]?.task_id}\/activity\/${activity_id}`);\n };\n\n useEffect(() => {\n if (activityTimelineRef.current) {\n activityTimelineRef.current.clear();\n }\n }, [activities]);\n\n return (\n <div className={classes.root}>\n <Container maxWidth=\"xl\">\n <div className={classes.activityTimeline} ref={activityTimelineRef}>\n
|