    <table listing-table class="listing-ct projects-listing">
        <thead>
            <tr>
                <th translate>Member of</th>
                <th translate>Role</th>
                <th></th>
            </tr>
        </thead>
        <tbody ng-repeat="member in getProjectsWithMember(projects(), user().metadata.name) track by member.metadata.name"
            data-id="{{ member.metadata.name }}">
            <tr ng-if="hasRegistryRole(user().metadata.name, member)" class="listing-ct-item">
                <td ng-click="listing.activate('/projects/' + member.metadata.name)">
                    <div>
                    <i class="user-page-icons pficon pficon-project"></i>
                    {{ member.metadata.name }}
                    </div>
                </td>
                <td>                
                    <div ng-if='member.kind == "Project"' class="btn-group bootstrap-select namespace-filter" dropdown>
                        <button class="btn btn-default dropdown-toggle" type="button" dropdown-toggle>
                            <span class="pull-left">
                                <span ng-if="isRoles(user(), member)">
                                    {{ getRegistryRoles(user(), member).join() }}
                                </span>
                            </span>
                            <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu">
                            <li ng-repeat="roleMp in getRegistryRolesMap() track by roleMp.displayRole"
                                ng-class="{ checked: isRegistryRole(user(), roleMp.displayRole, member) }">
                                <a ng-click="changeRole(user(), roleMp, getRegistryRoles(user(), member), member)" 
                                    value="{{ roleMp.displayRole }}">
                                    {{ roleMp.displayRole }}
                                </a>
                            </li>
                        </ul>
                    </div>
                </td>
                <td><a class="pull-right close-icon" ng-click="removeMemberFromParent(user(), member)">
                        <i translate class=" pficon-close"></i>
                    </a>
                </td>
            </tr>
        </tbody>
        <tbody ng-repeat="member in getGroupsWithMember(groups(), user().metadata.name) track by member.metadata.name" 
            data-id="{{ member.metadata.name }}">
            <tr class="listing-ct-item">
                <td ng-click="listing.activate('/groups/' + member.metadata.name)">
                    <div>
                    <i class="pficon pficon-users"></i>
                    {{ member.metadata.name }}
                    </div>
                </td>
                <td>
                </td>
                <td><a class="pull-right close-icon" ng-click="removeMemberFromParent(user(), member)">
                        <i translate class=" pficon-close"></i>
                    </a>
                </td>
            </tr>
        </tbody>
        <thead>
            <tr>
                <td colspan="3">
                    <a class="pull-left" ng-click="addMemberToParent(user())">
                        <i translate class="pficon pficon-add-circle-o"></i>
                        <span translate>Add Membership</span>
                    </a>
                </td>
            </tr>
        </thead>
    </table>
