add hugging face call
This commit is contained in:
@@ -13,42 +13,86 @@ import { useUser } from "@clerk/nextjs";
|
||||
import { useEffect, useState } from "react";
|
||||
import axios from "axios";
|
||||
|
||||
|
||||
export default function Chat() {
|
||||
const router = useRouter();
|
||||
const { user } = useUser();
|
||||
const [userData, setUserData] = useState(null);
|
||||
const { user } = useUser();
|
||||
const [userData, setUserData] = useState(null);
|
||||
const [userQuery, setUserQuery] = useState('');
|
||||
const [chatHistory, setChatHistory] = useState<{ type: 'user' | 'bot', text: string }>([]);
|
||||
const [loading, setLoading] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (user) {
|
||||
axios.get(`/api/user?userId=${user.id}`).then(response => {
|
||||
setUserData(response.data);
|
||||
});
|
||||
}
|
||||
}, [user]);
|
||||
useEffect(() => {
|
||||
if (user) {
|
||||
axios.get(`/api/user?userId=${user.id}`).then(response => {
|
||||
setUserData(response.data);
|
||||
});
|
||||
}
|
||||
}, [user]);
|
||||
|
||||
if (userData) {
|
||||
if (userData.role != "patient") {
|
||||
if (userData) {
|
||||
if (userData.role !== "patient") {
|
||||
router.push("/suite/doctor/dashboard");
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
const handleSend = async () => {
|
||||
if (!userQuery.trim()) return;
|
||||
|
||||
setLoading(true);
|
||||
const response = await fetch('/api/chat', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({ query: userQuery }),
|
||||
});
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
setChatHistory([
|
||||
...chatHistory,
|
||||
{ type: 'user', text: userQuery },
|
||||
{ type: 'bot', text: data.answer },
|
||||
]);
|
||||
|
||||
setUserQuery('');
|
||||
setLoading(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="container mx-auto">
|
||||
<div className="grid gap-4">
|
||||
<Card>
|
||||
<CardContent className="space-y-4 p-4">
|
||||
<div className="block items-center">
|
||||
<Message avatarUrl="/vercel.svg" message="Hello, how can I assist you today?" sender="Dr. Smith" />
|
||||
<Message avatarUrl="/vercel.svg" message="I have some questions about my medication." sender="You" />
|
||||
</div>
|
||||
<div className="flex items-center">
|
||||
<Input id="message" placeholder="Type your message here..." className="flex-grow mx-0 rounded-none" />
|
||||
<Button className="mx-0 rounded-none">Send</Button>
|
||||
</div>
|
||||
<div className="block items-center">
|
||||
{chatHistory.map((msg, idx) => (
|
||||
<Message
|
||||
key={idx}
|
||||
avatarUrl="/vercel.svg"
|
||||
message={msg.text}
|
||||
sender={msg.type === 'user' ? "You" : "Bot"}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
<div className="flex items-center">
|
||||
<Input
|
||||
id="message"
|
||||
placeholder="Ask a medical question"
|
||||
value={userQuery}
|
||||
onChange={(e) => setUserQuery(e.target.value)}
|
||||
className="flex-grow mx-0 rounded-none"
|
||||
/>
|
||||
<Button
|
||||
className="mx-0 rounded-none"
|
||||
onClick={handleSend}
|
||||
disabled={loading}
|
||||
>
|
||||
{loading ? 'Loading...' : 'Send'}
|
||||
</Button>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
20
src/app/api/chat/route.js
Normal file
20
src/app/api/chat/route.js
Normal file
@@ -0,0 +1,20 @@
|
||||
import { InferenceAPI } from '@huggingface/inference';
|
||||
|
||||
const hfAPI = new InferenceAPI({ apiKey: process.env.HUGGING_FACE_API_KEY });
|
||||
|
||||
export default async function handler(req, res) {
|
||||
if (req.method === 'POST') {
|
||||
try {
|
||||
const { query } = req.body;
|
||||
|
||||
const response = await hfAPI.query('m42-health/Llama3-Med42-8B', { inputs: { text: query } });
|
||||
|
||||
res.status(200).json({ answer: response.data[0].generated_text });
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
res.status(500).json({ error: 'Error generating response' });
|
||||
}
|
||||
} else {
|
||||
res.status(405).json({ error: 'Method Not Allowed' });
|
||||
}
|
||||
}
|
||||
@@ -22,6 +22,6 @@
|
||||
"@/*": ["./src/*"]
|
||||
}
|
||||
},
|
||||
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts", "src/app/api/connectDB.js", "src/lib/utils.js", "src/app/(web)/account/page.jsx", "src/app/(panels)/suite/patient/account/page.jsx", "src/app/(panels)/suite/patient/dashboard/MedicationTable.jsx", "src/app/(panels)/suite/patient/dashboard/page.jsx", "src/app/api/transcribe/route.js", "src/components/ui/calendar.jsx", "src/app/(web)/page.jsx", "src/app/(web)/transcribe/page.jsx", "src/app/(web)/login/page.jsx", "src/app/(panels)/suite/layout.jsx", "src/app/(panels)/suite/doctor/dashboard/page.jsx", "src/app/(panels)/suite/patient/chat/page.jsx"],
|
||||
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts", "src/app/api/connectDB.js", "src/lib/utils.js", "src/app/(web)/account/page.jsx", "src/app/(panels)/suite/patient/account/page.jsx", "src/app/(panels)/suite/patient/dashboard/MedicationTable.jsx", "src/app/(panels)/suite/patient/dashboard/page.jsx", "src/app/api/transcribe/route.js", "src/components/ui/calendar.jsx", "src/app/(web)/page.jsx", "src/app/(web)/transcribe/page.jsx", "src/app/(web)/login/page.jsx", "src/app/(panels)/suite/layout.jsx", "src/app/(panels)/suite/doctor/dashboard/page.jsx", "src/app/(panels)/suite/patient/chat/page.jsx", "src/app/api/chat/route.js"],
|
||||
"exclude": ["node_modules"]
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user