Make Mark All As Read optional (#155)

Author: karlhorky

source/github-notifications-preview.jsx

@@ -130,6 +130,7 @@ async function openDropdown({currentTarget: indicator}) {
 	if (!isOpen(dropdown) && list.length > 0) {
 		const container = $('.NPG-dropdown', dropdown);
 		empty(container);
+
 		const dropdownHeader = (
 			<div
 				style={{
@@ -168,7 +169,11 @@ async function openDropdown({currentTarget: indicator}) {
 				</div>
 			</div>
 		);
-		container.append(dropdownHeader);
+
+		if (options.markAllAsRead) {
+			container.append(dropdownHeader);
+		}
+
 		container.append(...list);
 
 		delegate('.NPG-dropdown button', 'click', async event => {
@@ -206,7 +211,10 @@ async function openDropdown({currentTarget: indicator}) {
 
 			// All notifications are read, remove the header
 			if ($$('.js-notifications-list-item, .js-notifications-group').length === 0) {
-				dropdownHeader.remove();
+				if (options.markAllAsRead) {
+					dropdownHeader.remove();
+				}
+
 				closeDropdown();
 			}
 		});

source/options-storage.js

@@ -3,6 +3,7 @@ import OptionsSync from 'webext-options-sync';
 const optionsStorage = new OptionsSync({
 	defaults: {
 		previewCount: true,
+		markAllAsRead: true,
 		dropdown: 'compact',
 		participating: false,
 		closeOnMouseleave: false,

source/options.html

@@ -9,6 +9,12 @@
 			Show notification number in blue bubble
 		</label>
 	</p>
+	<p>
+		<label>
+			<input type="checkbox" name="markAllAsRead">
+			Show "Mark all as read" link
+		</label>
+	</p>
 	<p>
 		<label>
 			<input type="checkbox" name="participating">