Fix: Do not render an empty props table for TypeScript projects (#1158)

Author: Teddy Bradford

src/rsg-components/Pathline/PathlineRenderer.js

@@ -10,7 +10,7 @@ export const styles = ({ space, fontFamily, fontSize, color }) => ({
 		fontFamily: fontFamily.monospace,
 		fontSize: fontSize.small,
 		color: color.light,
-		wordBreak: 'break-all'
+		wordBreak: 'break-all',
 	},
 	copyButton: {
 		marginLeft: space[0],

src/rsg-components/Usage/Usage.js

@@ -2,10 +2,11 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import Props from 'rsg-components/Props';
 import Methods from 'rsg-components/Methods';
+import isEmpty from 'lodash/isEmpty';
 
 export default function Usage({ props: { props, methods } }) {
-	const propsNode = props && <Props props={props} />;
-	const methodsNode = methods && methods.length > 0 && <Methods methods={methods} />;
+	const propsNode = !isEmpty(props) && <Props props={props} />;
+	const methodsNode = !isEmpty(methods) && <Methods methods={methods} />;
 
 	if (!propsNode && !methodsNode) {
 		return null;

src/rsg-components/slots/UsageTabButton.js

@@ -1,10 +1,11 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import TabButton from 'rsg-components/TabButton';
+import isEmpty from 'lodash/isEmpty';
 
 const UsageTabButton = props => {
 	const component = props.props;
-	const showButton = component.props || (component.methods && component.methods.length > 0);
+	const showButton = !isEmpty(component.props) || !isEmpty(component.methods);
 	return showButton ? <TabButton {...props}>Props & methods</TabButton> : null;
 };