Prevent rendering separator on last help topic item

WordPress · May 13, 2022 · 12fe702 · 12fe702
1 parent 61bb555
commit 12fe702
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 3 deletions.
diff --git a/packages/editor/src/components/editor-help/help-topic-row.native.js b/packages/editor/src/components/editor-help/help-topic-row.native.js
@@ -9,7 +9,7 @@ import { useNavigation } from '@react-navigation/native';
 import { TextControl, Icon } from '@wordpress/components';
 import { chevronRight } from '@wordpress/icons';
 
-const HelpTopicRow = ( { label, icon, screenName } ) => {
+const HelpTopicRow = ( { label, icon, screenName, isLastItem } ) => {
 	const navigation = useNavigation();
 
 	const openSubSheet = () => {
@@ -18,7 +18,7 @@ const HelpTopicRow = ( { label, icon, screenName } ) => {
 
 	return (
 		<TextControl
-			separatorType="leftMargin"
+			separatorType={ isLastItem ? 'none' : 'leftMargin' }
 			customActionButton
 			leftAlign
 			onPress={ openSubSheet }

diff --git a/packages/editor/src/components/editor-help/index.native.js b/packages/editor/src/components/editor-help/index.native.js
@@ -125,10 +125,17 @@ function EditorHelpTopics( { close, isVisible, onClose } ) {
 												</HelpSectionTitle>
 												{ /* Print out help topics. */ }
 												{ HELP_TOPICS.map(
-													( { label, icon } ) => {
+													(
+														{ label, icon },
+														index
+													) => {
 														const labelSlug = kebabCase(
 															label
 														);
+														const isLastItem =
+															index ===
+															HELP_TOPICS.length -
+																1;
 														return (
 															<HelpTopicRow
 																key={
@@ -139,6 +146,9 @@ function EditorHelpTopics( { close, isVisible, onClose } ) {
 																screenName={
 																	labelSlug
 																}
+																isLastItem={
+																	isLastItem
+																}
 															/>
 														);
 													}