Merge pull request #288 from pantheon-systems/users/kestub/HandleNoRe…

…actComponent PCC-1473 Gracefully handle implementation edge case where no react component was provided in component map
pantheon-systems · Jul 15, 2024 · 8208018 · 8208018
2 parents 3b90145 + e7d5252
commit 8208018
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 0 deletions.
diff --git a/.changeset/ninety-ladybugs-tell.md b/.changeset/ninety-ladybugs-tell.md
@@ -0,0 +1,5 @@
+---
+"@pantheon-systems/pcc-react-sdk": patch
+---
+
+Gracefully handle implementation edge case where a smart component map was provided to the ArticlerRenderer but without defining the react components that should be used.
diff --git a/packages/react-sdk/src/components/ArticleRenderer/Markdown.tsx b/packages/react-sdk/src/components/ArticleRenderer/Markdown.tsx
@@ -41,6 +41,15 @@ const MarkdownRenderer = ({
             const { reactComponent: Component } = smartComponentMap[type];
             const decodedAttrs = isomorphicBase64Decode(attrs);
 
+            if (!Component) {
+              return (
+                <div>
+                  Error: Cannot render {type} because it was provided without a
+                  reactComponent property.
+                </div>
+              );
+            }
+
             return (
               <div>
                 {disableDefaultErrorBoundaries ? (

diff --git a/...ArticleRenderer/PantheonTreeV2Renderer.ts → ...rticleRenderer/PantheonTreeV2Renderer.tsx b/...ArticleRenderer/PantheonTreeV2Renderer.ts → ...rticleRenderer/PantheonTreeV2Renderer.tsx
@@ -45,6 +45,15 @@ const PantheonTreeRenderer = ({
     const component = smartComponentMap?.[componentType];
 
     if (component) {
+      if (!component.reactComponent) {
+        return (
+          <div>
+            Error: Cannot render {componentType} because it was provided without
+            a reactComponent property.
+          </div>
+        );
+      }
+
       return disableDefaultErrorBoundaries
         ? React.createElement(
             component.reactComponent,