From 324ad057716841e751fff0b9e5d2a4e3644a2151 Mon Sep 17 00:00:00 2001 From: Kartik Sharma Date: Wed, 5 Nov 2025 21:36:03 +0530 Subject: [PATCH] Adding API for EDIT in Recurring Expense. --- .../ManageRecurringExpense.jsx | 9 +++-- .../RecurringExpense/RecurringExpenseList.jsx | 5 +-- src/components/common/EmployeeSearchInput.jsx | 3 -- .../common/MultiEmployeeSearchInput.jsx | 34 ++++++++++++------- src/hooks/useExpense.js | 18 ++++++++-- src/repositories/ExpsenseRepository.jsx | 2 +- 6 files changed, 46 insertions(+), 25 deletions(-) diff --git a/src/components/RecurringExpense/ManageRecurringExpense.jsx b/src/components/RecurringExpense/ManageRecurringExpense.jsx index 3403d754..32a441b5 100644 --- a/src/components/RecurringExpense/ManageRecurringExpense.jsx +++ b/src/components/RecurringExpense/ManageRecurringExpense.jsx @@ -7,12 +7,17 @@ import { zodResolver } from '@hookform/resolvers/zod'; import { defaultRecurringExpense, PaymentRecurringExpense } from './RecurringExpenseSchema'; import { FREQUENCY_FOR_RECURRING, INR_CURRENCY_CODE } from '../../utils/constants'; import { useCurrencies, useProjectName } from '../../hooks/useProjects'; -import { useCreateRecurringExpense, usePayee, useUpdateRecurringExpense } from '../../hooks/useExpense'; +import { useCreateRecurringExpense, usePayee, useRecurringExpenseDetail, useUpdateRecurringExpense } from '../../hooks/useExpense'; import InputSuggestions from '../common/InputSuggestion'; import MultiEmployeeSearchInput from '../common/MultiEmployeeSearchInput'; function ManageRecurringExpense({ closeModal, requestToEdit = null }) { - const data = {} + const { + data, + isLoading, + isError, + error: requestError, + } = useRecurringExpenseDetail(requestToEdit); //APIs const { projectNames, loading: projectLoading, error, isError: isProjectError, } = useProjectName(); diff --git a/src/components/RecurringExpense/RecurringExpenseList.jsx b/src/components/RecurringExpense/RecurringExpenseList.jsx index df5de323..c5a6a4f4 100644 --- a/src/components/RecurringExpense/RecurringExpenseList.jsx +++ b/src/components/RecurringExpense/RecurringExpenseList.jsx @@ -102,14 +102,11 @@ const RecurringExpenseList = ({ search, filterStatuses }) => { } const header = [ - "Recurring Payment ID", "Category", "Title", - "Strike Date", "Amount", "Payee", "Frequency", - "Last Generation Date", "Next Generation", "Status", "Action", @@ -217,7 +214,7 @@ const RecurringExpenseList = ({ search, filterStatuses }) => { onClick={() => setManageRequest({ IsOpen: true, - projectId: project.id, + RecurringId: recurringExpense.id, }) } > diff --git a/src/components/common/EmployeeSearchInput.jsx b/src/components/common/EmployeeSearchInput.jsx index ede14c41..aa33c077 100644 --- a/src/components/common/EmployeeSearchInput.jsx +++ b/src/components/common/EmployeeSearchInput.jsx @@ -3,9 +3,6 @@ import { useEmployeesName } from "../../hooks/useEmployees"; import { useDebounce } from "../../utils/appUtils"; import { useController } from "react-hook-form"; import Avatar from "./Avatar"; - - - const EmployeeSearchInput = ({ control, name, diff --git a/src/components/common/MultiEmployeeSearchInput.jsx b/src/components/common/MultiEmployeeSearchInput.jsx index 917ee9f8..bb42e2b2 100644 --- a/src/components/common/MultiEmployeeSearchInput.jsx +++ b/src/components/common/MultiEmployeeSearchInput.jsx @@ -29,19 +29,29 @@ const MultiEmployeeSearchInput = ({ forAll ); - // Initialize selected employees from emails (comma-separated string) - useEffect(() => { - if (value && employees?.data) { - const emails = value.split(",").filter(Boolean); - const foundEmps = employees.data.filter((emp) => - emails.includes(emp.email) - ); - setSelectedEmployees(foundEmps); - if (forAll && foundEmps.length > 0) { - setSearch(""); // clear search field - } +useEffect(() => { + if (value && employees?.data) { + // Ensure value is a string (sometimes it may come as array/object) + const stringValue = + typeof value === "string" + ? value + : Array.isArray(value) + ? value.join(",") + : ""; + + const emails = stringValue.split(",").filter(Boolean); + const foundEmps = employees.data.filter((emp) => + emails.includes(emp.email) + ); + + setSelectedEmployees(foundEmps); + + if (forAll && foundEmps.length > 0) { + setSearch(""); // clear search field } - }, [value, employees?.data, forAll]); + } +}, [value, employees?.data, forAll]); + const handleSelect = (employee) => { if (!selectedEmployees.find((emp) => emp.email === employee.email)) { diff --git a/src/hooks/useExpense.js b/src/hooks/useExpense.js index b400e266..290b702d 100644 --- a/src/hooks/useExpense.js +++ b/src/hooks/useExpense.js @@ -454,8 +454,8 @@ export const useUpdateRecurringExpense = (onSuccessCallBack) => { return response.data; }, onSuccess: (updatedExpense, variables) => { - queryClient.removeQueries({ queryKey: ["RecurringExpense", variables.id] }); - queryClient.invalidateQueries({ queryKey: ["RecurringExpenseList"] }); + queryClient.removeQueries({ queryKey: ["recurringExpense", variables.id] }); + queryClient.invalidateQueries({ queryKey: ["recurringExpenseList"] }); showToast("Recurring Expense updated Successfully", "success"); if (onSuccessCallBack) onSuccessCallBack(); @@ -481,4 +481,16 @@ export const useRecurringExpenseList = ( }, keepPreviousData: true, }); -}; \ No newline at end of file +}; + +export const useRecurringExpenseDetail =(RequestId)=>{ + return useQuery({ + queryKey:['recurringExpense',RequestId], + queryFn:async()=>{ + RequestId + const resp = await ExpenseRepository.GetRecurringExpense(RequestId); + return resp.data; + }, + enabled:!!RequestId + }) +} \ No newline at end of file diff --git a/src/repositories/ExpsenseRepository.jsx b/src/repositories/ExpsenseRepository.jsx index 89cf2635..c18f0899 100644 --- a/src/repositories/ExpsenseRepository.jsx +++ b/src/repositories/ExpsenseRepository.jsx @@ -38,7 +38,7 @@ const ExpenseRepository = { }, CreateRecurringExpense: (data) => api.post("/api/Expense/recurring-payment/create", data), UpdateRecurringExpense: (id, data) => api.put(`/api/Expense/recurring-payment/edit/${id}`, data), - + GetRecurringExpense: (id) => api.get(`/api/Expense/get/recurring-payment/details/${id}`), //#endregion