diff --git a/client/src/pages/patients/patient-details/components/MedicalInfo.jsx b/client/src/pages/patients/patient-details/components/MedicalInfo.jsx
index ba1b08e8..6916c2f8 100644
--- a/client/src/pages/patients/patient-details/components/MedicalInfo.jsx
+++ b/client/src/pages/patients/patient-details/components/MedicalInfo.jsx
@@ -22,29 +22,35 @@ export default function MedicalInfo({ allergies, medications, conditions }) {
       <Paper shadow="xs" p="md" radius="md" withBorder>
         <section>
           <Text className={classes.boldText}>Allergies</Text>
-          {allergies.length === 0 && <Text>None</Text>}
-          {allergies.map((entry) => (
-            <Pill
-              size="md"
-              key={entry.allergy.id}
-              className={classes.medicalInfoPills}
-            >
-              {entry.allergy.name}
-            </Pill>
-          ))}
+          {allergies.length === 0 ? (
+            <Text>None</Text>
+          ) : (
+            allergies.map((entry) => (
+              <Pill
+                size="md"
+                key={entry.allergy.id}
+                className={classes.medicalInfoPills}
+              >
+                {entry.allergy.name}
+              </Pill>
+            ))
+          )}
         </section>
         <section>
           <Text className={classes.boldText}>Medications</Text>
-          {medications.length === 0 && <Text>None</Text>}
-          {medications.map((entry) => (
-            <Pill
-              size="md"
-              key={entry.medication.id}
-              className={classes.medicalInfoPills}
-            >
-              {entry.medication.name}
-            </Pill>
-          ))}
+          {medications.length === 0 ? (
+            <Text>None</Text>
+          ) : (
+            medications.map((entry) => (
+              <Pill
+                size="md"
+                key={entry.medication.id}
+                className={classes.medicalInfoPills}
+              >
+                {entry.medication.name}
+              </Pill>
+            ))
+          )}
         </section>
         <section>
           <Text className={classes.boldText}>Conditions</Text>
diff --git a/client/src/pages/patients/patient-details/components/Preferences.jsx b/client/src/pages/patients/patient-details/components/Preferences.jsx
index c6f3bc01..26ed2a43 100644
--- a/client/src/pages/patients/patient-details/components/Preferences.jsx
+++ b/client/src/pages/patients/patient-details/components/Preferences.jsx
@@ -1,7 +1,7 @@
 import PropTypes from 'prop-types';
 import { Paper, Text } from '@mantine/core';
 import classes from '../PatientDetails.module.css';
-
+import { humanize } from 'inflection';
 const preferencesProps = {
   codeStatus: PropTypes.string,
   hospital: PropTypes.object,
@@ -20,9 +20,9 @@ export default function Preferences({ codeStatus, hospital }) {
       <Paper shadow="xs" p="md" radius="md" withBorder>
         <section>
           <Text className={classes.boldText}>Code status</Text>
-          <Text>{codeStatus || 'Not provided'}</Text>
+          <Text>{codeStatus ? humanize(codeStatus) : 'Not provided'}</Text>
           <Text className={classes.boldText}>Hospital</Text>
-          <Text>{hospital?.name}</Text>
+          <Text>{hospital ? hospital.name : 'Not provided'}</Text>
         </section>
       </Paper>
     </section>