Commit 0a7f935f authored by Robert Knight's avatar Robert Knight

Rename AnnotationShareInfo => AnnotationGroupInfo

Remove the annotation privacy information from this component, since that status
is already provided by the lock icon next to the username, and update the
component to reflect its current purpose.
parent a432922f
...@@ -3,19 +3,17 @@ import classnames from 'classnames'; ...@@ -3,19 +3,17 @@ import classnames from 'classnames';
import type { Group } from '../../../types/api'; import type { Group } from '../../../types/api';
export type AnnotationShareInfoProps = { export type AnnotationGroupInfoProps = {
/** Group to which the annotation belongs */ /** Group to which the annotation belongs */
group: Group; group: Group;
isPrivate: boolean;
}; };
/** /**
* Render information about what group an annotation is in and * Render information about what group an annotation is in.
* whether it is private to the current user (only me)
* *
* @param {AnnotationShareInfoProps} props * @param {AnnotationGroupInfoProps} props
*/ */
function AnnotationShareInfo({ group, isPrivate }: AnnotationShareInfoProps) { function AnnotationGroupInfo({ group }: AnnotationGroupInfoProps) {
// Only show the name of the group and link to it if there is a // Only show the name of the group and link to it if there is a
// URL (link) returned by the API for this group. Some groups do not have links // URL (link) returned by the API for this group. Some groups do not have links
const linkToGroup = group?.links.html; const linkToGroup = group?.links.html;
...@@ -44,13 +42,8 @@ function AnnotationShareInfo({ group, isPrivate }: AnnotationShareInfoProps) { ...@@ -44,13 +42,8 @@ function AnnotationShareInfo({ group, isPrivate }: AnnotationShareInfoProps) {
</div> </div>
</Link> </Link>
)} )}
{isPrivate && !linkToGroup && (
<div className="text-color-text-light" data-testid="private-info">
Only me
</div>
)}
</> </>
); );
} }
export default AnnotationShareInfo; export default AnnotationGroupInfo;
...@@ -22,7 +22,7 @@ import { isPrivate } from '../../helpers/permissions'; ...@@ -22,7 +22,7 @@ import { isPrivate } from '../../helpers/permissions';
import { withServices } from '../../service-context'; import { withServices } from '../../service-context';
import { useSidebarStore } from '../../store'; import { useSidebarStore } from '../../store';
import AnnotationDocumentInfo from './AnnotationDocumentInfo'; import AnnotationDocumentInfo from './AnnotationDocumentInfo';
import AnnotationShareInfo from './AnnotationShareInfo'; import AnnotationGroupInfo from './AnnotationGroupInfo';
import AnnotationTimestamps from './AnnotationTimestamps'; import AnnotationTimestamps from './AnnotationTimestamps';
import AnnotationUser from './AnnotationUser'; import AnnotationUser from './AnnotationUser';
...@@ -149,12 +149,7 @@ function AnnotationHeader({ ...@@ -149,12 +149,7 @@ function AnnotationHeader({
className="flex gap-x-1 items-baseline flex-wrap-reverse" className="flex gap-x-1 items-baseline flex-wrap-reverse"
data-testid="extended-header-info" data-testid="extended-header-info"
> >
{group && ( {group && <AnnotationGroupInfo group={group} />}
<AnnotationShareInfo
group={group}
isPrivate={isPrivate(annotation.permissions)}
/>
)}
{!isEditing && isHighlight(annotation) && ( {!isEditing && isHighlight(annotation) && (
<HighlightIcon <HighlightIcon
title="This is a highlight. Click 'edit' to add a note or tag." title="This is a highlight. Click 'edit' to add a note or tag."
......
...@@ -4,13 +4,13 @@ import { ...@@ -4,13 +4,13 @@ import {
} from '@hypothesis/frontend-testing'; } from '@hypothesis/frontend-testing';
import { mount } from 'enzyme'; import { mount } from 'enzyme';
import AnnotationShareInfo, { $imports } from '../AnnotationShareInfo'; import AnnotationGroupInfo, { $imports } from '../AnnotationGroupInfo';
describe('AnnotationShareInfo', () => { describe('AnnotationGroupInfo', () => {
let fakeGroup; let fakeGroup;
const createAnnotationShareInfo = props => { const createAnnotationGroupInfo = props => {
return mount(<AnnotationShareInfo group={fakeGroup} {...props} />); return mount(<AnnotationGroupInfo group={fakeGroup} {...props} />);
}; };
beforeEach(() => { beforeEach(() => {
...@@ -31,7 +31,7 @@ describe('AnnotationShareInfo', () => { ...@@ -31,7 +31,7 @@ describe('AnnotationShareInfo', () => {
describe('group link', () => { describe('group link', () => {
it('should show a link to the group for extant, first-party groups', () => { it('should show a link to the group for extant, first-party groups', () => {
const wrapper = createAnnotationShareInfo(); const wrapper = createAnnotationGroupInfo();
const groupLink = wrapper.find('a'); const groupLink = wrapper.find('a');
...@@ -40,57 +40,33 @@ describe('AnnotationShareInfo', () => { ...@@ -40,57 +40,33 @@ describe('AnnotationShareInfo', () => {
}); });
it('should display a group icon for private and restricted groups', () => { it('should display a group icon for private and restricted groups', () => {
const wrapper = createAnnotationShareInfo(); const wrapper = createAnnotationGroupInfo();
assert.isTrue(wrapper.find('GroupsIcon').exists()); assert.isTrue(wrapper.find('GroupsIcon').exists());
}); });
it('should display a public/world icon for open groups', () => { it('should display a public/world icon for open groups', () => {
fakeGroup.type = 'open'; fakeGroup.type = 'open';
const wrapper = createAnnotationShareInfo(); const wrapper = createAnnotationGroupInfo();
assert.isTrue(wrapper.find('GlobeIcon').exists()); assert.isTrue(wrapper.find('GlobeIcon').exists());
}); });
it('should not show a link to third-party groups', () => { it('should not show a link to third-party groups', () => {
// Third-party groups have no `html` link // Third-party groups have no `html` link
const wrapper = createAnnotationShareInfo({ const wrapper = createAnnotationGroupInfo({
group: { name: 'A Group', links: {} }, group: { name: 'A Group', links: {} },
}); });
const groupLink = wrapper.find('.AnnotationShareInfo__group'); const groupLink = wrapper.find('.AnnotationGroupInfo__group');
assert.notOk(groupLink.exists()); assert.notOk(groupLink.exists());
}); });
}); });
describe('"only you" information', () => {
it('should not show privacy information if annotation is not private', () => {
const wrapper = createAnnotationShareInfo();
const privacy = wrapper.find('.AnnotationShareInfo__private');
assert.notOk(privacy.exists());
});
context('private annotation', () => {
it('should show "only me" text for annotation in third-party group', () => {
const wrapper = createAnnotationShareInfo({
group: { name: 'Some Name', links: {} },
isPrivate: true,
});
const privacyText = wrapper.find('[data-testid="private-info"]');
assert.isOk(privacyText.exists());
assert.equal(privacyText.text(), 'Only me');
});
});
});
it( it(
'should pass a11y checks', 'should pass a11y checks',
checkAccessibility({ checkAccessibility({
content: () => createAnnotationShareInfo(), content: () => createAnnotationGroupInfo(),
}), }),
); );
}); });
...@@ -339,7 +339,7 @@ describe('AnnotationHeader', () => { ...@@ -339,7 +339,7 @@ describe('AnnotationHeader', () => {
fakeStore.route.returns(route); fakeStore.route.returns(route);
const wrapper = createAnnotationHeader(); const wrapper = createAnnotationHeader();
assert.equal( assert.equal(
wrapper.find('AnnotationShareInfo').exists(), wrapper.find('AnnotationGroupInfo').exists(),
groupVisible, groupVisible,
); );
}); });
...@@ -350,7 +350,7 @@ describe('AnnotationHeader', () => { ...@@ -350,7 +350,7 @@ describe('AnnotationHeader', () => {
fakeStore.getGroup.returns(undefined); fakeStore.getGroup.returns(undefined);
const wrapper = createAnnotationHeader(); const wrapper = createAnnotationHeader();
assert.isFalse(wrapper.find('AnnotationShareInfo').exists()); assert.isFalse(wrapper.find('AnnotationGroupInfo').exists());
}); });
}); });
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment