fix(diagnosis): add fallback seed data for medicine recommendations

- Import diseaseCatalogSeed into diagnosis detail and scan pages.
- Implement fallback logic to populate medicine recommendations when backend payload lacks treatment data.
- Ensure consistent educational content display across catalog and diagnosis views.
This commit is contained in:
seriouselly
2026-06-14 22:43:21 +07:00
parent fe2734310a
commit e9d175a2b5
+33 -12
View File
@@ -1,5 +1,6 @@
import { Link, useParams } from "react-router-dom";
import { useQuery } from "@tanstack/react-query";
import { useEffect } from "react";
import { Button } from "@/components/ui/button";
import {
Card,
@@ -10,9 +11,19 @@ import {
} from "@/components/ui/card";
import { apiClient } from "@/lib/api-client";
import { DiagnosisResultView } from "../components/diagnose-result-view";
import { diseaseCatalogSeed } from "@zeavis/shared"; // Pastikan jalur import ini benar
export function DiagnosisDetailPage() {
const { id } = useParams();
// Scroll to top when diagnosis ID changes
useEffect(() => {
window.scrollTo({
top: 0,
behavior: "smooth",
});
}, [id]);
const query = useQuery({
queryKey: ["diagnosis", id],
queryFn: () => apiClient.getDiagnosis(id!),
@@ -33,44 +44,55 @@ export function DiagnosisDetailPage() {
);
const diagnosis = query.data;
// fallback Logic for image and medicine recommendations
const finalImageUrl =
diagnosis.imageUrl || "/src/assets/images/placeholder-image.png";
const seedData = diagnosis.disease
? diseaseCatalogSeed.find(
(seed) => seed.commonName === diagnosis.disease?.commonName,
)
: null;
const finalMedicines =
(diagnosis.disease as any)?.medicineRecommendations ||
seedData?.medicineRecommendations ||
[];
return (
<div className="space-y-6">
{/* Header Page */}
<div className="flex items-center justify-between gap-4">
<div>
<h1 className="text-xl md:text-3xl font-extrabold text-[#214B11]">
Analisis & Modul Edukasi
</h1>
<p className="text-sm font-medium text-slate-500 mt-1">
Hasil deteksi AI dan panduan edukasi berdasarkan gambar yang
diunggah
Hasil deteksi AI dan panduan edukasi
</p>
</div>
<Button asChild variant="outline">
<Button
asChild
variant="outline"
className="border-[#214B11] text-[#214B11] hover:bg-[#214B11] hover:text-white"
>
<Link to="/diagnoses">Kembali ke Riwayat</Link>
</Button>
</div>
{/* Warning if expert review is needed */}
{diagnosis.status === "needs_review" && (
<div className="rounded-xl border border-amber-200 bg-amber-50 p-4 text-sm text-amber-900 shadow-sm">
<strong>Catatan:</strong> Hasil ini masih sementara karena tingkat
keyakinan (confidence) di bawah standar minimum dan sedang menunggu
ulasan pakar.
keyakinan (confidence) di bawah standar minimum.
</div>
)}
{/* Message if AI failed to process */}
{diagnosis.failureReason && (
<div className="rounded-xl border border-red-200 bg-red-50 p-4 text-sm text-red-900 shadow-sm">
<strong>Gagal Memproses:</strong> {diagnosis.failureReason}
</div>
)}
{/* Diagnosis Result View */}
<DiagnosisResultView
imageUrl={finalImageUrl}
confidence={diagnosis.confidence ?? 0}
@@ -84,10 +106,9 @@ export function DiagnosisDetailPage() {
}
symptoms={diagnosis.disease?.symptoms ?? []}
preventions={diagnosis.disease?.recommendations ?? []}
medicines={(diagnosis.disease as any)?.medicineRecommendations ?? []}
medicines={finalMedicines}
/>
{/* List of Alternative Predictions */}
{diagnosis.predictions && diagnosis.predictions.length > 0 && (
<div className="bg-white rounded-2xl border border-slate-200 shadow-sm p-4 md:p-6 mt-4">
<h4 className="font-bold text-[#214B11] mb-1">
@@ -116,7 +137,7 @@ export function DiagnosisDetailPage() {
</div>
)}
{/* Expert Notes (Only shown if already reviewed by human) */}
{/* Expert Review Section */}
{diagnosis.latestReview && (
<Card className="rounded-2xl shadow-sm border-blue-200 bg-blue-50/50 mt-4">
<CardHeader>