From bba3905c702b1b42e754731507a626056415f0f2 Mon Sep 17 00:00:00 2001 From: Richard Griffiths Date: Mon, 30 Sep 2024 20:08:17 +0100 Subject: [PATCH 1/3] Reviewer comment form fix --- next_frontend/components/common/NodeEdit.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/next_frontend/components/common/NodeEdit.tsx b/next_frontend/components/common/NodeEdit.tsx index bb359b55..3fdfcc59 100644 --- a/next_frontend/components/common/NodeEdit.tsx +++ b/next_frontend/components/common/NodeEdit.tsx @@ -488,7 +488,7 @@ const NodeEdit = ({ node, isOpen, setEditOpen }: NodeEditProps) => { handleClose={handleClose} loadingState={{ loading, setLoading }} setAction={setAction} - readOnly={readOnly} + readOnly={assuranceCase.permissions === 'view' ? true : false} /> )} Date: Mon, 30 Sep 2024 22:28:34 +0100 Subject: [PATCH 2/3] wip --- .../components/cases/NotesEditForm.tsx | 32 ++-- next_frontend/components/cases/NotesFeed.tsx | 154 ++++++++++-------- next_frontend/components/cases/NotesForm.tsx | 18 +- next_frontend/data/store.ts | 8 + 4 files changed, 125 insertions(+), 87 deletions(-) diff --git a/next_frontend/components/cases/NotesEditForm.tsx b/next_frontend/components/cases/NotesEditForm.tsx index f6126a39..c1ae9e37 100644 --- a/next_frontend/components/cases/NotesEditForm.tsx +++ b/next_frontend/components/cases/NotesEditForm.tsx @@ -17,6 +17,7 @@ import { import { Textarea } from '../ui/textarea' import { useLoginToken } from '@/hooks/useAuth' import useStore from '@/data/store' +import { useToast } from '../ui/use-toast' type NotesEditFormProps = { note: any, @@ -29,8 +30,9 @@ const formSchema = z.object({ const NotesEditForm = ({ note, setEdit } : NotesEditFormProps ) => { const [token] = useLoginToken(); - const { assuranceCase, setAssuranceCase } = useStore() + const { assuranceCase, setAssuranceCase, caseNotes, setCaseNotes } = useStore() const [loading, setLoading] = useState(false) + const { toast } = useToast() const { id, content } = note @@ -49,7 +51,7 @@ const NotesEditForm = ({ note, setEdit } : NotesEditFormProps ) => { } try { - let url = `${process.env.NEXT_PUBLIC_API_URL ?? process.env.NEXT_PUBLIC_API_URL_STAGING}/api/comments/${id}/` + let url = `${process.env.NEXT_PUBLIC_API_URL}/api/comments/${id}/` const requestOptions: RequestInit = { method: "PUT", @@ -62,27 +64,31 @@ const NotesEditForm = ({ note, setEdit } : NotesEditFormProps ) => { const response = await fetch(url, requestOptions); if(!response.ok) { - console.log('error') + toast({ + variant: 'destructive', + title: 'Failed to update comment', + description: 'Something went wrong trying to update the comment.', + }); + return } const updatedComment = await response.json(); // Find the index of the updated comment in the existing comments array - const updatedComments = assuranceCase.comments.map((comment:any) => + const updatedComments = caseNotes.map((comment:any) => comment.id === updatedComment.id ? updatedComment : comment ); - const updatedAssuranceCase = { - ...assuranceCase, - comments: updatedComments, - }; - - setAssuranceCase(updatedAssuranceCase); + setCaseNotes(updatedComments); setEdit(false); - setLoading(false) } catch (error) { - console.log('Error', error) - setLoading(false) + toast({ + variant: 'destructive', + title: 'Failed to update comment', + description: 'Something went wrong trying to update the comment.', + }); + } finally { + setLoading(false) } } diff --git a/next_frontend/components/cases/NotesFeed.tsx b/next_frontend/components/cases/NotesFeed.tsx index 2c6afece..71d7ac5c 100644 --- a/next_frontend/components/cases/NotesFeed.tsx +++ b/next_frontend/components/cases/NotesFeed.tsx @@ -6,69 +6,54 @@ import { Edit2, Pencil, PencilLine, PhoneOffIcon, Save, Trash2, User2Icon, X } f import moment from 'moment' import useStore from '@/data/store' import { Button } from '../ui/button' -import { useLoginToken } from '@/hooks/useAuth' +import { unauthorized, useLoginToken } from '@/hooks/useAuth' import { boolean } from 'zod' import NotesEditField from './NotesEditForm' import NotesEditForm from './NotesEditForm' - -// const activity = [ -// { -// id: 1, -// type: 'comment', -// person: { name: 'System User', href: '#' }, -// imageUrl: -// 'https://images.unsplash.com/photo-1520785643438-5bf77931f493?ixlib=rb-=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=8&w=256&h=256&q=80', -// comment: -// 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Tincidunt nunc ipsum tempor purus vitae id. Morbi in vestibulum nec varius. Et diam cursus quis sed purus nam. ', -// date: '01/01/2001', -// }, -// // { -// // id: 2, -// // type: 'assignment', -// // person: { name: 'Hilary Mahy', href: '#' }, -// // assigned: { name: 'Kristin Watson', href: '#' }, -// // date: '2d ago', -// // }, -// // { -// // id: 3, -// // type: 'tags', -// // person: { name: 'Hilary Mahy', href: '#' }, -// // tags: [ -// // { name: 'Bug', href: '#', color: 'fill-red-500' }, -// // { name: 'Accessibility', href: '#', color: 'fill-indigo-500' }, -// // ], -// // date: '6h ago', -// // }, -// { -// id: 4, -// type: 'comment', -// person: { name: 'System User', href: '#' }, -// imageUrl: -// 'https://images.unsplash.com/photo-1531427186611-ecfd6d936c79?ixlib=rb-=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=8&w=256&h=256&q=80', -// comment: -// 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Tincidunt nunc ipsum tempor purus vitae id. Morbi in vestibulum nec varius. Et diam cursus quis sed purus nam. Scelerisque amet elit non sit ut tincidunt condimentum. Nisl ultrices eu venenatis diam.', -// date: '01/01/2001', -// }, -// ] +import { useToast } from '../ui/use-toast' export default function NotesFeed({ }) { - const { assuranceCase, setAssuranceCase } = useStore() + const { assuranceCase, setAssuranceCase, caseNotes, setCaseNotes } = useStore() const [token] = useLoginToken(); const [edit, setEdit] = useState() const [editId, setEditId] = useState() const [newComment, setNewComment] = useState() + const [comments, setComments] = useState([]) + const { toast } = useToast(); //@ts-ignore assuranceCase.comments.sort((a, b) => new Date(b.created_at) - new Date(a.created_at)); + const fetchSingleCase = async () => { + const requestOptions: RequestInit = { + headers: { + Authorization: `Token ${token}`, + }, + }; + + const response = await fetch(`${process.env.NEXT_PUBLIC_API_URL}/api/cases/${assuranceCase.id}/`, requestOptions); + + if(response.status === 404 || response.status === 403 ) { + // TODO: 404 NOT FOUND PAGE + console.log('Render Not Found Page') + return + } + + if(response.status === 401) return unauthorized() + + const { comments } = await response.json() + return comments + } + useEffect(() => { //@ts-ignore - assuranceCase.comments.sort((a, b) => new Date(b.created_at) - new Date(a.created_at)); - },[assuranceCase]) + // assuranceCase.comments.sort((a, b) => new Date(b.created_at) - new Date(a.created_at)); + fetchSingleCase().then(comments => setCaseNotes(comments)) + },[caseNotes]) const handleNoteDelete = async (id: number) => { try { - let url = `${process.env.NEXT_PUBLIC_API_URL ?? process.env.NEXT_PUBLIC_API_URL_STAGING}/api/comments/${id}/` + let url = `${process.env.NEXT_PUBLIC_API_URL}/api/comments/${id}/` const requestOptions: RequestInit = { method: "DELETE", @@ -80,32 +65,69 @@ export default function NotesFeed({ }) { const response = await fetch(url, requestOptions); if(!response.ok) { - console.log('error') - } - - const updatedComments = assuranceCase.comments.filter((comment:any) => comment.id !== id) - - const updatedAssuranceCase = { - ...assuranceCase, - comments: updatedComments + toast({ + variant: 'destructive', + title: 'Unable to delete comment', + description: 'Something went wrong trying to delete the comment.', + }); + return } - setAssuranceCase(updatedAssuranceCase) + const updatedComments = caseNotes.filter((comment:any) => comment.id !== id) + setCaseNotes(updatedComments) } catch (error) { - console.log('Error', error) + toast({ + variant: 'destructive', + title: 'Unable to delete comment', + description: 'Something went wrong trying to delete the comment.', + }); } } + // const handleNoteDelete = async (id: number) => { + // try { + // let url = `${process.env.NEXT_PUBLIC_API_URL ?? process.env.NEXT_PUBLIC_API_URL_STAGING}api/comments/${id}/` + + // const requestOptions: RequestInit = { + // method: "DELETE", + // headers: { + // Authorization: `Token ${token}`, + // "Content-Type": "application/json", + // } + // }; + // const response = await fetch(url, requestOptions); + + // if(!response.ok) { + // console.log('error') + // return + // } + + // const updateCaseNotes = caseNotes.filter((note:any) => note.id !== id) + // setCaseNotes(updateCaseNotes) + + // // const updatedComments = assuranceCase.comments.filter((comment:any) => comment.id !== id) + + // // const updatedAssuranceCase = { + // // ...assuranceCase, + // // comments: updatedComments + // // } + + // // setAssuranceCase(updatedAssuranceCase) + // } catch (error) { + // console.log('Error', error) + // } + // } + return (
    - {assuranceCase.comments.length === 0 && ( + {caseNotes.length === 0 && (

    No notes have been added.

    )} - {assuranceCase.comments.map((activityItem: any, activityItemIdx: any) => ( -
  • + {caseNotes.map((note: any, index: any) => ( +
  • - {activityItemIdx !== assuranceCase.comments.length - 1 ? ( + {index !== caseNotes.length - 1 ? (