Add vaccine reminders to home page
- Show vaccine reminder banner on home page - Link to medical page for details - Show due/overdue status Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
parent
b93f1f5dcf
commit
260e287f0b
1 changed files with 25 additions and 1 deletions
|
|
@ -136,6 +136,7 @@ export default function HomePage() {
|
||||||
const [aiLoading, setAiLoading] = useState(false);
|
const [aiLoading, setAiLoading] = useState(false);
|
||||||
const [pendingCount, setPendingCount] = useState(0);
|
const [pendingCount, setPendingCount] = useState(0);
|
||||||
const [lastLogs, setLastLogs] = useState<any[]>([]);
|
const [lastLogs, setLastLogs] = useState<any[]>([]);
|
||||||
|
const [vaccineReminders, setVaccineReminders] = useState<any[]>([]);
|
||||||
const { theme, toggle: toggleTheme } = useTheme();
|
const { theme, toggle: toggleTheme } = useTheme();
|
||||||
const { childId, child, familyId, loading } = useFamily();
|
const { childId, child, familyId, loading } = useFamily();
|
||||||
|
|
||||||
|
|
@ -167,10 +168,17 @@ export default function HomePage() {
|
||||||
setPendingCount(queue.length);
|
setPendingCount(queue.length);
|
||||||
const handleOnline = () => processOfflineQueue();
|
const handleOnline = () => processOfflineQueue();
|
||||||
window.addEventListener("online", handleOnline);
|
window.addEventListener("online", handleOnline);
|
||||||
|
// Fetch vaccine notifications
|
||||||
|
if (childId) {
|
||||||
|
fetch(`/api/notifications?childId=${childId}`)
|
||||||
|
.then(res => res.json())
|
||||||
|
.then(data => setVaccineReminders(data.notifications || []))
|
||||||
|
.catch(console.error);
|
||||||
|
}
|
||||||
// Service worker disabled - causes errors in production
|
// Service worker disabled - causes errors in production
|
||||||
// if ("serviceWorker" in navigator) navigator.serviceWorker.register("/sw.js").catch(console.error);
|
// if ("serviceWorker" in navigator) navigator.serviceWorker.register("/sw.js").catch(console.error);
|
||||||
return () => window.removeEventListener("online", handleOnline);
|
return () => window.removeEventListener("online", handleOnline);
|
||||||
}, []);
|
}, [childId]);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
Promise.all([
|
Promise.all([
|
||||||
|
|
@ -261,6 +269,22 @@ export default function HomePage() {
|
||||||
|
|
||||||
{pendingCount > 0 && <div className="mx-4 mb-4 bg-amber-100 text-amber-800 px-4 py-2 rounded-xl text-center">{pendingCount} pending log{pendingCount > 1 ? "s" : ""}</div>}
|
{pendingCount > 0 && <div className="mx-4 mb-4 bg-amber-100 text-amber-800 px-4 py-2 rounded-xl text-center">{pendingCount} pending log{pendingCount > 1 ? "s" : ""}</div>}
|
||||||
|
|
||||||
|
{vaccineReminders.length > 0 && (
|
||||||
|
<div className="mx-4 mb-4 bg-red-50 border border-red-200 px-4 py-3 rounded-xl">
|
||||||
|
<Link href="/medical" className="flex items-center justify-between">
|
||||||
|
<div>
|
||||||
|
<div className="font-semibold text-red-700">💊 Vaccine Reminder</div>
|
||||||
|
<div className="text-sm text-red-600">
|
||||||
|
{vaccineReminders[0].status === "overdue"
|
||||||
|
? `${vaccineReminders[0].message}`
|
||||||
|
: `${vaccineReminders[0].vaccineName} due today`}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<span className="text-red-400">→</span>
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
<div className="px-4 mb-4">
|
<div className="px-4 mb-4">
|
||||||
<h2 className="font-semibold mb-3 ml-1">Quick Log</h2>
|
<h2 className="font-semibold mb-3 ml-1">Quick Log</h2>
|
||||||
<div className="grid grid-cols-4 gap-2">
|
<div className="grid grid-cols-4 gap-2">
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue