#1583 added pointer and removed any type

Author: walker-sean

src/frontend/src/apis/finance.api.ts

@@ -6,7 +6,8 @@ import {
   CreateReimbursementRequestPayload,
   EditReimbursementRequestPayload,
   EditVendorPayload,
-  AccountCodePayload
+  AccountCodePayload,
+  RefundPayload
 } from '../hooks/finance.hooks';
 import axios from '../utils/axios';
 import { apiUrls } from '../utils/urls';
@@ -306,12 +307,11 @@ export const reportRefund = (amount: number, dateReceived: string) => {
  * Edits a refund in the database
  *
  * @param id the reimbursement id
- * @param amount the new amount reimbursed being reported
- * @param dateReceived the new date the refund was received
+ * @param formData the amount and date to edit the refund with
  * @returns the updated reimbursement
  */
-export const editRefund = (id: string, amount: number, dateReceived: string) => {
-  return axios.post(apiUrls.financeEditRefund(id), { amount, dateReceived });
+export const editRefund = (id: string, formData: RefundPayload) => {
+  return axios.post(apiUrls.financeEditRefund(id), formData);
 };
 
 /**

src/frontend/src/hooks/finance.hooks.ts

@@ -77,6 +77,11 @@ export interface EditVendorPayload {
   name: string;
 }
 
+export interface RefundPayload {
+  amount: number;
+  dateReceived: string;
+}
+
 /**
  * Custom React Hook to upload a new picture.
  */
@@ -416,10 +421,10 @@ export const useSendPendingAdvisorList = () => {
  */
 export const useReportRefund = () => {
   const queryClient = useQueryClient();
-  return useMutation<Reimbursement, Error, { refundAmount: number; dateReceived: string }>(
+  return useMutation<Reimbursement, Error, { amount: number; dateReceived: string }>(
     ['reimbursement'],
-    async (formData: { refundAmount: number; dateReceived: string }) => {
-      const { data } = await reportRefund(formData.refundAmount, formData.dateReceived);
+    async (formData: { amount: number; dateReceived: string }) => {
+      const { data } = await reportRefund(formData.amount, formData.dateReceived);
       queryClient.invalidateQueries(['reimbursement']);
       return data;
     }
@@ -430,13 +435,13 @@ export const useReportRefund = () => {
  * Custom react hook to edit a refund
  * @returns the edited refund
  */
-export const useEditRefund = () => {
+export const useEditRefund = (id: string) => {
   const queryClient = useQueryClient();
 
-  return useMutation<Reimbursement, Error, { refundId: string; refundAmount: number; dateReceived: string }>(
+  return useMutation<Reimbursement, Error, { amount: number; dateReceived: string }>(
     ['reimbursement', 'edit'],
-    async (formData: { refundId: string; refundAmount: number; dateReceived: string }) => {
-      const { data } = await editRefund(formData.refundId, formData.refundAmount, formData.dateReceived);
+    async (formData: { amount: number; dateReceived: string }) => {
+      const { data } = await editRefund(id, formData);
       return data;
     },
     {

src/frontend/src/pages/FinancePage/FinanceComponents/EditRefundModal.tsx

@@ -8,11 +8,10 @@ interface EditRefundModalProps {
 }
 
 const EditRefundModal: React.FC<EditRefundModalProps> = ({ refund, handleClose }: EditRefundModalProps) => {
-  const { mutateAsync, isLoading } = useEditRefund();
+  const { mutateAsync, isLoading } = useEditRefund(refund!.reimbursementId);
 
   const defaultValues: RefundModalInputs | undefined = refund && {
-    refundId: refund.reimbursementId,
-    refundAmount: (refund.amount / 100).toFixed(2),
+    amount: (refund.amount / 100).toFixed(2),
     dateReceived: new Date(refund.dateCreated)
   };
 

src/frontend/src/pages/FinancePage/FinanceComponents/RefundModal.tsx

@@ -10,7 +10,7 @@ import ReactHookTextField from '../../../components/ReactHookTextField';
 import { useToast } from '../../../hooks/toasts.hooks';
 
 const schema = yup.object().shape({
-  refundAmount: yup
+  amount: yup
     .number()
     .required('Refund amount is required')
     .positive('Refund amount must be positive')
@@ -37,8 +37,7 @@ interface RefundModalProps {
 }
 
 export interface RefundModalInputs {
-  refundId?: string;
-  refundAmount: string; // this allows us to display default value with 2 decimal places - the type is enforced and casted via the input field and form schema
+  amount: string; // this allows us to display default value with 2 decimal places - the type is enforced and casted via the input field and form schema
   dateReceived: Date;
 }
 
@@ -61,21 +60,20 @@ const RefundModal: React.FC<RefundModalProps> = ({
   } = useForm({
     resolver: yupResolver(schema),
     defaultValues: defaultValues ?? {
-      refundAmount: '0',
+      amount: '0',
       dateReceived: new Date()
     },
     mode: 'onChange'
   });
 
-  const handleConfirm = async (data: { refundAmount: number; dateReceived: Date }) => {
-    handleClose();
+  const handleConfirm = async (data: { amount: number; dateReceived: Date }) => {
     try {
       await mutateAsync({
-        refundId: defaultValues?.refundId,
-        refundAmount: Math.round(data.refundAmount * 100),
+        amount: Math.round(data.amount * 100),
         dateReceived: data.dateReceived.toISOString()
       });
       toast.success(defaultValues ? 'Account credit updated successfully' : 'New account credit reported successfully');
+      handleClose();
     } catch (error: unknown) {
       if (error instanceof Error) {
         toast.error(error.message);
@@ -92,20 +90,20 @@ const RefundModal: React.FC<RefundModalProps> = ({
       handleUseFormSubmit={handleSubmit}
       onFormSubmit={handleConfirm}
       formId="reimbursement-form"
-      disabled={!isValid || (defaultValues && defaultValues.refundAmount === watch('refundAmount'))}
+      disabled={!isValid || (defaultValues && defaultValues.amount === watch('amount'))}
     >
       {isLoading ? (
         <LoadingIndicator />
       ) : (
         <FormControl>
           <FormLabel>Amount</FormLabel>
           <ReactHookTextField
-            name="refundAmount"
+            name="amount"
             type="number"
             control={control}
             sx={{ width: 1 }}
             startAdornment={<AttachMoneyIcon />}
-            errorMessage={errors.refundAmount}
+            errorMessage={errors.amount}
           />
 
           <FormLabel sx={{ paddingTop: 2 }}>Date Received</FormLabel>

src/frontend/src/pages/FinancePage/RefundsSection.tsx

@@ -205,7 +205,7 @@ const Refunds = ({ userReimbursementRequests, allReimbursementRequests }: Refund
                 {rows.map((row, index) => (
                   <TableRow
                     key={`${row.date}-$${row.amount}-${index}`}
-                    sx={{ '&:last-child td, &:last-child th': { border: 0 } }}
+                    sx={{ '&:last-child td, &:last-child th': { border: 0 }, cursor: 'pointer' }}
                     onClick={() => {
                       setEditModalRefund({
                         reimbursementId: row.id,