dino/Adopt_a_pet-Codecademy
1
0
Fork 0
Code Issues 47 Pull Requests Packages Projects Releases Wiki Activity

Fully implemented the search function

Browse Source
This commit is contained in:
Dino Tutic 2023-07-13 21:06:19 +02:00
parent e707852e69
commit 8485efc47c
2 changed files with 9 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/App.js
View File

@ -19,6 +19,7 @@ const appRouter = createBrowserRouter(
<Route index element={<HomePage />} />
<Route path=":type" element={<HomePage />} />
<Route path=":type/:id" element={<PetDetailsPage />} />
<Route path="search" element={<SearchPage />} />
</Route>
)
);

16
src/pages/search/index.js
View File

@ -1,20 +1,20 @@
import React, { useState, useEffect } from 'react';
import Hero from '../../components/hero';
import { getPets } from '../../api/petfinder';
import Pet from '../../components/pet';
import React, { useState, useEffect } from "react";
import Hero from "../../components/hero";
import { getPets } from "../../api/petfinder";
import Pet from "../../components/pet";
import { useSearchParams } from "react-router-dom";
// Import useSearchParams
const SearchPage = () => {
// Get searchParams object from useSearchParams
const petNameToFind = 'REPLACE ME'; // Get query parameter using searchParams object
const [searchParams] = useSearchParams();
const petNameToFind = searchParams.get("name"); // Get query parameter using searchParams object
const [pets, setPets] = useState([]);
useEffect(() => {
async function getPetsData() {
const petsData = await getPets('', petNameToFind);
const petsData = await getPets("", petNameToFind);
setPets(petsData);
}