[OSDEV-1374] SLC. Connect search & result page for name and address search with Backend API (integration)

doc/release/RELEASE-NOTES.md

@@ -35,7 +35,7 @@ This project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html
     - Connected PATCH `/v1/moderation-events/{moderation_id}/` (for Reject button).
     - Connected POST `/v1/moderation-events/{moderation_id}/production-locations/` (for Create New Location button).
     - Connected PATCH `/v1/moderation-events/{moderation_id}/production-locations/{os_id}/` (for Confirm potential match button).
-    - UI improvements: 
+    - UI improvements:
         - Added a toast component to display notifications during moderation event updates.
         - Introduced a backdrop to prevent accidental clicks on other buttons during the update process.
     - Applied Django Signal for moderation-events OpenSearch index.
@@ -44,6 +44,10 @@ This project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html
     * Successful Search: If the search is successful, the results screen displays a list of production locations. Each item includes the following information about the production location: name, OS ID, address, and country name. Users can either select a specific production location or press the "I don’t see my Location" button, which triggers a confirmation dialog window.
     * Confirmation Dialog Window: In this window, users can confirm that no correct location was found using the provided search parameters. They can either proceed to create a new production location or return to the search.
     * Unsuccessful Search: If the search is unsuccessful, an explanation is provided along with two options: return to the search or add a new production location.
+* [OSDEV-1374](https://opensupplyhub.atlassian.net/browse/OSDEV-1374) - Implemented integration for the `Search results` page to show results of searching by name and address (`/contribute/production-location/search`):
+    - Connected GET `v1/production-locations`.
+    - Routing between pages `Production Location Search`,`Search returned no results`, `Production Location Information`, `Search results`, and `I don't see my Location` pop-up is configured.
+    - Max result limit set to 100.
 * [OSDEV-1579](https://opensupplyhub.atlassian.net/browse/OSDEV-1579) - Updated the API limit automated email to remove an outdated link referring to OAR and improve the languate for clarity. With this update the contributor will be informed of the correct process to follow if they have reached their API calls limit.
 
 ### Release instructions:

src/django/api/tests/test_search_results.py

@@ -0,0 +1,85 @@
+
+import unittest.mock
+from rest_framework.test import APITestCase
+from rest_framework import status
+
+OPEN_SEARCH_SERVICE = "api.views.v1.production_locations.OpenSearchService"
+
+
+class SearchResultsTest(APITestCase):
+    def setUp(self):
+        super().setUp()
+        self.name = 'CHANG+KNITTING+FACTORY'
+        self.address = 'TONGHU+ECONOMIC+DEVELOPMENT+ZONE，HUIZHOU%2C+CHINA'
+        self.county_code = 'CN'
+        self.name1 = 'test name'
+        self.address1 = 'test address'
+        self.county_code1 = 'AX'
+
+        self.search_mock = unittest.mock.patch(OPEN_SEARCH_SERVICE).start()
+        self.search_index_mock = self.search_mock.return_value.search_index
+        self.search_results_response_mock = {
+            "count": 2,
+            "data": [
+              {
+                "sector": [
+                    "Apparel"
+                ],
+                "coordinates": {
+                    "lat": 23.082231,
+                    "lng": 114.196658
+                },
+                "os_id": "CN2025016GP2VEJ",
+                "country": {
+                    "alpha_2": "CN",
+                    "alpha_3": "CHN",
+                    "name": "China",
+                    "numeric": "156"
+                },
+                "claim_status": "unclaimed",
+                "address": "KIU HING ROAD, 2-12 TONGHU, CHINA",
+                "name": "XIN CHANG CHANG KNITTING FACTORY"
+                },
+              {
+                "sector": [
+                    "Apparel"
+                ],
+                "coordinates": {
+                    "lat": 30.607581,
+                    "lng": 120.55107
+                },
+                "os_id": "CN2025016RHMQVG",
+                "country": {
+                    "alpha_2": "CN",
+                    "alpha_3": "CHN",
+                    "name": "China",
+                    "numeric": "156"
+                },
+                "claim_status": "unclaimed",
+                "address": "No. 2 Industrial Area Economic, Zhejiang Province",
+                "name": "Tongxiang Miracle Knitting Factory Co. Ltd."
+              }
+            ],
+        }
+
+    def get_url(self, name, address, county_code):
+        base_url = "/api/v1/production-locations/"
+        query_string = f"?name={name}&address={address}&country={county_code}"
+        return f"{base_url}?{query_string}"
+
+    def test_receive_search_results_data(self):
+        self.search_index_mock.return_value = self.search_results_response_mock
+        api_res = self.client.get(
+            self.get_url(self.name, self.address, self.county_code))
+        self.assertEqual(api_res.status_code, status.HTTP_200_OK)
+        self.assertEqual(api_res.data, self.search_results_response_mock)
+        self.assertEqual(len(api_res.data.get("data")),
+                         api_res.data.get("count"))
+
+    def test_get_search_results_not_found(self):
+        self.search_index_mock.return_value = {"data": [], "count": 0}
+        api_res = self.client.get(
+            self.get_url(self.name1, self.address1, self.county_code1))
+        self.assertEqual(api_res.status_code, status.HTTP_200_OK)
+        self.assertEqual(len(api_res.data.get("data")), 0)
+        self.assertEqual(api_res.data.get("count"), 0)

src/react/src/__tests__/components/ConfirmNotFoundLocationDialog.test.js

@@ -2,7 +2,7 @@ import React from "react";
 import renderWithProviders from "../../util/testUtils/renderWithProviders";
 import ConfirmNotFoundLocationDialog from "../../components/Contribute/ConfirmNotFoundLocationDialog";
 import history from "../../util/history";
-import { contributeProductionLocationRoute } from "../../util/constants";
+import { contributeProductionLocationRoute, productionLocationInfoRoute } from "../../util/constants";
 
 jest.mock("../../util/history", () => ({
     push: jest.fn(),
@@ -72,6 +72,9 @@ describe("ConfirmNotFoundLocationDialog component", () => {
 
         expect(mockHandleConfirmDialogClose).toHaveBeenCalledTimes(1);
         expect(mockClearLocations).toHaveBeenCalledTimes(1);
+        expect(history.push).toHaveBeenCalledWith(
+            productionLocationInfoRoute,
+        );
     });
 
     test("closes the dialog when the close button is clicked", () => {

src/react/src/__tests__/components/SearchByNameAndAddressNotFoundResult.test.js

@@ -1,14 +1,18 @@
 import React from 'react';
 import { fireEvent } from '@testing-library/react';
 import SearchByNameAndAddressNotFoundResult from '../../components/Contribute/SearchByNameAndAddressNotFoundResult';
-import { contributeProductionLocationRoute } from '../../util/constants';
+import { contributeProductionLocationRoute, productionLocationInfoRoute } from '../../util/constants';
 import history from '../../util/history';
 import renderWithProviders from '../../util/testUtils/renderWithProviders';
 
 jest.mock('../../util/history', () => ({
     push: jest.fn(),
 }));
 
+beforeEach(() => {
+    jest.clearAllMocks();
+});
+
 describe('SearchByNameAndAddressNotFoundResult component', () => {
     test('renders the not found message and buttons correctly', () => {
         const { getByText, getByRole } = renderWithProviders(<SearchByNameAndAddressNotFoundResult />);
@@ -35,4 +39,15 @@ describe('SearchByNameAndAddressNotFoundResult component', () => {
 
         expect(history.push).toHaveBeenCalledWith(`${contributeProductionLocationRoute}?tab=name-address`);
     });
+
+    test("navigates to the contribute page when 'Add a new Location' is clicked", () => {
+        const { getByRole } = renderWithProviders(<SearchByNameAndAddressNotFoundResult />);
+
+        const addNewLocation = getByRole('button', { name: 'Add a new Location' });
+        expect(addNewLocation).toBeInTheDocument();
+        fireEvent.click(addNewLocation);
+
+        expect(history.push).toHaveBeenCalledWith(productionLocationInfoRoute);
+        expect(history.push).toHaveBeenCalledTimes(1);
+    });
 });

src/react/src/__tests__/components/SearchByNameAndAddressSuccessResult.test.js

@@ -106,4 +106,15 @@ describe('SearchByNameAndAddressSuccessResult component', () => {
 
         expect(queryByText('Close Dialog')).not.toBeInTheDocument();
     });
+
+    test('the "Select" button is clicked', () => {
+        const { getAllByRole } = renderWithProviders(<SearchByNameAndAddressSuccessResult {...defaultProps} />);
+        const selectButtons = getAllByRole('button', { name: /Select/i });
+
+        selectButtons.forEach(button => {
+            expect(button).toBeInTheDocument();
+            fireEvent.click(button);
+        });
+    });
+
 });

src/react/src/__tests__/components/SearchByOsIdSuccessResult.test.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { fireEvent } from '@testing-library/react';
-import SearchByOsIdSuccessResult from '../../components/Contribute/SearchByOsIdSuccessResult';
+import SearchByOsIdSuccessResult  from '../../components/Contribute/SearchByOsIdSuccessResult';
 import renderWithProviders from '../../util/testUtils/renderWithProviders';
 
 jest.mock('../../components/Contribute/SearchByOsIdResultActions', () => ({
@@ -57,14 +57,13 @@ describe('SearchByOsIdSuccessResult component', () => {
         expect(getByRole('button', { name: 'Yes, add data and claim' })).toBeInTheDocument();
     });
 
-    test('calls handleBackToSearchByNameAddress when the default button is clicked', () => {
+    test('calls handleBackToSearchByNameAddress when the default button is clicked', async () => {
         const { getByRole } = renderWithProviders(<SearchByOsIdSuccessResult {...defaultProps} />);
-
         const backButton = getByRole('button', {
             name: 'No, search by name and address',
         });
-        fireEvent.click(backButton);
 
+        fireEvent.click(backButton);
         expect(defaultProps.handleBackToSearchByNameAddress).toHaveBeenCalledTimes(1);
     });
 });