Hide menu item toggle button if there are no submenu items

Pass undefined to MenuItem to hide the submenu and its toggle button.

src/sidebar/components/group-list-item.js

@@ -83,7 +83,7 @@ function GroupListItem({
       isDisabled={!isSelectable}
       isExpanded={hasActionMenu ? isExpanded : false}
       isSelected={isSelected}
-      isSubmenuVisible={isExpanded}
+      isSubmenuVisible={hasActionMenu ? isExpanded : undefined}
       label={group.name}
       onClick={isSelectable ? focusGroup : toggleSubmenu}
       onToggleSubmenu={toggleSubmenu}

src/sidebar/components/test/group-list-item-test.js

@@ -169,11 +169,13 @@ describe('GroupListItem', () => {
 
   it('expands submenu if `isExpanded` is `true`', () => {
     const wrapper = createGroupListItem(fakeGroup, { isExpanded: true });
+    assert.isTrue(wrapper.find('MenuItem').prop('isSubmenuVisible'));
     assert.isTrue(wrapper.find('MenuItem').first().prop('isExpanded'));
   });
 
   it('collapses submenu if `isExpanded` is `false`', () => {
     const wrapper = createGroupListItem(fakeGroup, { isExpanded: false });
+    assert.isFalse(wrapper.find('MenuItem').prop('isSubmenuVisible'));
     assert.isFalse(wrapper.find('MenuItem').first().prop('isExpanded'));
   });
 
@@ -197,12 +199,18 @@ describe('GroupListItem', () => {
     assert.calledWith(onExpand, false);
   });
 
+  [true, false].forEach(isExpanded => {
     it('does not show submenu toggle if there are no available actions', () => {
       fakeGroup.links.html = null;
       fakeGroup.type = 'open';
       fakeGroup.canLeave = false;
-    const wrapper = createGroupListItem(fakeGroup);
-    assert.isFalse(wrapper.find('MenuItem').prop('isExpanded'));
+      // isExpanded value should not matter
+      const wrapper = createGroupListItem(fakeGroup, { isExpanded });
+      assert.equal(
+        wrapper.find('MenuItem').prop('isSubmenuVisible'),
+        undefined
+      );
+    });
   });
 
   function getSubmenu(wrapper) {