From 955a9b5bb52c57737ae86ab267927bdc3b67f1be Mon Sep 17 00:00:00 2001 From: Alex Zorkin Date: Wed, 4 Dec 2024 14:51:51 -0800 Subject: [PATCH] fix: default allocation agreement to 1 row on empty data --- frontend/src/App.jsx | 2 +- ...ts.jsx => AddEditAllocationAgreements.jsx} | 16 ++- .../AddEditAllocationAgreements.test.jsx | 133 ++++++++++++++++++ 3 files changed, 149 insertions(+), 2 deletions(-) rename frontend/src/views/AllocationAgreements/{AddAllocationAgreements.jsx => AddEditAllocationAgreements.jsx} (94%) create mode 100644 frontend/src/views/AllocationAgreements/__tests__/AddEditAllocationAgreements.test.jsx diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx index f9ec1948b..0fca499df 100644 --- a/frontend/src/App.jsx +++ b/frontend/src/App.jsx @@ -32,7 +32,7 @@ import { AddEditOtherUses } from './views/OtherUses/AddEditOtherUses' import { AddEditFinalSupplyEquipments } from './views/FinalSupplyEquipments/AddEditFinalSupplyEquipments' import { AddEditFuelSupplies } from './views/FuelSupplies/AddEditFuelSupplies' import { AddEditFuelExports } from './views/FuelExports/AddEditFuelExports' -import { AddEditAllocationAgreements } from './views/AllocationAgreements/AddAllocationAgreements' +import { AddEditAllocationAgreements } from './views/AllocationAgreements/AddEditAllocationAgreements' import { logout } from '@/utils/keycloak.js' import { CompareReports } from '@/views/CompareReports/CompareReports' diff --git a/frontend/src/views/AllocationAgreements/AddAllocationAgreements.jsx b/frontend/src/views/AllocationAgreements/AddEditAllocationAgreements.jsx similarity index 94% rename from frontend/src/views/AllocationAgreements/AddAllocationAgreements.jsx rename to frontend/src/views/AllocationAgreements/AddEditAllocationAgreements.jsx index 2a9d258bf..390c792d5 100644 --- a/frontend/src/views/AllocationAgreements/AddAllocationAgreements.jsx +++ b/frontend/src/views/AllocationAgreements/AddEditAllocationAgreements.jsx @@ -71,7 +71,21 @@ export const AddEditAllocationAgreements = () => { const onGridReady = useCallback( async (params) => { setGridApi(params.api) - setRowData([...(data.allocationAgreements || { id: uuid() })]) + + if ( + Array.isArray(data.allocationAgreements) && + data.allocationAgreements.length > 0 + ) { + const updatedRowData = data.allocationAgreements.map((item) => ({ + ...item, + id: item.id || uuid() // Ensure every item has a unique ID + })) + setRowData(updatedRowData) + } else { + // If allocationAgreements is not available or empty, initialize with a single row + setRowData([{ id: uuid() }]) + } + params.api.sizeColumnsToFit() }, [data] diff --git a/frontend/src/views/AllocationAgreements/__tests__/AddEditAllocationAgreements.test.jsx b/frontend/src/views/AllocationAgreements/__tests__/AddEditAllocationAgreements.test.jsx new file mode 100644 index 000000000..ce7d72113 --- /dev/null +++ b/frontend/src/views/AllocationAgreements/__tests__/AddEditAllocationAgreements.test.jsx @@ -0,0 +1,133 @@ +// src/views/AllocationAgreements/__tests__/AddEditAllocationAgreements.test.jsx + +import React from 'react' +import { render, screen, fireEvent, waitFor } from '@testing-library/react' +import { describe, it, expect, beforeEach, vi } from 'vitest' +import { AddEditAllocationAgreements } from '../AddEditAllocationAgreements' +import * as useAllocationAgreementHook from '@/hooks/useAllocationAgreement' +import { wrapper } from '@/tests/utils/wrapper' + +// Mock react-router-dom hooks +const mockUseLocation = vi.fn() +const mockUseNavigate = vi.fn() +const mockUseParams = vi.fn() + +vi.mock('react-router-dom', () => ({ + ...vi.importActual('react-router-dom'), + useLocation: () => mockUseLocation(), + useNavigate: () => mockUseNavigate(), + useParams: () => mockUseParams() +})) + +// Mock react-i18next +vi.mock('react-i18next', () => ({ + useTranslation: () => ({ + t: (key) => key + }) +})) + +// Mock hooks related to allocation agreements +vi.mock('@/hooks/useAllocationAgreement') + +// Mock BCGridEditor component +vi.mock('@/components/BCDataGrid/BCGridEditor', () => ({ + BCGridEditor: ({ + gridRef, + alertRef, + onGridReady, + rowData, + onCellValueChanged, + onCellEditingStopped + }) => ( +
+
+ {rowData.map((row, index) => ( +
+ {row.id} +
+ ))} +
+
+ ) +})) + +describe('AddEditAllocationAgreements', () => { + beforeEach(() => { + vi.resetAllMocks() + + // Mock react-router-dom hooks with complete location object + mockUseLocation.mockReturnValue({ + pathname: '/test-path', // Include pathname to prevent undefined errors + state: {} + }) + mockUseNavigate.mockReturnValue(vi.fn()) + mockUseParams.mockReturnValue({ + complianceReportId: 'testReportId', + compliancePeriod: '2024' + }) + + // Mock useGetAllocationAgreements hook to return empty data initially + vi.mocked( + useAllocationAgreementHook.useGetAllocationAgreements + ).mockReturnValue({ + data: { allocationAgreements: [] }, + isLoading: false + }) + + // Mock useAllocationAgreementOptions hook + vi.mocked( + useAllocationAgreementHook.useAllocationAgreementOptions + ).mockReturnValue({ + data: { fuelTypes: [] }, + isLoading: false, + isFetched: true + }) + + // Mock useSaveAllocationAgreement hook + vi.mocked( + useAllocationAgreementHook.useSaveAllocationAgreement + ).mockReturnValue({ + mutateAsync: vi.fn() + }) + }) + + it('renders the component', () => { + render(, { wrapper }) + expect( + screen.getByText('allocationAgreement:addAllocationAgreementRowsTitle') + ).toBeInTheDocument() + }) + + it('initializes with at least one row in the empty state', () => { + render(, { wrapper }) + const rows = screen.getAllByTestId('grid-row') + expect(rows.length).toBe(1) // Ensure at least one row exists + }) + + it('loads data when allocationAgreements are available', async () => { + // Update the mock to return allocation agreements + vi.mocked( + useAllocationAgreementHook.useGetAllocationAgreements + ).mockReturnValue({ + data: { + allocationAgreements: [ + { allocationAgreementId: 'testId1' }, + { allocationAgreementId: 'testId2' } + ] + }, + isLoading: false + }) + + render(, { wrapper }) + + // Use findAllByTestId for asynchronous elements + const rows = await screen.findAllByTestId('grid-row') + expect(rows.length).toBe(2) + // Check that each row's textContent matches UUID format + const uuidRegex = + /^[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i + rows.forEach((row) => { + expect(uuidRegex.test(row.textContent)).toBe(true) + }) + }) +})