react rxjs autocomplete

1import { BehaviorSubject } from 'rxjs';
2import { ajax, AjaxResponse } from 'rxjs/ajax';
3import { map, filter, switchMap, debounceTime } from 'rxjs/operators';
4
5const getApiUrl = (value: string) => `/response.json?value=${value}`;
6
7const transformResponse = ({ response }: AjaxResponse) => {
8  return response.bestMatches.map(item => ({
9    symbol: item['1. symbol'],
10    name: item['2. name'],
11    type: item['3. type'],
12    region: item['4. region'],
13    marketOpen: item['5. marketOpen'],
14    marketClose: item['6. marketClose'],
15    timezone: item['7. timezone'],
16    currency: item['8. currency'],
17    matchScore: item['9. matchScore']
18  }));
19};
20
21export const getSuggestions = (subject: BehaviorSubject<string>) => {
22  return subject.pipe(
23    debounceTime(500), // wait until user stops typing
24    filter(v => v.length > 2), // send request only if there are 3 or more characters
25    map(getApiUrl), // form url for the API call
26    switchMap(url => ajax(url)), // call HTTP endpoint and cancel previous requests
27    map(transformResponse) // change response shape for autocomplete consumption
28  );
29};