Skip to content

C
coopwire-hypothesis
Commit 91cc9775 authored by Alejandro Celaya's avatar Alejandro Celaya Committed by Robert Knight
Browse files
Options

Remove usage of import/export feature flags

parent b3a2f138
Hide whitespace changes
Inline Side-by-side
Showing with 76 additions and 167 deletions
src/sidebar/components/HypothesisApp.tsx
View file @ 91cc9775
......@@ -65,10 +65,6 @@ function HypothesisApp({
}, [isSidebar, profile, settings, store]);
const isThirdParty = isThirdPartyService(settings);
const exportAnnotations = store.isFeatureEnabled('export_annotations');
const importAnnotations = store.isFeatureEnabled('import_annotations');
const showShareButton =
!isThirdParty || exportAnnotations || importAnnotations;
const searchPanelEnabled = store.isFeatureEnabled('search_panel');
......@@ -165,20 +161,13 @@ function HypothesisApp({
onSignUp={signUp}
onLogout={logout}
isSidebar={isSidebar}
showShareButton={showShareButton}
/>
)}
<div className="container">
<ToastMessages />
<HelpPanel />
{searchPanelEnabled && <SearchPanel />}
{showShareButton && (
<ShareDialog
shareTab={!isThirdParty}
exportTab={exportAnnotations}
importTab={importAnnotations}
/>
)}
<ShareDialog shareTab={!isThirdParty} />
{route && (
<main>
......
src/sidebar/components/ShareDialog/ShareDialog.tsx
View file @ 91cc9775
......@@ -13,10 +13,6 @@ import ShareAnnotations from './ShareAnnotations';
export type ShareDialogProps = {
/** If true, the share tab will be rendered. Defaults to false */
shareTab?: boolean;
/** If true, the export tab will be rendered. Defaults to false */
exportTab?: boolean;
/** If true, the import tab will be rendered. Defaults to false */
importTab?: boolean;
};
/**
......@@ -24,99 +20,85 @@ export type ShareDialogProps = {
* - If provided tabs include `export` or `import`, will show a tabbed interface
* - Else, shows a single "Share annotations" interface
*/
export default function ShareDialog({
shareTab,
exportTab,
importTab,
}: ShareDialogProps) {
export default function ShareDialog({ shareTab }: ShareDialogProps) {
const store = useSidebarStore();
const focusedGroup = store.focusedGroup();
const groupName = (focusedGroup && focusedGroup.name) || '...';
const panelTitle = `Share Annotations in ${groupName}`;
const tabbedDialog = exportTab || importTab;
// Determine initial selected tab, based on the first tab that will be displayed
const initialTab = shareTab ? 'share' : exportTab ? 'export' : 'import';
const initialTab = shareTab ? 'share' : 'export';
const [selectedTab, setSelectedTab] = useState<'share' | 'export' | 'import'>(
initialTab,
);
const isFirstTabSelected = tabbedDialog && selectedTab === initialTab;
const isFirstTabSelected = selectedTab === initialTab;
return (
<SidebarPanel
title={panelTitle}
panelName="shareGroupAnnotations"
variant={tabbedDialog ? 'custom' : 'panel'}
variant="custom"
>
{tabbedDialog && (
<>
<TabHeader>
{shareTab && (
<Tab
id="share-panel-tab"
aria-controls="share-panel"
variant="tab"
selected={selectedTab === 'share'}
onClick={() => setSelectedTab('share')}
textContent="Share"
>
Share
</Tab>
)}
{exportTab && (
<Tab
id="export-panel-tab"
aria-controls="export-panel"
variant="tab"
selected={selectedTab === 'export'}
onClick={() => setSelectedTab('export')}
textContent="Export"
>
Export
</Tab>
)}
{importTab && (
<Tab
id="import-panel-tab"
aria-controls="import-panel"
variant="tab"
selected={selectedTab === 'import'}
onClick={() => setSelectedTab('import')}
textContent="Import"
>
Import
</Tab>
)}
</TabHeader>
<Card classes={classnames({ 'rounded-tl-none': isFirstTabSelected })}>
<TabPanel
id="share-panel"
active={selectedTab === 'share'}
aria-labelledby="share-panel-tab"
title={panelTitle}
>
<ShareAnnotations />
</TabPanel>
<TabPanel
id="export-panel"
active={selectedTab === 'export'}
aria-labelledby="export-panel-tab"
title={`Export from ${groupName}`}
>
<ExportAnnotations />
</TabPanel>
<TabPanel
id="import-panel"
active={selectedTab === 'import'}
aria-labelledby="import-panel-tab"
title={`Import into ${groupName}`}
>
<ImportAnnotations />
</TabPanel>
</Card>
</>
)}
{shareTab && !tabbedDialog && <ShareAnnotations />}
<TabHeader>
{shareTab && (
<Tab
id="share-panel-tab"
aria-controls="share-panel"
variant="tab"
selected={selectedTab === 'share'}
onClick={() => setSelectedTab('share')}
textContent="Share"
>
Share
</Tab>
)}
<Tab
id="export-panel-tab"
aria-controls="export-panel"
variant="tab"
selected={selectedTab === 'export'}
onClick={() => setSelectedTab('export')}
textContent="Export"
>
Export
</Tab>
<Tab
id="import-panel-tab"
aria-controls="import-panel"
variant="tab"
selected={selectedTab === 'import'}
onClick={() => setSelectedTab('import')}
textContent="Import"
>
Import
</Tab>
</TabHeader>
<Card classes={classnames({ 'rounded-tl-none': isFirstTabSelected })}>
<TabPanel
id="share-panel"
active={selectedTab === 'share'}
aria-labelledby="share-panel-tab"
title={panelTitle}
>
<ShareAnnotations />
</TabPanel>
<TabPanel
id="export-panel"
active={selectedTab === 'export'}
aria-labelledby="export-panel-tab"
title={`Export from ${groupName}`}
>
<ExportAnnotations />
</TabPanel>
<TabPanel
id="import-panel"
active={selectedTab === 'import'}
aria-labelledby="import-panel-tab"
title={`Import into ${groupName}`}
>
<ImportAnnotations />
</TabPanel>
</Card>
</SidebarPanel>
);
}
src/sidebar/components/ShareDialog/test/ShareDialog-test.js
View file @ 91cc9775
......@@ -18,7 +18,7 @@ describe('ShareDialog', () => {
};
const createComponent = (props = {}) =>
mount(<ShareDialog shareTab exportTab importTab {...props} />);
mount(<ShareDialog shareTab {...props} />);
beforeEach(() => {
fakeStore = {
......@@ -73,25 +73,6 @@ describe('ShareDialog', () => {
return wrapper.find('TabPanel').filter({ active: true });
}
it('does not render a tabbed dialog if only share tab is provided', () => {
const wrapper = createComponent({ exportTab: false, importTab: false });
assert.isFalse(wrapper.find('TabHeader').exists());
});
[{ importTab: false }, { exportTab: false }, {}].forEach(props => {
it(`renders a tabbed dialog when more than one tab is provided`, () => {
const wrapper = createComponent(props);
assert.isTrue(wrapper.find('TabHeader').exists());
assert.isTrue(
wrapper.find(Tab).filter('[aria-controls="share-panel"]').props()
.selected,
);
assert.isTrue(wrapper.find('TabPanel[id="share-panel"]').props().active);
});
});
it('shows correct tab panel when each tab is clicked', () => {
const wrapper = createComponent();
......@@ -111,22 +92,11 @@ describe('ShareDialog', () => {
assert.equal(activeTabPanel(wrapper).props().id, 'share-panel');
});
it('renders empty if no tabs should be displayed', () => {
const wrapper = createComponent({
shareTab: false,
exportTab: false,
importTab: false,
});
assert.isFalse(wrapper.exists('TabHeader'));
assert.isFalse(wrapper.exists('ShareAnnotations'));
});
describe('a11y', () => {
it(
'should pass a11y checks',
checkAccessibility({
content: () => <ShareDialog shareTab exportTab importTab />,
content: () => <ShareDialog shareTab />,
}),
);
});
......
src/sidebar/components/TopBar.tsx
View file @ 91cc9775
......@@ -17,8 +17,6 @@ import SearchIconButton from './search/SearchIconButton';
import StreamSearchInput from './search/StreamSearchInput';
export type TopBarProps = {
showShareButton: boolean;
/** Flag indicating whether the app is in a sidebar context */
isSidebar: boolean;
......@@ -47,7 +45,6 @@ function TopBar({
onSignUp,
frameSync,
settings,
showShareButton,
}: TopBarProps) {
const loginLinkStyle = applyTheme(['accentColor'], settings);
......@@ -108,17 +105,15 @@ function TopBar({
)}
{searchPanelEnabled && <SearchIconButton />}
<SortMenu />
{showShareButton && (
<PressableIconButton
icon={ShareIcon}
expanded={isAnnotationsPanelOpen}
pressed={isAnnotationsPanelOpen}
onClick={toggleSharePanel}
size="xs"
title="Share annotations on this page"
data-testid="share-icon-button"
/>
)}
<PressableIconButton
icon={ShareIcon}
expanded={isAnnotationsPanelOpen}
pressed={isAnnotationsPanelOpen}
onClick={toggleSharePanel}
size="xs"
title="Share annotations on this page"
data-testid="share-icon-button"
/>
</>
)}
<PressableIconButton
......
src/sidebar/components/test/HypothesisApp-test.js
View file @ 91cc9775
......@@ -408,23 +408,6 @@ describe('HypothesisApp', () => {
});
});
context('when there are no sharing tabs to show', () => {
beforeEach(() => {
fakeStore.isFeatureEnabled.returns(false);
fakeIsThirdPartyService.returns(true);
});
it('does not render ShareDialog', () => {
const wrapper = createComponent();
assert.isFalse(wrapper.exists('ShareDialog'));
});
it('disables share button in TopBar', () => {
const wrapper = createComponent();
assert.isFalse(wrapper.find('TopBar').prop('showShareButton'));
});
});
describe('search panel', () => {
[true, false].forEach(searchPanelEnabled => {
it('renders SearchPanel when feature is enabled', () => {
......
src/sidebar/components/test/TopBar-test.js
View file @ 91cc9775
......@@ -65,7 +65,6 @@ describe('TopBar', () => {
isSidebar={true}
settings={fakeSettings}
streamer={fakeStreamer}
showShareButton
{...props}
/>,
);
......@@ -159,15 +158,6 @@ describe('TopBar', () => {
});
});
context('when showShareButton is false', () => {
it("doesn't show the share annotations button", () => {
const wrapper = createTopBar({ showShareButton: false });
assert.isFalse(
wrapper.exists('[title="Share annotations on this page"]'),
);
});
});
it('toggles the share annotations panel when "Share" is clicked', () => {
const wrapper = createTopBar();
const shareButton = getButton(wrapper, 'share-icon-button');
......
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