Add global-search-filters feature (#4098)

readme.md

@@ -326,6 +326,7 @@ Thanks for contributing! 🦋🙌
 - [](# "stop-redirecting-in-notification-bar") [Stops redirecting to notification inbox from notification bar actions while holding <kbd>Alt</kbd>.](https://user-images.githubusercontent.com/202916/80318782-c38cef80-880c-11ea-9226-72c585f42a51.png)
 - [](# "hide-zero-packages") [Hides the `Packages` tab in user profiles if it’s empty.](https://user-images.githubusercontent.com/46634000/101151879-9ade9b00-3622-11eb-9755-50ed54099e02.png)
 - [](# "select-all-notifications-shortcut") Adds a shortcut to select all visible notifications: <kbd>a</kbd>.
+- [](# "global-search-filters") [Adds search filters in global search page: forks, private repos, own repos, authored commits.](https://user-images.githubusercontent.com/44045911/112261285-88a66c80-8ca6-11eb-82cb-933b72c57abd.png)
 
 <!-- Refer to style guide above. Keep this message between sections. -->
 

source/features/global-search-filters.tsx

@@ -0,0 +1,52 @@
+import React from 'dom-chef';
+import {XIcon} from '@primer/octicons-react';
+import elementReady from 'element-ready';
+import * as pageDetect from 'github-url-detection';
+
+import features from '.';
+import SearchQuery from '../github-helpers/search-query';
+import {getUsername} from '../github-helpers';
+
+async function init(): Promise<void> {
+	const filters = [
+		['Forks', 'fork:true'],
+		['Private', 'is:private'],
+		['Yours', 'user:' + getUsername()],
+		['Authored', 'author:@me']
+	];
+	const items = [];
+	for (const [name, filter] of filters) {
+		const item = <a className="filter-item" href={location.href}>{name}</a>;
+		const query = new SearchQuery(item as unknown as HTMLAnchorElement);
+
+		if (query.includes(filter)) {
+			query.remove(filter);
+			item.classList.add('selected');
+			item.prepend(<XIcon className="float-right"/>);
+		} else {
+			query.add(filter);
+		}
+
+		items.push(<li>{item}</li>);
+	}
+
+	const links = await elementReady('#js-pjax-container .menu ~ .mt-3');
+	links!.before(
+		<div className="border rounded-1 p-3 mb-3 d-none d-md-block">
+			<h2 className="d-inline-block f5 mb-2">
+				Filters
+			</h2>
+			<ul data-pjax className="filter-list small">
+				{items}
+			</ul>
+		</div>
+	);
+}
+
+void features.add(__filebasename, {
+	include: [
+		pageDetect.isGlobalSearchResults
+	],
+	awaitDomReady: false,
+	init
+});

source/refined-github.ts

@@ -215,6 +215,7 @@ import './features/conversation-activity-filter';
 import './features/select-all-notifications-shortcut';
 import './features/no-duplicate-list-update-time';
 import './features/view-last-pr-deployment';
+import './features/global-search-filters';
 
 // Add global for easier debugging
 (window as any).select = select;