fix(components): this should fix sentry error related to freshly updated Code block (#142)

Added optional chaining in a few places, set up prop types for WithCopyButton, added prop-types as a project dep (not sure why we haven't been having this one yet)

Author: Kirill Bolotsky

package.json

@@ -56,6 +56,7 @@
     "gatsby-transformer-sharp": "^2.5.17",
     "node-sass": "^4.14.1",
     "prism-react-renderer": "^1.1.1",
+    "prop-types": "^15.7.2",
     "qs": "^6.9.1",
     "react": "^16.10.2",
     "react-clipboard.js": "^2.0.16",

src/components/shared/code/code.js

@@ -57,11 +57,11 @@ const Code = ({ children, showLineNumbers, showHeightToggler }) => {
   }
 
   return (
-    <WithCopyButton dataToCopy={children.props.children}>
+    <WithCopyButton dataToCopy={children.props?.children}>
       <Highlight
         {...defaultProps}
-        code={children.props.children}
-        language={getLanguageDeclaration(children?.props?.className)}
+        code={children.props?.children}
+        language={getLanguageDeclaration(children.props?.className)}
       >
         {({ className, tokens, getLineProps, getTokenProps }) => (
           <pre

src/components/shared/with-copy-button/with-copy-button.view.js

@@ -1,4 +1,5 @@
 import classNames from 'classnames';
+import PropTypes from 'prop-types';
 import React from 'react';
 import Clipboard from 'react-clipboard.js';
 
@@ -28,3 +29,16 @@ export const WithCopyButton = ({
     </div>
   );
 };
+
+WithCopyButton.propTypes = {
+  children: PropTypes.node.isRequired,
+  dataToCopy: PropTypes.string,
+  wrapperLabel: PropTypes.string,
+  copyButtonLabel: PropTypes.string,
+};
+
+WithCopyButton.defaultProps = {
+  dataToCopy: '',
+  wrapperLabel: '',
+  copyButtonLabel: '',
+};