Enable type to find in search view

src/vs/workbench/parts/search/browser/media/searchview.css

@@ -177,6 +177,7 @@
 	line-height: 22px;
 	display: flex;
 	overflow: hidden;
+	padding-left: 22px;
 }
 
 .search-view .linematch > .match {

src/vs/workbench/parts/search/browser/searchResultsView.ts

@@ -26,6 +26,7 @@ import { IResourceLabel, ResourceLabels } from 'vs/workbench/browser/labels';
 import { RemoveAction, ReplaceAction, ReplaceAllAction, ReplaceAllInFolderAction } from 'vs/workbench/parts/search/browser/searchActions';
 import { SearchView } from 'vs/workbench/parts/search/browser/searchView';
 import { FileMatch, FolderMatch, Match, RenderableMatch, SearchModel, BaseFolderMatch } from 'vs/workbench/parts/search/common/searchModel';
+import { createMatches } from 'vs/base/common/filters';
 
 interface IFolderMatchTemplate {
 	label: IResourceLabel;
@@ -162,7 +163,7 @@ export class FileMatchRenderer extends Disposable implements ITreeRenderer<FileM
 	renderTemplate(container: HTMLElement): IFileMatchTemplate {
 		const disposables: IDisposable[] = [];
 		const fileMatchElement = DOM.append(container, DOM.$('.filematch'));
-		const label = this.labels.create(fileMatchElement);
+		const label = this.labels.create(fileMatchElement, { supportHighlights: true });
 		disposables.push(label);
 		const badge = new CountBadge(DOM.append(fileMatchElement, DOM.$('.badge')));
 		disposables.push(attachBadgeStyler(badge, this.themeService));
@@ -182,7 +183,11 @@ export class FileMatchRenderer extends Disposable implements ITreeRenderer<FileM
 	renderElement(node: ITreeNode<FileMatch, any>, index: number, templateData: IFileMatchTemplate): void {
 		const fileMatch = node.element;
 		templateData.el.setAttribute('data-resource', fileMatch.resource().toString());
-		templateData.label.setFile(fileMatch.resource(), { hideIcon: false });
+		templateData.label.setFile(
+			fileMatch.resource(), {
+				hideIcon: false,
+				matches: createMatches(node.filterData)
+			});
 		const count = fileMatch.count();
 		templateData.badge.setCount(count);
 		templateData.badge.setTitleFormat(count > 1 ? nls.localize('searchMatches', "{0} matches found", count) : nls.localize('searchMatch', "{0} match found", count));

src/vs/workbench/parts/search/browser/searchView.ts

@@ -62,6 +62,8 @@ import { IEditorGroupsService } from 'vs/workbench/services/group/common/editorG
 import { IPartService } from 'vs/workbench/services/part/common/partService';
 import { IPreferencesService, ISettingsEditorOptions } from 'vs/workbench/services/preferences/common/preferences';
 import { IUntitledEditorService } from 'vs/workbench/services/untitled/common/untitledEditorService';
+import { createFileIconThemableTreeContainerScope } from 'vs/workbench/browser/parts/views/views';
+import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
 
 const $ = dom.$;
 
@@ -143,10 +145,11 @@ export class SearchView extends Viewlet implements IViewlet, IPanel {
 		@IUntitledEditorService private readonly untitledEditorService: IUntitledEditorService,
 		@IPreferencesService private readonly preferencesService: IPreferencesService,
 		@IThemeService protected themeService: IThemeService,
+		@IWorkbenchThemeService protected workbenchThemeService: IWorkbenchThemeService,
 		@ISearchHistoryService private readonly searchHistoryService: ISearchHistoryService,
 		@IEditorGroupsService private readonly editorGroupsService: IEditorGroupsService,
 		@IContextMenuService private readonly contextMenuService: IContextMenuService,
-		@IMenuService private readonly menuService: IMenuService
+		@IMenuService private readonly menuService: IMenuService,
 	) {
 		super(VIEW_ID, configurationService, partService, telemetryService, themeService, storageService);
 
@@ -615,6 +618,7 @@ export class SearchView extends Viewlet implements IViewlet, IPanel {
 	private createSearchResultsView(container: HTMLElement): void {
 		this.resultsElement = dom.append(container, $('.results.show-file-icons'));
 		const delegate = this.instantiationService.createInstance(SearchDelegate);
+		this._register(createFileIconThemableTreeContainerScope(this.resultsElement, this.workbenchThemeService));
 
 		const identityProvider: IIdentityProvider<RenderableMatch> = {
 			getId(element: RenderableMatch) {
@@ -632,6 +636,15 @@ export class SearchView extends Viewlet implements IViewlet, IPanel {
 				this._register(this.instantiationService.createInstance(MatchRenderer, this.viewModel, this)),
 			],
 			{
+				keyboardNavigationLabelProvider: {
+					getKeyboardNavigationLabel: (element: RenderableMatch) => {
+						if (element instanceof FolderMatch || element instanceof FileMatch) {
+							return element.name();
+						}
+
+						return '';
+					}
+				},
 				identityProvider,
 				accessibilityProvider: this.instantiationService.createInstance(SearchAccessibilityProvider, this.viewModel)
 			}));