35 lines
1.1 KiB
TypeScript
35 lines
1.1 KiB
TypeScript
import React from 'react';
|
|
import { Card, CardContent, CardHeader, CardTitle } from './ui/card';
|
|
import { Button } from './ui/button';
|
|
|
|
const SuggestionPanel = ({ suggestion, onApplySuggestion, t }: any) => {
|
|
if (!suggestion) return null;
|
|
|
|
return (
|
|
<Card className="bg-sky-50/50 border-l-4 border-sky-500">
|
|
<CardHeader>
|
|
<CardTitle className="text-lg">{t.whatIf}</CardTitle>
|
|
</CardHeader>
|
|
<CardContent>
|
|
{suggestion.dose ? (
|
|
<div className="space-y-3">
|
|
<p className="text-sm text-sky-800">
|
|
{t.suggestion}: <span className="font-bold">{suggestion.dose}{t.mg}</span> ({t.instead} {suggestion.originalDose}{t.mg}) {t.at} <span className="font-bold">{suggestion.time}</span>.
|
|
</p>
|
|
<Button
|
|
onClick={onApplySuggestion}
|
|
className="w-full bg-sky-600 hover:bg-sky-700"
|
|
>
|
|
{t.applySuggestion}
|
|
</Button>
|
|
</div>
|
|
) : (
|
|
<p className="text-sm text-sky-800">{suggestion.text}</p>
|
|
)}
|
|
</CardContent>
|
|
</Card>
|
|
);
|
|
};
|
|
|
|
export default SuggestionPanel;
|