Skip to content

Commit 2404e7b

Browse files
committed
search
1 parent aa6bf3f commit 2404e7b

File tree

3 files changed

+99
-34
lines changed

3 files changed

+99
-34
lines changed

lazyweb/components/utility/Modals/SearchBarModal/index.tsx

+45-34
Original file line numberDiff line numberDiff line change
@@ -25,36 +25,58 @@ const capitalize = (s:string) => {
2525
return s.charAt(0).toUpperCase() + s.slice(1).toLocaleLowerCase()
2626
}
2727

28+
async function query(data: { question: string }) {
29+
const response = await fetch(
30+
"/api/search",
31+
{
32+
method: "POST",
33+
body: JSON.stringify(data)
34+
}
35+
);
36+
const responsetext = await response.json()
37+
console.log(responsetext)
38+
return responsetext.text
39+
}
40+
41+
2842

2943
const SearchBarModal = ({isOpen, setIsOpen}:Props) => {
3044
const [search, setSearch] = useState('')
3145
const [resources, setResources] = useState<Resource[]>([])
3246
const [loading, setLoading] = useState(false)
47+
const [answer, setAnswer] = useState('')
3348
function closeModal() {
3449
setIsOpen(false)
3550
setSearch('')
51+
setAnswer('')
3652
setResources([])
3753
}
3854

3955
function openModal() {
4056
setIsOpen(true)
4157
}
4258

59+
useEffect(()=>{
60+
if(!search){
61+
setAnswer('')
62+
setResources([])
63+
}
64+
},[search])
65+
4366
const handleSubmit = async (e:React.FormEvent<HTMLFormElement>)=>{
4467
e.preventDefault()
68+
if(!search) return
69+
4570
try{
4671
setLoading(true)
47-
const {data} = await axiosInstance.post('/websites/search', {
48-
desc: search
49-
})
50-
const {resources} : {
51-
resources:Resource[]
52-
} = data
53-
setResources(resources)
72+
const res = await query({"question": `question: ${search}, make sure to always give resources in a list format with all the detail like NAME DESC and URL, if no resource is available just say 'No resource found', also go through all the resources in the context properly if the resource might be usefull include that also, don't hesitate just give as many resources as possible for the provided question`})
73+
setAnswer(res)
5474
}catch(err:any){
5575
toast.error(err.message || 'Something went wrong')
5676
}
57-
setLoading(false)
77+
finally{
78+
setLoading(false)
79+
}
5880
}
5981

6082

@@ -124,23 +146,23 @@ const SearchBarModal = ({isOpen, setIsOpen}:Props) => {
124146
</div>
125147
}
126148
{
127-
loading && resources.length<1 && isDesktop && <div className="w-full flex flex-col items-center">
149+
loading && isDesktop && <div className="w-full flex flex-col items-center">
128150
<div className='w-[40vw] flex items-center justify-between h-[4rem] border-white rounded-b-[10px] border p-[1rem] bg-[#0d0d0e]'>
129-
<div className='flex w-[50%] h-full items-center'>
151+
<div className='flex w-[50%] h-full items-center'>
130152
<p className='text-white truncate text-sm'>Searching...</p>
131-
</div>
153+
</div>
132154
<div className='flex gap-[0.5rem] items-center'>
133155
<ImSpinner8 className='text-white animate-spin h-[1.5rem] w-[1.5rem]'/>
134156
</div>
135157
</div>
136158
</div>
137159
}
138160
{
139-
!loading && resources.length<1 && isDesktop && <div className="w-full flex flex-col items-center">
161+
!loading && !answer && isDesktop && <div className="w-full flex flex-col items-center">
140162
<div className='w-[40vw] flex items-center justify-between h-[4rem] border-white rounded-b-[10px] border p-[1rem] bg-[#0d0d0e]'>
141-
<div className='flex w-[50%] h-full items-center'>
163+
<div className='flex w-[50%] h-full items-center'>
142164
<p className='text-white truncate text-sm'>Type something and Press Enter to Search...</p>
143-
</div>
165+
</div>
144166
<div className='flex gap-[0.5rem] items-center'>
145167
<MdKeyboardReturn className='text-white h-[1.5rem] w-[1.5rem]'/>
146168
</div>
@@ -152,31 +174,20 @@ const SearchBarModal = ({isOpen, setIsOpen}:Props) => {
152174
{isDesktop && <div className='w-full flex flex-col items-center'>
153175
<div className='border no-scrollbar border-white max-h-[60vh] overflow-y-auto overflow-x-hidden rounded-b-[10px]'>
154176
{
155-
resources.length>=1 && !loading && search && resources.map((res)=>{
156-
return (
157-
<div className='w-[40vw] flex items-center justify-between h-[4rem] border-b-white/50 border p-[0.5rem] bg-[#0d0d0e]'>
158-
<div className='flex w-[50%] items-center'>
159-
<Image src={res.image_url} alt={res.title} width={64} height={64} className=' h-[3rem] w-[3rem] object-cover'/>
160-
<div className='ml-[1rem] w-full'>
161-
<p title={
162-
`${res.title}\n${res.desc}`
163-
} className='text-white truncate text-sm'>{res.title}</p>
164-
</div>
165-
</div>
166-
<div className='flex gap-[0.5rem] items-center'>
167-
<a href={res.url} target='_blank' rel='noreferrer'>
168-
<HiExternalLink className='text-white h-[1.5rem] w-[1.5rem]'/>
169-
</a>
170-
</div>
171-
</div>
172-
)
173-
})
177+
answer && !loading && search && <div className='w-full flex flex-col items-center'>
178+
<div className='w-[40vw] overflow-x-auto no-scrollbar flex items-center justify-between border-white rounded-b-[10px] border p-[1rem] bg-[#0d0d0e]'>
179+
180+
<pre className='text-white text-sm'>{answer}</pre>
181+
182+
183+
</div>
184+
</div>
174185
}
175186

176187
</div>
177188
</div>}
178189

179-
{!isDesktop && <div className='mt-[3rem] w-full'>
190+
{!isDesktop && <div className='mt-[3rem] w-full'>
180191
{resources.length>=1 && !loading && <Reorder.Group values={resources} axis={'x'} onReorder={()=>{}} className='z-[1] md:ml-[3rem] flex gap-[1rem] flex-wrap mt-[2rem]'>
181192
{resources.map((e)=>{
182193
return (

lazyweb/pages/api/search.ts

+53
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
import { NextApiRequest, NextApiResponse } from "next";
2+
import nc from "next-connect";
3+
import https from "https";
4+
5+
const handler = nc<NextApiRequest, NextApiResponse>();
6+
7+
async function query(data:any) {
8+
const response = await fetch(
9+
"http://ai.lazyweb.rocks/api/v1/prediction/a3cf595c-5b58-4c7d-a8a5-b8a12983de7e",
10+
{
11+
headers: {
12+
Authorization: "Bearer CBpPiHUGEyxyMNz/MfD8XvWg6CFzXb2ahJhluX9kfc0=",
13+
"Content-Type": "application/json"
14+
},
15+
method: "POST",
16+
body: JSON.stringify(data)
17+
}
18+
);
19+
const result = await response.json();
20+
return result;
21+
}
22+
23+
handler.post(async (req, res) => {
24+
console.log(JSON.parse(req.body))
25+
const prompt = JSON.parse(req.body).question;
26+
console.log(prompt)
27+
28+
if (!prompt) {
29+
return res.json({ error: 'Missing Prompt' });
30+
}
31+
32+
try {
33+
const resData = await query({
34+
question:prompt
35+
})
36+
37+
let text = resData.text;
38+
//remove " at start and end it it is there
39+
if (text[0] === '"') {
40+
text = text.slice(1);
41+
}
42+
if (text[text.length - 1] === '"') {
43+
text = text.slice(0, -1);
44+
}
45+
console.log(text)
46+
return res.status(200).json({text})
47+
} catch (error) {
48+
console.error('Error checking HTTPS support:', error);
49+
}
50+
51+
})
52+
53+
export default handler

lazyweb/styles/globals.css

+1
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@ html{
1919
user-select: none;
2020
}
2121

22+
2223
.__react_component_tooltip{
2324
background:#35363a !important;
2425
opacity:1 !important;

0 commit comments

Comments
 (0)