Refactor some things using getOr

Author: Jskobos

src/components/2_molecules/BodySchema.js

@@ -9,18 +9,15 @@ import CharDisplay from "./charDisplay";
 
 export const BodySchema = props => {
   const { data } = props;
-  const requiredProperties =
-    getOr(
-      [],
-      ["requestBody", "content", "application_json", "schema", "required"],
-      data
-    ) || [];
-  const properties = getOr(
-    null,
-    ["requestBody", "content", "application_json", "schema", "properties"],
+  const schema = getOr(
+    [],
+    ["requestBody", "content", "application_json", "schema"],
     data
   );
 
+  const requiredProperties = schema.required || [];
+  const properties = schema.properties;
+
   const sortByRequired = (a, b) => {
     const r1 = requiredProperties.includes(a) ? 1 : 0;
     const r2 = requiredProperties.includes(b) ? 1 : 0;
@@ -49,13 +46,13 @@ export const BodySchema = props => {
         Object.keys(properties)
           .filter(
             v =>
-              data.requestBody.content.application_json.schema.properties[v] !==
+              properties[v] !==
               null
           )
           .sort(sortByRequired)
           .map((p, i) => {
             const b =
-              data.requestBody.content.application_json.schema.properties[p];
+              properties[p];
             return (
               b &&
               b.readOnly !== true && (
@@ -66,9 +63,8 @@ export const BodySchema = props => {
                         <b className={b.deprecated && "line-through"}>{p}</b>
                       </div>
                       <div className="leading-xs">
-                        {data.requestBody.content.application_json.schema
-                          .required &&
-                          data.requestBody.content.application_json.schema.required.map(
+                        {requiredProperties &&
+                          requiredProperties.map(
                             (req, i) => {
                               if (p === req) {
                                 return (
@@ -113,18 +109,16 @@ export const BodySchema = props => {
               )
             );
           })}
-      {data.requestBody.content.application_json &&
-        data.requestBody.content.application_json.schema &&
-        data.requestBody.content.application_json.schema.allOf &&
-        Object.keys(data.requestBody.content.application_json.schema.allOf).map(
+      {schema.allOf &&
+        Object.keys(schema.allOf).map(
           a => {
-            const s = data.requestBody.content.application_json.schema.allOf[a];
+            const s = schema.allOf[a];
             return (
               s.properties &&
               Object.keys(s.properties)
                 .filter(
                   v =>
-                    data.requestBody.content.application_json.schema.allOf[
+                    schema.allOf[
                       v
                     ] !== null
                 )
@@ -142,8 +136,8 @@ export const BodySchema = props => {
                               <b>{p}</b>
                             </div>
                             <div className="leading-xs">
-                              {s.required &&
-                                s.required.map((req, i) => {
+                              {s.requiredProperties &&
+                                s.requiredProperties.map((req, i) => {
                                   if (p === req) {
                                     return (
                                       <span
@@ -158,9 +152,8 @@ export const BodySchema = props => {
                                 })}
                             </div>
                             <div className="leading-xs">
-                              {data.requestBody.content.application_json.schema
-                                .required &&
-                                data.requestBody.content.application_json.schema.required.map(
+                              {requiredProperties &&
+                                requiredProperties.map(
                                   (req, i) => {
                                     if (p === req) {
                                       return (

src/components/2_molecules/ResponseSampleBody.js

@@ -1,22 +1,21 @@
+import { getOr } from "lodash/fp";
 import React from "react";
 import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
 import { atomDark } from "react-syntax-highlighter/dist/esm/styles/prism";
 
 export const ResponseSampleBody = props => {
   const { context, response } = props;
+  const properties = getOr([], ['content', 'application_json', 'schema', 'properties'], context);
 
   const sampleSource = `
       {
-      ${context.content &&
-        context.content.application_json &&
-        context.content.application_json.schema &&
-        context.content.application_json.schema.properties &&
-        Object.keys(context.content.application_json.schema.properties)
+      ${properties &&
+        Object.keys(properties)
           .filter(
-            v => context.content.application_json.schema.properties[v] !== null
+            v => properties[v] !== null
           )
           .map(p => {
-            const l = context.content.application_json.schema.properties[p];
+            const l = properties[p];
             return (
               l &&
               (l.type !== "array" && l.type !== "object" && p !== "errors"