import React from "react";
import { useEffect, useState } from "react";
import { Link, useParams } from "react-router-dom";
var JSONPretty = require('react-json-pretty');
import JSONPrettyMon from 'react-json-pretty/themes/monikai.css';
import "./Index.css";

const Patient = () => {
    let params = useParams();
    const [patient, setPatient] = useState(null)
    useEffect(() => {
        fetch(`/api/connections/${params.connId}/${params.serviceId}/${params.patientId}`).then(x => x.text()).then(x => setPatient(JSON.parse(x)) )
    }, [])

    return (
        <div>
            <h1 className="t-page-header">Patient</h1>
           {patient ? <JSONPretty id="json-pretty"  theme={JSONPrettyMon} data={patient}></JSONPretty> : null}
        </div>
    );
};

export default Patient;