Issue Reporter: Search GitHub issues on input instead of blur

This commit is contained in:
Rachel Macfarlane
2018-01-25 10:38:53 -08:00
parent 32abd36d94
commit f310c3fb6f
4 changed files with 71 additions and 43 deletions

View File

@@ -33,6 +33,7 @@ import { IssueReporterModel, IssueType } from 'vs/code/electron-browser/issue/is
import { IssueReporterData, IssueReporterStyles } from 'vs/platform/issue/common/issue';
import BaseHtml from 'vs/code/electron-browser/issue/issueReporterPage';
import { ILocalExtension } from 'vs/platform/extensionManagement/common/extensionManagement';
import { debounce } from 'vs/base/common/decorators';
export interface IssueReporterConfiguration extends IWindowConfiguration {
data: IssueReporterData;
@@ -57,6 +58,8 @@ export class IssueReporter extends Disposable {
constructor(configuration: IssueReporterConfiguration) {
super();
this.initServices(configuration);
this.issueReporterModel = new IssueReporterModel({
issueType: IssueType.Bug,
includeSystemInfo: true,
@@ -66,7 +69,8 @@ export class IssueReporter extends Disposable {
versionInfo: {
vscodeVersion: `${pkg.name} ${pkg.version} (${product.commit || 'Commit unknown'}, ${product.date || 'Date unknown'})`,
os: `${os.type()} ${os.arch()} ${os.release()}`
}
},
extensionsDisabled: this.environmentService.disableExtensions
});
ipcRenderer.on('issueInfoResponse', (event, info) => {
@@ -81,13 +85,11 @@ export class IssueReporter extends Disposable {
ipcRenderer.send('issueInfoRequest');
this.initServices(configuration);
this.setEventHandlers();
if (window.document.documentElement.lang !== 'en') {
show(document.getElementById('english'));
}
this.setEventHandlers();
this.applyZoom(configuration.data.zoomLevel);
this.applyStyles(configuration.data.styles);
this.handleExtensionData(configuration.data.enabledExtensions);
@@ -215,42 +217,7 @@ export class IssueReporter extends Disposable {
this.issueReporterModel.update({ issueDescription: (<HTMLInputElement>event.target).value });
});
function addIssuesToList(list, issueJSON) {
for (let i = 0; i < 5; i++) {
const link = $('a', { href: issueJSON[i].html_url });
link.textContent = issueJSON[i].title;
link.addEventListener('click', (event) => {
shell.openExternal((<HTMLAnchorElement>event.target).href);
});
const item = $('li', {}, link);
list.appendChild(item);
}
}
document.getElementById('issue-title').addEventListener('blur', (event) => {
const title = (<HTMLInputElement>event.target).value;
const similarIssues = document.getElementById('similar-issues');
similarIssues.innerHTML = '';
if (title) {
const query = `is:issue+repo:microsoft/vscode+${title}`;
window.fetch(`https://api.github.com/search/issues?q=${query}&per_page=5`).then((response) => {
response.json().then(result => {
if (result.items.length) {
const issues = $('ul');
const issuesText = $('div.list-title');
issuesText.textContent = localize('similarIssues', "Similar issues");
addIssuesToList(issues, result.items);
similarIssues.appendChild(issuesText);
similarIssues.appendChild(issues);
}
});
}).catch((error) => {
console.log(error);
});
}
});
document.getElementById('issue-title').addEventListener('input', this.searchGitHub);
document.getElementById('github-submit-btn').addEventListener('click', () => this.createIssue());
@@ -264,6 +231,45 @@ export class IssueReporter extends Disposable {
};
}
@debounce(300)
private searchGitHub(event: Event) {
const title = (<HTMLInputElement>event.target).value;
const similarIssues = document.getElementById('similar-issues');
if (title) {
const query = `is:issue+repo:microsoft/vscode+${title}`;
window.fetch(`https://api.github.com/search/issues?q=${query}`).then((response) => {
response.json().then(result => {
similarIssues.innerHTML = '';
if (result && result.items && result.items.length) {
const issues = $('ul');
const issuesText = $('div.list-title');
issuesText.textContent = localize('similarIssues', "Similar issues");
const { items } = result;
const numResultsToDisplay = items.length < 5 ? items.length : 5;
for (let i = 0; i < numResultsToDisplay; i++) {
const link = $('a', { href: items[i].html_url });
link.textContent = items[i].title;
link.addEventListener('click', (event) => {
shell.openExternal((<HTMLAnchorElement>event.target).href);
});
const item = $('li', {}, link);
issues.appendChild(item);
}
similarIssues.appendChild(issuesText);
similarIssues.appendChild(issues);
}
});
}).catch((error) => {
console.log(error);
});
} else {
similarIssues.innerHTML = '';
}
}
private renderBlocks(): void {
// Depending on Issue Type, we render different blocks and text
const { issueType } = this.issueReporterModel.getData();
@@ -413,6 +419,12 @@ export class IssueReporter extends Disposable {
private updateExtensionTable(extensions: ILocalExtension[], numThemeExtensions: number): void {
const target = document.querySelector('.block-extensions .block-info');
if (this.environmentService.disableExtensions) {
target.innerHTML = localize('disabledExtensions', "Extensions are disabled");
return;
}
const themeExclusionStr = numThemeExtensions ? `\n(${numThemeExtensions} theme extensions excluded)` : '';
extensions = extensions || [];