diff --git a/src/components/button/button.tsx b/src/components/button/button.tsx index 881a256..8499fc8 100644 --- a/src/components/button/button.tsx +++ b/src/components/button/button.tsx @@ -2,6 +2,6 @@ import React from "react"; import { ButtonStyled } from "./button.style"; -export const Button = (props: React.HtmlHTMLAttributes) => { +export const Button = (props: React.HtmlHTMLAttributes & { type: "button" | "submit" | "reset" }) => { return ; }; diff --git a/src/pages/search-character.tsx b/src/pages/search-character.tsx index 75bfde6..27f5f58 100644 --- a/src/pages/search-character.tsx +++ b/src/pages/search-character.tsx @@ -1,5 +1,5 @@ import React, { useEffect, useState, useRef } from "react"; -import { Link as Connectedlink } from "react-router-dom"; +import { Link as Connectedlink, useNavigate } from "react-router-dom"; import data from "../__stubs__/characters.json"; import logo from "../assets/logo_1x.png"; @@ -27,6 +27,7 @@ export const SearchCharacterPage = () => { const [searchValue, setSearchValue] = useState(""); const [searchValueError, setSearchValueError] = useState(false); const searchInputRef = useRef(); + const nav = useNavigate() useEffect(() => { searchInputRef.current.focus(); @@ -45,6 +46,30 @@ export const SearchCharacterPage = () => { setSearchValue(value); }; + const handleSubmitSearchFrom = (event) => { + event.preventDefault(); + + fetch(`${URLs.api.main}/search`, { + method: 'POST', + body: JSON.stringify({ + search: searchValue + }), + headers: { + 'Content-Type': 'application/json' + } + }) + .then((response) => response.json()) + .then((data) => { + const isAlive = data.data[0].status === "alive"; + + if (isAlive) { + nav(URLs.baseUrl) + } else { + nav(URLs.ui.charDetail.getUrl(data.data[0].id)) + } + }) + } + return ( <> @@ -71,7 +96,7 @@ export const SearchCharacterPage = () => { Поиск персонажей - + { placeHolder="Напишите имя для поиска" /> {searchValueError && Ай яй} - Поиск + Поиск diff --git a/stubs/api/index.js b/stubs/api/index.js index b236ff1..44023af 100644 --- a/stubs/api/index.js +++ b/stubs/api/index.js @@ -7,10 +7,20 @@ router.get("/landing-data", (request, response) => { router.post("/login", (req, res) => { const { username, password } = req.body; if (username === "admin") { - response.send(require("../json/landing-data/success.json")); + response.send(require("../json/user/sitter.success.json")); } else { response.send(require("../json/landing-data/success.json")); } }); +router.post('/search', (req, res) => { + const { search } = req.body; + + if (search === "Morty") { + return res.send(require("../json/seach/alive.success.json")); + } + + res.send(require("../json/seach/success.json")); +}) + module.exports = router; diff --git a/stubs/json/seach/alive.success.json b/stubs/json/seach/alive.success.json new file mode 100644 index 0000000..1395f60 --- /dev/null +++ b/stubs/json/seach/alive.success.json @@ -0,0 +1,24 @@ +{ + "data": [ + { + "id": 14, + "name": "Morty", + "status": "alive", + "species": "Alien", + "type": "", + "gender": "Male", + "origin": { + "name": "unknown", + "url": "" + }, + "location": { + "name": "Citadel of Ricks", + "url": "https://rickandmortyapi.com/api/location/3" + }, + "image": "https://rickandmortyapi.com/api/character/avatar/14.jpeg", + "episode": ["https://rickandmortyapi.com/api/episode/10"], + "url": "https://rickandmortyapi.com/api/character/14", + "created": "2017-11-04T20:51:31.373Z" + } + ] +} diff --git a/stubs/json/seach/success.json b/stubs/json/seach/success.json new file mode 100644 index 0000000..d1728d0 --- /dev/null +++ b/stubs/json/seach/success.json @@ -0,0 +1,24 @@ +{ + "data": [ + { + "id": 14, + "name": "Alien Morty", + "status": "unknown", + "species": "Alien", + "type": "", + "gender": "Male", + "origin": { + "name": "unknown", + "url": "" + }, + "location": { + "name": "Citadel of Ricks", + "url": "https://rickandmortyapi.com/api/location/3" + }, + "image": "https://rickandmortyapi.com/api/character/avatar/14.jpeg", + "episode": ["https://rickandmortyapi.com/api/episode/10"], + "url": "https://rickandmortyapi.com/api/character/14", + "created": "2017-11-04T20:51:31.373Z" + } + ] +} diff --git a/stubs/json/user/sitter.success.json b/stubs/json/user/sitter.success.json new file mode 100644 index 0000000..4029ccf --- /dev/null +++ b/stubs/json/user/sitter.success.json @@ -0,0 +1,6 @@ +{ + "data": { + "role": "sitter", + + } +} \ No newline at end of file