Skip to content

Commit bc74a78

Browse files
LemonDoubleLemonDouble
committed
feat : 신규 API 이전사항 반영
1 parent 340a8e9 commit bc74a78

File tree

2 files changed

+53
-102
lines changed

2 files changed

+53
-102
lines changed

‎src/app/page.tsx‎

Lines changed: 46 additions & 65 deletions
Original file line numberDiff line numberDiff line change
@@ -1,90 +1,71 @@
11
"use client"
2-
import {SearchBar} from "@/components/SearchBar";
3-
import {LemonLogo} from "@/components/icons/LemonLogo";
4-
import React, {useEffect, useState} from "react";
5-
import {useThrottle} from "@/hooks/useThrottle";
2+
import { SearchBar } from "@/components/SearchBar";
3+
import { LemonLogo } from "@/components/icons/LemonLogo";
4+
import React, { useEffect, useState } from "react";
5+
import { useThrottle } from "@/hooks/useThrottle";
66
import Image from "next/image";
7-
import {SearchResult, StatusResult} from "@/types";
7+
import { SearchResult, } from "@/types";
88
import Link from "next/link";
99

1010
export default function Home() {
1111
const [searchText, setSearchText] = useState("")
1212
const throttledInputText = useThrottle(searchText, 1000)
1313
const [searchResult, setSearchResult] = useState<SearchResult>({
14-
hits : [], query : "", processingTimeMs : 0, limit : 0, offset : 0, estimatedTotalHits :0
14+
data: [], total_page: 1, total_elements: 0
1515
})
16-
const [totalCount, setTotalCount] = useState(0)
1716

1817
useEffect(() => {
19-
async function handleSearchTextChange(){
20-
const response = await fetch("https://meili.rabbitprotocol.com/indexes/arca-con/search", {
21-
method : "POST",
18+
async function handleSearchTextChange() {
19+
const response = await fetch("https://search.lemondouble.com/arca_con/search", {
20+
method: "POST",
2221
headers: {
23-
'Content-Type' : 'application/json',
24-
'Authorization' : 'Bearer 6650f03192cafd48c3cce16810b0cf588690e501eb883ac0b5ae6b8df03d68ef'
22+
'Content-Type': 'application/json',
2523
},
26-
body : JSON.stringify({
27-
"q": throttledInputText,
28-
"attributesToSearchOn" : ["text"],
29-
"attributesToHighlight" :["text"],
30-
"highlightPreTag": "<search-highlight>",
31-
"highlightPostTag": "</search-highlight>",
32-
"limit": 101,
33-
"offset": 0
24+
body: JSON.stringify({
25+
"query": throttledInputText,
26+
"page": 1,
27+
"size": 40
3428
})
3529
})
36-
const result : SearchResult = await response.json()
30+
const result: SearchResult = await response.json()
3731
setSearchResult(result)
3832
}
3933

40-
async function handleTotalCount(){
41-
const response = await fetch("https://meili.rabbitprotocol.com/indexes/arca-con/stats", {
42-
method : "GET",
43-
headers: {
44-
'Content-Type' : 'application/json',
45-
'Authorization' : 'Bearer 6650f03192cafd48c3cce16810b0cf588690e501eb883ac0b5ae6b8df03d68ef'
46-
}
47-
})
48-
49-
const result : StatusResult = await response.json()
50-
setTotalCount(result.numberOfDocuments)
51-
}
52-
5334
handleSearchTextChange()
54-
handleTotalCount()
5535

5636
}, [throttledInputText]);
5737

58-
return (
59-
<main className="w-screen h-auto min-h-screen overflow-hidden">
60-
<header className="w-screen h-[80px] bg-lemon-yellow px-4 flex flex-row space-x-3 items-center">
61-
<LemonLogo width={32} height={32} />
62-
<span className="text-2xl font-extrabold">LemonDouble</span>
63-
</header>
64-
<div id="container" className="h-full xl:mx-[360px] flex flex-col items-center">
65-
<span className="text-3xl xl:text-6xl font-extrabold text-black-1 mt-12 text-nowrap">아카콘 미러</span>
66-
<span className="text-xl xl:text-3xl font-extrabold text-black-3 mt-3 text-nowrap">그런데 이제 대사로도 검색이 되는</span>
67-
<br />
68-
<span className="text-base text-black-1"> 현재 검색가능한 콘 개수 : {totalCount}개</span>
69-
<SearchBar
70-
value={searchText}
71-
onChange={(e) => setSearchText(e.target.value)}
72-
/>
73-
<div id="stack" className="mt-2 flex flex-col space-y-2 mx-2">
74-
{searchResult.hits.map(item => (
75-
<div className="xl:w-[790px] p-2 xl:p-8 flex flex-row space-x-5 bg-white-1 border-2 border-b-black-1 rounded-2xl" key={item.url}>
76-
<Image src={item.url} alt={"아카콘 이미지"} width={100} height={100} />
77-
<div className="flex flex-col grow">
78-
<span className="text-2xl font-bold text-black-1">{item.con_title}</span>
79-
<Link href={`https://arca.live/e/${item.con_number}`} target="_blank">
80-
<span className="text-lg font-normal text-black-3">{`https://arca.live/e/${item.con_number}`}</span>
81-
</Link>
82-
<span className="mt-2 text-lg font-semibold text-black-1" dangerouslySetInnerHTML={{__html : item._formatted.text}}></span>
38+
return (
39+
<main className="w-screen h-auto min-h-screen overflow-hidden">
40+
<header className="w-screen h-[80px] bg-lemon-yellow px-4 flex flex-row space-x-3 items-center">
41+
<LemonLogo width={32} height={32} />
42+
<span className="text-2xl font-extrabold">LemonDouble</span>
43+
</header>
44+
<div id="container" className="h-full xl:mx-[360px] flex flex-col items-center">
45+
<span className="text-3xl xl:text-6xl font-extrabold text-black-1 mt-12 text-nowrap">아카콘 미러</span>
46+
<span className="text-xl xl:text-3xl font-extrabold text-black-3 mt-3 text-nowrap">그런데 이제 대사로도 검색이 되는</span>
47+
<br />
48+
{searchResult.total_elements != 0 && <span className="text-base text-black-1"> 총 검색된 콘 개수 : {searchResult.total_elements}개</span>}
49+
<SearchBar
50+
value={searchText}
51+
onChange={(e) => setSearchText(e.target.value)}
52+
/>
53+
<div id="stack" className="mt-2 flex flex-col space-y-2 mx-2">
54+
{searchResult.data.map(item => (
55+
<div className="xl:w-[790px] p-2 xl:p-8 flex flex-row space-x-5 bg-white-1 border-2 border-b-black-1 rounded-2xl" key={item.url}>
56+
<Image src={item.url} alt={"아카콘 이미지"} width={100} height={100} />
57+
<div className="flex flex-col grow">
58+
<span className="text-2xl font-bold text-black-1">{item.con_title}</span>
59+
<Link href={`https://arca.live/e/${item.con_number}`} target="_blank">
60+
<span className="text-lg font-normal text-black-3">{`https://arca.live/e/${item.con_number}`}</span>
61+
</Link>
62+
<span className="mt-2 text-lg font-semibold text-black-1" dangerouslySetInnerHTML={{ __html: item.text }}></span>
63+
</div>
8364
</div>
84-
</div>
85-
))}
65+
))}
66+
67+
</div>
8668
</div>
87-
</div>
88-
</main>
89-
)
69+
</main>
70+
)
9071
}

‎src/types.ts‎

Lines changed: 7 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,42 +1,12 @@
11
export interface SearchResult {
2-
hits: Hit[]
3-
query: string
4-
processingTimeMs: number
5-
limit: number
6-
offset: number
7-
estimatedTotalHits: number
2+
total_page: number
3+
total_elements: number
4+
data : ArcaCon[]
85
}
96

10-
export interface Hit {
11-
uid: string
12-
con_number: number
7+
export interface ArcaCon{
8+
con_number : number
139
con_title: string
14-
url: string
15-
text: string
16-
confidence: number
17-
_formatted: Formatted
18-
}
19-
20-
export interface Formatted {
21-
uid: string
22-
con_number: string
23-
con_title: string
24-
url: string
25-
text: string
26-
confidence: string
27-
}
28-
29-
export interface StatusResult {
30-
numberOfDocuments: number
31-
isIndexing: boolean
32-
fieldDistribution: FieldDistribution
33-
}
34-
35-
export interface FieldDistribution {
36-
con_number: number
37-
con_title: number
38-
confidence: number
39-
text: number
40-
uid: number
41-
url: number
10+
text : string
11+
url : string
4212
}

0 commit comments

Comments
 (0)