From 68dc9c16ce9b03d9086705c175f2188a23ecc7f2 Mon Sep 17 00:00:00 2001
From: Patrick Hessman <patrick.hessman@1up.health>
Date: Wed, 12 Apr 2023 13:31:44 -0400
Subject: [PATCH 1/2] converted fhirResource and ErrorBoundary to functional
 components, tried using try catch approach to fix ErrorBoundary

---
 CHANGELOG.md                                  |  6 ++
 package-lock.json                             |  4 +-
 package.json                                  |  2 +-
 .../containers/FhirResource/FhirResource.js   | 69 +++++++++----------
 4 files changed, 42 insertions(+), 39 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 9302b666..9e8a5a9c 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,12 @@
 
 Changelog format is loosely based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/). This project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## 1.1.0
+
+### Changed
+
+- FhirResource and ErrorBoundary to functional components
+
 ## 1.0.0
 
 ### Added
diff --git a/package-lock.json b/package-lock.json
index 1cd70476..b34ffa08 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "fhir-react",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "fhir-react",
-      "version": "1.0.0",
+      "version": "1.1.0",
       "license": "CC-BY-NC-SA-4.0",
       "dependencies": {
         "@nivo/core": "^0.78.0",
diff --git a/package.json b/package.json
index a3c12b62..04ec08fd 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "fhir-react",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "React component library for displaying FHIR Resources ",
   "main": "build/index.js",
   "peerDependencies": {
diff --git a/src/components/containers/FhirResource/FhirResource.js b/src/components/containers/FhirResource/FhirResource.js
index 2699da85..23edc977 100644
--- a/src/components/containers/FhirResource/FhirResource.js
+++ b/src/components/containers/FhirResource/FhirResource.js
@@ -1,58 +1,55 @@
-import React from 'react';
+import React, { useState } from 'react';
 import * as FhirResourceTypes from '../../supportedFhirResourceList';
 import ResourceContainer from '../ResourceContainer';
-class ErrorBoundary extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = { hasError: false, error: null };
-  }
 
-  componentDidCatch(error, info) {
-    // Display fallback UI
-    this.setState({ hasError: true, error });
-    // You can also log the error to an error reporting service
-    // logErrorToMyService(error, info);
-    console.error(
-      'An error occured when trying to render a FHIR Component:',
-      error,
-    );
-  }
+const ErrorBoundary = props => {
+  const [hasError, setHasError] = useState(false);
+  const [error, setError] = useState();
 
-  render() {
-    if (this.state.hasError) {
+  const errCheck = () => {
+    if (hasError) {
       // You can render any custom fallback UI
       return (
-        <ResourceContainer {...this.props}>
-          <FhirResourceTypes.Generic {...this.props} />
+        <ResourceContainer>
+          <FhirResourceTypes.Generic />
         </ResourceContainer>
       );
     }
-    return this.props.children;
+    return props.children;
+  };
+
+  try {
+    const content = errCheck();
+    return content;
+  } catch (err) {
+    setError(err);
+    setHasError(true);
+    console.error(
+      'An error occured when trying to render a FHIR Component:',
+      error,
+    );
+    const content = errCheck();
+    return content;
   }
-}
+};
 
-class FhirResource extends React.Component {
-  renderSwitch() {
-    const { resourceType } = this.props.fhirResource || {};
+export const FhirResource = props => {
+  const renderSwitch = () => {
+    const { resourceType } = props.fhirResource || {};
     switch (resourceType) {
       case 'Binary':
-        return <FhirResourceTypes.Binary {...this.props} />;
+        return <FhirResourceTypes.Binary {...props} />;
       default:
         const FhirComponent =
           FhirResourceTypes[resourceType] !== undefined
             ? FhirResourceTypes[resourceType]
             : FhirResourceTypes.Generic;
         return (
-          <ResourceContainer {...this.props}>
-            <FhirComponent {...this.props} />
+          <ResourceContainer {...props}>
+            <FhirComponent {...props} />
           </ResourceContainer>
         );
     }
-  }
-
-  render() {
-    return <ErrorBoundary>{this.renderSwitch()}</ErrorBoundary>;
-  }
-}
-
-export default FhirResource;
+  };
+  return <ErrorBoundary>{renderSwitch()}</ErrorBoundary>;
+};

From 55424be4dab582c130fcb4976bea295814f32425 Mon Sep 17 00:00:00 2001
From: Patrick Hessman <patrick.hessman@1up.health>
Date: Wed, 19 Apr 2023 14:50:18 -0400
Subject: [PATCH 2/2] Restored FhirResource to previous state so to not cause
 reconciliation issues with PR 401

---
 CHANGELOG.md                                  |  2 +-
 .../containers/FhirResource/FhirResource.js   | 23 +++++++++++--------
 2 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 9e8a5a9c..687cf5c5 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -6,7 +6,7 @@ Changelog format is loosely based on [Keep a Changelog](https://keepachangelog.c
 
 ### Changed
 
-- FhirResource and ErrorBoundary to functional components
+- ErrorBoundary to functional component
 
 ## 1.0.0
 
diff --git a/src/components/containers/FhirResource/FhirResource.js b/src/components/containers/FhirResource/FhirResource.js
index 23edc977..dd93dc5c 100644
--- a/src/components/containers/FhirResource/FhirResource.js
+++ b/src/components/containers/FhirResource/FhirResource.js
@@ -33,23 +33,28 @@ const ErrorBoundary = props => {
   }
 };
 
-export const FhirResource = props => {
-  const renderSwitch = () => {
-    const { resourceType } = props.fhirResource || {};
+class FhirResource extends React.Component {
+  renderSwitch() {
+    const { resourceType } = this.props.fhirResource || {};
     switch (resourceType) {
       case 'Binary':
-        return <FhirResourceTypes.Binary {...props} />;
+        return <FhirResourceTypes.Binary {...this.props} />;
       default:
         const FhirComponent =
           FhirResourceTypes[resourceType] !== undefined
             ? FhirResourceTypes[resourceType]
             : FhirResourceTypes.Generic;
         return (
-          <ResourceContainer {...props}>
-            <FhirComponent {...props} />
+          <ResourceContainer {...this.props}>
+            <FhirComponent {...this.props} />
           </ResourceContainer>
         );
     }
-  };
-  return <ErrorBoundary>{renderSwitch()}</ErrorBoundary>;
-};
+  }
+
+  render() {
+    return <ErrorBoundary>{this.renderSwitch()}</ErrorBoundary>;
+  }
+}
+
+export default FhirResource;