Make `AnnotationShareInfo` derive privacy within component

Stop passing value of `Annotation.state.isPrivate()` through
`AnnotationHeader` all the way to `AnnotationShareInfo` and
instead compute that within `AnnotationShareInfo` itself.

src/sidebar/components/annotation-header.js

@@ -16,7 +16,6 @@ function AnnotationHeader({
   annotation,
   isEditing,
   isHighlight,
-  isPrivate,
   onReplyCountClick,
   replyCount,
   showDocumentInfo,
@@ -60,7 +59,7 @@ function AnnotationHeader({
       </div>
 
       <div className="annotation-header__row">
-        <AnnotationShareInfo annotation={annotation} isPrivate={isPrivate} />
+        <AnnotationShareInfo annotation={annotation} />
         {!isEditing && isHighlight && (
           <div className="annotation-header__highlight">
             <SvgIcon
@@ -84,8 +83,6 @@ AnnotationHeader.propTypes = {
   isEditing: propTypes.bool,
   /* Whether the annotation is a highlight */
   isHighlight: propTypes.bool,
-  /* Whether the annotation is an "only me" (private) annotation */
-  isPrivate: propTypes.bool,
   /* Callback for when the toggle-replies element is clicked */
   onReplyCountClick: propTypes.func.isRequired,
   /* How many replies this annotation currently has */

src/sidebar/components/annotation-share-info.js

 const propTypes = require('prop-types');
 const { createElement } = require('preact');
 
-const SvgIcon = require('./svg-icon');
-
+const { withServices } = require('../util/service-context');
 const useStore = require('../store/use-store');
 
+const SvgIcon = require('./svg-icon');
+
 /**
  * Render information about what group an annotation is in and
  * whether it is private to the current user (only me)
  */
-function AnnotationShareInfo({ annotation, isPrivate }) {
+function AnnotationShareInfo({ annotation, permissions }) {
   const group = useStore(store => store.getGroup(annotation.group));
 
   // We may not have access to the group object beyond its ID
@@ -19,6 +20,11 @@ function AnnotationShareInfo({ annotation, isPrivate }) {
   // URL (link) returned by the API for this group. Some groups do not have links
   const linkToGroup = hasGroup && group.links && group.links.html;
 
+  const isPrivate = !permissions.isShared(
+    annotation.permissions,
+    annotation.user
+  );
+
   return (
     <div className="annotation-share-info">
       {linkToGroup && (
@@ -59,8 +65,11 @@ function AnnotationShareInfo({ annotation, isPrivate }) {
 AnnotationShareInfo.propTypes = {
   /** The current annotation object for which sharing info will be rendered */
   annotation: propTypes.object.isRequired,
-  /** Is this an "only me" (private) annotation? */
-  isPrivate: propTypes.bool.isRequired,
+
+  /** injected services */
+  permissions: propTypes.object.isRequired,
 };
 
-module.exports = AnnotationShareInfo;
+AnnotationShareInfo.injectedProps = ['permissions'];
+
+module.exports = withServices(AnnotationShareInfo);

src/sidebar/components/test/annotation-header-test.js

@@ -13,7 +13,6 @@ describe('AnnotationHeader', () => {
         annotation={fixtures.defaultAnnotation()}
         isEditing={false}
         isHighlight={false}
-        isPrivate={false}
         onReplyCountClick={sinon.stub()}
         replyCount={0}
         showDocumentInfo={false}

src/sidebar/components/test/annotation-share-info-test.js

@@ -10,12 +10,13 @@ describe('AnnotationShareInfo', () => {
   let fakeGroup;
   let fakeStore;
   let fakeGetGroup;
+  let fakePermissions;
 
   const createAnnotationShareInfo = props => {
     return mount(
       <AnnotationShareInfo
         annotation={fixtures.defaultAnnotation()}
-        isPrivate={false}
+        permissions={fakePermissions}
         {...props}
       />
     );
@@ -31,6 +32,9 @@ describe('AnnotationShareInfo', () => {
     };
     fakeGetGroup = sinon.stub().returns(fakeGroup);
     fakeStore = { getGroup: fakeGetGroup };
+    fakePermissions = {
+      isShared: sinon.stub().returns(true),
+    };
 
     AnnotationShareInfo.$imports.$mock(mockImportedComponents());
     AnnotationShareInfo.$imports.$mock({
@@ -96,15 +100,19 @@ describe('AnnotationShareInfo', () => {
 
   describe('"only you" information', () => {
     it('should not show privacy information if annotation is not private', () => {
-      const wrapper = createAnnotationShareInfo({ isPrivate: false });
+      const wrapper = createAnnotationShareInfo();
 
       const privacy = wrapper.find('.annotation-share-info__private');
 
       assert.notOk(privacy.exists());
     });
     context('private annotation', () => {
+      beforeEach(() => {
+        fakePermissions.isShared.returns(false);
+      });
+
       it('should show privacy icon', () => {
-        const wrapper = createAnnotationShareInfo({ isPrivate: true });
+        const wrapper = createAnnotationShareInfo();
 
         const privacyIcon = wrapper.find(
           '.annotation-share-info__private .annotation-share-info__icon'
@@ -114,7 +122,7 @@ describe('AnnotationShareInfo', () => {
         assert.equal(privacyIcon.prop('name'), 'lock');
       });
       it('should not show "only me" text for first-party group', () => {
-        const wrapper = createAnnotationShareInfo({ isPrivate: true });
+        const wrapper = createAnnotationShareInfo();
 
         const privacyText = wrapper.find(
           '.annotation-share-info__private-info'
@@ -124,7 +132,7 @@ describe('AnnotationShareInfo', () => {
       });
       it('should show "only me" text for annotation in third-party group', () => {
         fakeGetGroup.returns({ name: 'Some Name' });
-        const wrapper = createAnnotationShareInfo({ isPrivate: true });
+        const wrapper = createAnnotationShareInfo();
 
         const privacyText = wrapper.find(
           '.annotation-share-info__private-info'

src/sidebar/templates/annotation.html

@@ -7,7 +7,6 @@
   <annotation-header annotation="vm.annotation"
                          is-editing="vm.editing()"
                          is-highlight="vm.isHighlight()"
-                         is-private="vm.state().isPrivate"
                          on-reply-count-click="vm.onReplyCountClick()"
                          reply-count="vm.replyCount"
                          show-document-info="vm.showDocumentInfo">
@@ -41,7 +40,7 @@
     ng-if="vm.editing()"
     annotation="vm.annotation"
     on-edit-tags="vm.setTags(tags)"
-    tag-list="vm.state().tags" 
+    tag-list="vm.state().tags"
     />
   </tag-editor>