diff --git a/src/app/ui/file-page/violation-table/case-complaint.tsx b/src/app/ui/file-page/violation-table/case-complaint.tsx index b87eab0..1b5569b 100644 --- a/src/app/ui/file-page/violation-table/case-complaint.tsx +++ b/src/app/ui/file-page/violation-table/case-complaint.tsx @@ -1,7 +1,7 @@ 'use client' import { ViolationFileDetail } from '@/app/hooks/react-query/useFileViolations'; -import { useActionState, useEffect, useState } from 'react'; +import {useActionState, useEffect, useState, SetStateAction} from 'react'; import { useTranslations } from 'next-intl'; import { createComplaint, fetchComplainInfo, MatchStatus } from '@/app/actions/violationActions'; import { toast } from 'sonner'; @@ -23,28 +23,29 @@ interface complaintInfo { const ENABLED_STATUSES = ['COMPLAINT_IN_WORK', 'COMPLAINT_AND_LEGAL_IN_WORK']; type UpdateStatusHandler = (id: number, status: MatchStatus) => Promise; -export default function CaseComplaint({ selectedViolation, updateStatusHandler }: { selectedViolation: ViolationFileDetail, updateStatusHandler: UpdateStatusHandler }) { +export default function CaseComplaint({ selectedViolation, updateStatusHandler, setLocalViolation }: + { + selectedViolation: ViolationFileDetail, + updateStatusHandler: UpdateStatusHandler, + setLocalViolation: React.Dispatch> + } +) { const t = useTranslations('Global'); - const [localViolation, setLocalViolation] = useState(selectedViolation); const [noteText, setNoteText] = useState(''); const [state, formAction, isPending] = useActionState(createComplaint, undefined); const [isTemplateModalOpen, setIsTemplateModalOpen] = useState(false); const [templateName, setTemplateName] = useState(''); - useEffect(() => { - setLocalViolation(selectedViolation); - }, [selectedViolation]); - const { data: complainInfo, isLoading: isLoadingComplain } = useQuery({ - queryKey: ['complainInfo', localViolation.id], - queryFn: () => fetchComplainInfo(localViolation.id), + queryKey: ['complainInfo', selectedViolation.id], + queryFn: () => fetchComplainInfo(selectedViolation.id), select: (data) => { if (data) { return data } }, - enabled: ENABLED_STATUSES.includes(localViolation.status), + enabled: ENABLED_STATUSES.includes(selectedViolation.status), }); useEffect(() => { @@ -58,7 +59,7 @@ export default function CaseComplaint({ selectedViolation, updateStatusHandler } setLocalViolation(prev => ({ ...prev, status: newStatus - })); + })) updateStatusHandler(selectedViolation.id, newStatus); } else if (state && !state.success) { @@ -106,13 +107,13 @@ export default function CaseComplaint({ selectedViolation, updateStatusHandler } setTemplateName(''); } - if (!ENABLED_STATUSES.includes(localViolation.status)) { + if (!ENABLED_STATUSES.includes(selectedViolation.status)) { return ( <>
- +
diff --git a/src/app/ui/file-page/violation-table/case-legal.tsx b/src/app/ui/file-page/violation-table/case-legal.tsx index 2f60cc6..e887610 100644 --- a/src/app/ui/file-page/violation-table/case-legal.tsx +++ b/src/app/ui/file-page/violation-table/case-legal.tsx @@ -1,7 +1,7 @@ 'use client' import { ViolationFileDetail } from '@/app/hooks/react-query/useFileViolations'; -import { useEffect, useState, useActionState } from 'react'; +import { useEffect, useActionState, SetStateAction } from 'react'; import { fetchCaseInfo, createCase, MatchStatus } from '@/app/actions/violationActions'; import { useQuery } from '@tanstack/react-query'; import { useTranslations } from 'next-intl'; @@ -29,20 +29,25 @@ interface CaseInfo { const ENABLED_STATUSES = ['LEGAL_IN_WORK', 'COMPLAINT_AND_LEGAL_IN_WORK']; type UpdateStatusHandler = (id: number, status: MatchStatus) => Promise; -export default function CaseViolation({ selectedViolation, updateStatusHandler }: { selectedViolation: ViolationFileDetail, updateStatusHandler: UpdateStatusHandler }) { +export default function CaseViolation({ selectedViolation, updateStatusHandler, setLocalViolation }: + { + selectedViolation: ViolationFileDetail, + updateStatusHandler: UpdateStatusHandler, + setLocalViolation: React.Dispatch> + } +) { const t = useTranslations('Global'); - const [localViolation, setLocalViolation] = useState(selectedViolation); const [state, formAction, isPending] = useActionState(createCase, undefined); const { data: caseInfo, isLoading: isLoadingCase } = useQuery({ - queryKey: ['caseInfo', localViolation.id], - queryFn: () => fetchCaseInfo(localViolation.id), + queryKey: ['caseInfo', selectedViolation.id], + queryFn: () => fetchCaseInfo(selectedViolation.id), select: (data) => { if (data) { return data } }, - enabled: ENABLED_STATUSES.includes(localViolation.status) + enabled: ENABLED_STATUSES.includes(selectedViolation.status) }); useEffect(() => { @@ -56,7 +61,7 @@ export default function CaseViolation({ selectedViolation, updateStatusHandler } setLocalViolation(prev => ({ ...prev, status: newStatus - })); + })) updateStatusHandler(selectedViolation.id, newStatus); } else if (state && !state.success) { @@ -69,12 +74,12 @@ export default function CaseViolation({ selectedViolation, updateStatusHandler } } }, [state, updateStatusHandler, selectedViolation.id]); - if (!ENABLED_STATUSES.includes(localViolation.status)) { + if (!ENABLED_STATUSES.includes(selectedViolation.status)) { return (
- +
diff --git a/src/app/ui/file-page/violation-table/file-page-violation-info-tabs.tsx b/src/app/ui/file-page/violation-table/file-page-violation-info-tabs.tsx index ae6e343..4c365b6 100644 --- a/src/app/ui/file-page/violation-table/file-page-violation-info-tabs.tsx +++ b/src/app/ui/file-page/violation-table/file-page-violation-info-tabs.tsx @@ -113,6 +113,7 @@ export default function FilePageViolationInfoTabs({ selectedViolation, updateSta key={"complaint_" + localViolation.id} selectedViolation={localViolation} updateStatusHandler={updateStatusHandler} + setLocalViolation={setLocalViolation} /> )} {activeTab === 'claim' && ( @@ -120,6 +121,7 @@ export default function FilePageViolationInfoTabs({ selectedViolation, updateSta key={"legal_" + localViolation.id} selectedViolation={localViolation} updateStatusHandler={updateStatusHandler} + setLocalViolation={setLocalViolation} /> )}