CompletedState.tsx 1.2 KB

1234567891011121314151617181920212223242526272829303132
  1. import { FileText } from "lucide-react";
  2. interface CompletedStateProps {
  3. isGeneratingReport: boolean;
  4. chatType?: "medical" | "psychological";
  5. }
  6. export const CompletedState = ({ isGeneratingReport, chatType = "medical" }: CompletedStateProps) => {
  7. const reportType = chatType === "psychological" ? "Reporte Psicológico" : "Reporte Médico";
  8. return (
  9. <div className="text-center py-12">
  10. <div className="w-16 h-16 bg-primary/10 rounded-full flex items-center justify-center mx-auto mb-4">
  11. {isGeneratingReport ? (
  12. <div className="w-8 h-8 border-4 border-primary border-t-transparent rounded-full animate-spin"></div>
  13. ) : (
  14. <FileText className="w-8 h-8 text-primary" />
  15. )}
  16. </div>
  17. <h3 className="text-xl font-semibold text-foreground mb-2">
  18. {isGeneratingReport
  19. ? `Generando ${reportType}`
  20. : "Consulta Completada"}
  21. </h3>
  22. <p className="text-muted-foreground">
  23. {isGeneratingReport
  24. ? `Estamos procesando tu consulta y generando un ${reportType.toLowerCase()} personalizado.`
  25. : `Tu consulta ha sido completada. El ${reportType.toLowerCase()} ha sido generado y guardado.`}
  26. </p>
  27. </div>
  28. );
  29. };