Display highlight popup in the web build. zotero/web-library#570

Author: tnajdek

src/ui/editor.js

@@ -78,7 +78,7 @@ function Editor(props) {
 					{refReady && !props.disableUI && <Fragment>
 						{['ios', 'web'].includes(props.viewMode) && !editorState.link?.popup.active && editorState.table.isTableSelected() && <TablePopup parentRef={editorRef} tableState={editorState.table} /> }
 						{editorState.link && <LinkPopup parentRef={editorRef} pluginState={editorState.link.popup}/>}
-						{!['web'].includes(props.viewMode) && editorState.highlight && <HighlightPopup parentRef={editorRef} highlightState={editorState.highlight} citationState={editorState.citation}/>}
+						{editorState.highlight && <HighlightPopup parentRef={editorRef} highlightState={editorState.highlight} citationState={editorState.citation} viewMode={props.viewMode} />}
 						{!['web'].includes(props.viewMode) && editorState.image && <ImagePopup parentRef={editorRef} imageState={editorState.image} citationState={editorState.citation}/>}
 						{editorState.citation && <CitationPopup
 							parentRef={editorRef}

src/ui/popups/highlight-popup.js

@@ -9,7 +9,7 @@ import IconBlockquote from '../../../res/icons/16/cite.svg';
 import IconDocument from '../../../res/icons/16/page.svg';
 import IconUnlink from '../../../res/icons/16/unlink.svg';
 
-function HighlightPopup({ parentRef, highlightState, citationState }) {
+function HighlightPopup({ parentRef, highlightState, citationState, viewMode }) {
 	function handleOpen() {
 		highlightState.popup.open();
 	}
@@ -28,10 +28,12 @@ function HighlightPopup({ parentRef, highlightState, citationState }) {
 				<div className="icon"><IconDocument/></div>
 				<div className="title"><FormattedMessage id="noteEditor.showOnPage"/></div>
 			</button>
-			<button onClick={handleUnlink}>
-				<div className="icon"><IconUnlink/></div>
-				<div className="title"><FormattedMessage id="noteEditor.unlink"/></div>
-			</button>
+			{!['web'].includes(viewMode) && (
+				<button onClick={handleUnlink}>
+					<div className="icon"><IconUnlink/></div>
+					<div className="title"><FormattedMessage id="noteEditor.unlink"/></div>
+				</button>
+			)}
 			{citationState.canAddCitationAfter() && <button onClick={handleAdd}>
 				<div className="icon"><IconBlockquote/></div>
 				<div className="title"><FormattedMessage id="noteEditor.addCitation"/></div>