Merge pull request #673 from hypothesis/list-groups-for-logged-out-users

Show a list of groups for logged out users.

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

@@ -9,6 +9,7 @@ describe('groupList', function () {
   var $window;
 
   var GROUP_LINK = 'https://hypothes.is/groups/hdevs';
+  var PUBLIC_GROUP_LINK = 'https://hypothes.is/groups/pub';
 
   var groups;
   var fakeGroups;
@@ -53,9 +54,12 @@ describe('groupList', function () {
     groups = [{
       id: 'public',
       public: true,
+      type: 'open',
+      url: PUBLIC_GROUP_LINK,
     },{
       id: 'h-devs',
       name: 'Hypothesis Developers',
+      type: 'private',
       url: GROUP_LINK,
     }];
 
@@ -93,11 +97,12 @@ describe('groupList', function () {
   it('should render share links', function () {
     var element = createGroupList();
     var shareLinks = element.find('.share-link-container');
-    assert.equal(shareLinks.length, 1);
+    assert.equal(shareLinks.length, 2);
 
     var link = element.find('.share-link');
-    assert.equal(link.length, 1);
-    assert.equal(link[0].href, GROUP_LINK);
+    assert.equal(link.length, 2);
+    assert.equal(link[0].href, PUBLIC_GROUP_LINK);
+    assert.equal(link[1].href, GROUP_LINK);
   });
 
   it('should track metrics when a user attempts to view a groups activity', function () {

src/sidebar/templates/group-list.html

-<span ng-if="vm.auth.status === 'logged-out'"
-      ng-switch on="vm.groups.focused().public">
-  <img class="group-list-label__icon group-list-label__icon--third-party"
-    ng-src="{{ vm.thirdPartyGroupIcon }}"
-    ng-if="vm.thirdPartyGroupIcon"
-    ng-switch-when="true"><!-- nospace
-  !--><i class="group-list-label__icon h-icon-public"
-    ng-if="!vm.thirdPartyGroupIcon"
-    ng-switch-when="true"></i><!-- nospace
-  !--><i class="group-list-label__icon h-icon-group" ng-switch-default></i>
-  <span class="group-list-label__label">{{vm.groups.focused().name}}</span>
-</span>
-
 <div class="pull-right"
-     ng-if="vm.auth.status === 'logged-in'"
      dropdown
      keyboard-nav>
   <div class="dropdown-toggle"
@@ -57,25 +43,28 @@
                {{group.name}}
             </a>
           </div>
-          <div class="share-link-container" ng-click="$event.stopPropagation()" ng-if="!group.public">
+          <div class="share-link-container" ng-click="$event.stopPropagation()">
             <a class="share-link"
                href="{{group.url}}"
                target="_blank"
                ng-click="vm.viewGroupActivity()">
-              View group activity and invite others
+              View group activity
+              <span ng-if="group.type === 'private'">
+                and invite others
+              </span>
             </a>
           </div>
         </div>
         <!-- the 'Leave group' icon !-->
         <div class="group-cancel-icon-container" ng-click="$event.stopPropagation()">
           <i class="h-icon-cancel-outline btn--cancel"
-             ng-if="!group.public"
+             ng-if="group.type === 'private'"
              ng-click="vm.leaveGroup(group.id)"
              title="Leave '{{group.name}}'"></i>
         </div>
       </div>
     </li>
-    <li ng-if="!vm.isThirdPartyUser()" class="dropdown-menu__row dropdown-menu__row--unpadded new-group-btn">
+    <li ng-if="vm.auth.status === 'logged-in' && !vm.isThirdPartyUser()" class="dropdown-menu__row dropdown-menu__row--unpadded new-group-btn">
       <div class="group-item" ng-click="vm.createNewGroup()">
         <div class="group-icon-container"><i class="h-icon-add"></i></div>
         <div class="group-details">