Browse Source

Adds progress indicator to graph searching

main
Eric Amodio 2 years ago
parent
commit
fc7ebff9c5
2 changed files with 31 additions and 7 deletions
  1. +19
    -5
      src/webviews/apps/plus/graph/GraphWrapper.tsx
  2. +12
    -2
      src/webviews/apps/shared/components/search/search-box.ts

+ 19
- 5
src/webviews/apps/plus/graph/GraphWrapper.tsx View File

@ -184,6 +184,7 @@ export function GraphWrapper({
const [searchResults, setSearchResults] = useState(results);
const [searchResultsError, setSearchResultsError] = useState(resultsError);
const [searchResultsHidden, setSearchResultsHidden] = useState(false);
const [searching, setSearching] = useState(false);
// working tree state
const [workingTreeStats, setWorkingTreeStats] = useState(
@ -231,6 +232,7 @@ export function GraphWrapper({
setSearchResultsError(resultsError);
setSearchResults(results);
setSelectedRows(state.selectedRows);
setSearching(false);
break;
}
case DidChangeGraphConfigurationNotificationType:
@ -311,11 +313,10 @@ export function GraphWrapper({
setSearchQuery(detail);
const isValid = detail.query.length >= 3;
if (!isValid) {
setSearchResults(undefined);
}
setSearchResults(undefined);
setSearchResultsError(undefined);
setSearchResultsHidden(false);
setSearching(isValid);
onSearch?.(isValid ? detail : undefined);
};
@ -357,7 +358,13 @@ export function GraphWrapper({
if (searchIndex == -1) {
if (next) {
if (searchQuery != null && results?.paging?.hasMore) {
const moreResults = await onSearchPromise?.(searchQuery, { more: true });
setSearching(true);
let moreResults;
try {
moreResults = await onSearchPromise?.(searchQuery, { more: true });
} finally {
setSearching(false);
}
if (moreResults?.results != null && !('error' in moreResults.results)) {
if (count < moreResults.results.count) {
results = moreResults.results;
@ -373,7 +380,13 @@ export function GraphWrapper({
searchIndex = 0;
}
} else if (direction === 'last' && searchQuery != null && results?.paging?.hasMore) {
const moreResults = await onSearchPromise?.(searchQuery, { limit: 0, more: true });
setSearching(true);
let moreResults;
try {
moreResults = await onSearchPromise?.(searchQuery, { limit: 0, more: true });
} finally {
setSearching(false);
}
if (moreResults?.results != null && !('error' in moreResults.results)) {
if (count < moreResults.results.count) {
results = moreResults.results;
@ -660,6 +673,7 @@ export function GraphWrapper({
total={searchResults?.count ?? 0}
valid={Boolean(searchQuery?.query && searchQuery.query.length > 2)}
more={searchResults?.paging?.hasMore ?? false}
searching={searching}
value={searchQuery?.query ?? ''}
errorMessage={searchResultsError?.error ?? ''}
resultsHidden={searchResultsHidden}

+ 12
- 2
src/webviews/apps/shared/components/search/search-box.ts View File

@ -7,6 +7,7 @@ import { numberConverter } from '../converters/number-converter';
import '../codicon';
import type { SearchInput } from './search-input';
import './search-input';
import './../progress';
export type SearchNavigationDirection = 'first' | 'previous' | 'next' | 'last';
export interface SearchNavigationEventDetail {
@ -35,9 +36,10 @@ const template = html`