Showing
3 changed files
with
48 additions
and
3 deletions
... | @@ -71,4 +71,14 @@ export const createComment = async (id, content) => { | ... | @@ -71,4 +71,14 @@ export const createComment = async (id, content) => { |
71 | throw new Error('Failed to create comment!'); | 71 | throw new Error('Failed to create comment!'); |
72 | } | 72 | } |
73 | return response.data; | 73 | return response.data; |
74 | +} | ||
75 | + | ||
76 | +export const searchPost = async (search) => { | ||
77 | + const response = await axios.post(`${SERVER_BASE_URL}/post/search/`, { | ||
78 | + search, | ||
79 | + }); | ||
80 | + if (response.status !== 200 && response.status !== 201) { | ||
81 | + throw new Error('Failed to get posts!'); | ||
82 | + } | ||
83 | + return response.data; | ||
74 | } | 84 | } |
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
... | @@ -2,7 +2,7 @@ import { | ... | @@ -2,7 +2,7 @@ import { |
2 | HomeIcon, | 2 | HomeIcon, |
3 | SearchIcon, | 3 | SearchIcon, |
4 | UserIcon, | 4 | UserIcon, |
5 | - CubeIcon, | 5 | + TerminalIcon, |
6 | MailIcon, | 6 | MailIcon, |
7 | StarIcon | 7 | StarIcon |
8 | } from "@heroicons/react/outline" | 8 | } from "@heroicons/react/outline" |
... | @@ -17,13 +17,13 @@ function Header() { | ... | @@ -17,13 +17,13 @@ function Header() { |
17 | <header className="flex flex-col sm:flex-row m-5 mt-0 pt-5 justify-between items-center"> | 17 | <header className="flex flex-col sm:flex-row m-5 mt-0 pt-5 justify-between items-center"> |
18 | <Link href="/" passHref> | 18 | <Link href="/" passHref> |
19 | <div className="flex cursor-pointer transform hover:scale-105"> | 19 | <div className="flex cursor-pointer transform hover:scale-105"> |
20 | - <CubeIcon className="h-20" /> | 20 | + <TerminalIcon className="h-20" /> |
21 | <p className="text-7xl font-extrabold" >Learn In Web</p> | 21 | <p className="text-7xl font-extrabold" >Learn In Web</p> |
22 | </div></Link> | 22 | </div></Link> |
23 | <div className="flex flex-grow justify-evenly max-w-sm"> | 23 | <div className="flex flex-grow justify-evenly max-w-sm"> |
24 | <HeaderItem title='HOME' Icon={HomeIcon} link="/" /> | 24 | <HeaderItem title='HOME' Icon={HomeIcon} link="/" /> |
25 | <HeaderItem title='STAR' Icon={StarIcon} link="/" /> | 25 | <HeaderItem title='STAR' Icon={StarIcon} link="/" /> |
26 | - <HeaderItem title='SEARCH' Icon={SearchIcon} link="/" /> | 26 | + <HeaderItem title='SEARCH' Icon={SearchIcon} link="/search/" /> |
27 | <HeaderItem title='ACCOUNT' Icon={UserIcon} link="/" /> | 27 | <HeaderItem title='ACCOUNT' Icon={UserIcon} link="/" /> |
28 | <Islogin /> | 28 | <Islogin /> |
29 | </div> | 29 | </div> | ... | ... |
src/pages/search.js
0 → 100644
1 | +import { searchPost } from "../api/post/post"; | ||
2 | +import { useState } from "react"; | ||
3 | +import { SearchIcon } from "@heroicons/react/outline"; | ||
4 | + | ||
5 | +export default function Search() { | ||
6 | + const handleSubmit = async (e) => { | ||
7 | + e.preventDefault(); | ||
8 | + const search = await searchPost(e.target.search.value); | ||
9 | + console.log(search) | ||
10 | + setResult(search); | ||
11 | + } | ||
12 | + | ||
13 | + const [result, setResult] = useState([]); | ||
14 | + | ||
15 | + return ( | ||
16 | + <div className=" ml-10 mr-10"> | ||
17 | + <form onSubmit={handleSubmit}> | ||
18 | + <input name="search" id="search" placeholder="Search Something..." className="w-[90%] h-10 text-xl"></input> | ||
19 | + <button type="submit"> | ||
20 | + <SearchIcon className="h-10 ml-2 -mb-3 rounded-full border-black border-2 p-1" /> | ||
21 | + </button> | ||
22 | + </form> | ||
23 | + <div> | ||
24 | + <h1 className="text-2xl font-bold">Search Result</h1> | ||
25 | + {result.map((post) => { | ||
26 | + return ( | ||
27 | + <div> | ||
28 | + <h2>{post.title}</h2> | ||
29 | + </div> | ||
30 | + ) | ||
31 | + })} | ||
32 | + </div> | ||
33 | + </div> | ||
34 | + ); | ||
35 | +} | ||
... | \ No newline at end of file | ... | \ No newline at end of file |
-
Please register or login to post a comment