feat: recognize fatal errors in search sources

Author: MartinCupela

src/search/BaseSearchSource.ts

@@ -68,6 +68,8 @@ abstract class BaseSearchSourceBase<T> implements ISearchSource<T> {
     this.state = new StateStore<SearchSourceState<T>>(this.initialState);
   }
 
+  protected abstract isFatalError(error: Error): boolean;
+
   get lastQueryError() {
     return this.state.getLatestValue().lastQueryError;
   }
@@ -217,6 +219,9 @@ export abstract class BaseSearchSource<T>
 
   protected abstract filterQueryResults(items: T[]): T[] | Promise<T[]>;
 
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  protected isFatalError = (e: Error) => false;
+
   setDebounceOptions = ({ debounceMs }: DebounceOptions) => {
     this.searchDebounced = debounce(this.executeQuery.bind(this), debounceMs);
   };
@@ -237,6 +242,9 @@ export abstract class BaseSearchSource<T>
       stateUpdate.items = await this.filterQueryResults(items);
     } catch (e) {
       stateUpdate.lastQueryError = e as Error;
+      if (this.isFatalError(e as Error)) {
+        stateUpdate.hasNext = false;
+      }
     } finally {
       this.state.next(this.getStateAfterQuery(stateUpdate, hasNewSearchQuery));
     }
@@ -265,6 +273,10 @@ export abstract class BaseSearchSourceSync<T>
 
   protected abstract filterQueryResults(items: T[]): T[];
 
+  /** Signals that with the current search query string it is not possible to perform further requests. */
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  protected isFatalError = (e: Error) => false;
+
   setDebounceOptions = ({ debounceMs }: DebounceOptions) => {
     this.searchDebounced = debounce(this.executeQuery.bind(this), debounceMs);
   };
@@ -285,6 +297,9 @@ export abstract class BaseSearchSourceSync<T>
       stateUpdate.items = this.filterQueryResults(items);
     } catch (e) {
       stateUpdate.lastQueryError = e as Error;
+      if (this.isFatalError(e as Error)) {
+        stateUpdate.hasNext = false;
+      }
     } finally {
       this.state.next(this.getStateAfterQuery(stateUpdate, hasNewSearchQuery));
     }

src/search/ChannelSearchSource.ts

@@ -3,7 +3,12 @@ import type { FilterBuilderOptions } from '../pagination';
 import { FilterBuilder } from '../pagination';
 import type { Channel } from '../channel';
 import type { StreamChat } from '../client';
-import type { ChannelFilters, ChannelOptions, ChannelSort } from '../types';
+import type {
+  APIErrorResponse,
+  ChannelFilters,
+  ChannelOptions,
+  ChannelSort,
+} from '../types';
 import type { SearchSourceOptions } from './types';
 
 type CustomContext = Record<string, unknown>;
@@ -70,4 +75,20 @@ export class ChannelSearchSource<
   protected filterQueryResults(items: Channel[]) {
     return items;
   }
+
+  protected isFatalError = (error: Error) => {
+    // unwrapping error message that has been wrapped
+    // 1. server-side once - /.*failed with error: "(.*)"/
+    // 2. client-side second time - StreamChat error code \d+:
+    const originalErrorString = error.message.match(
+      /StreamChat error code \d+: .*failed with error: "(.*)"/,
+    )?.[1];
+    if (!originalErrorString) return false;
+    try {
+      const originalError = JSON.parse(originalErrorString) as APIErrorResponse;
+      return /field is empty or contains invalid characters/.test(originalError.message);
+    } catch (e) {
+      return false;
+    }
+  };
 }

test/unit/search/ChannelSearchSource.test.ts

@@ -184,4 +184,34 @@ describe('ChannelSearchSource', () => {
       context: { searchQuery: 'no-user' },
     });
   });
+
+  describe('method isFatalError', () => {
+    it('considers fatal an error matching syntax /StreamChat error code \\d+: .*failed with error: "(.*)"/', () => {
+      const message =
+        'StreamChat error code 4: QueryChannels failed with error: "{"code":4,"message":"$autocomplete field is empty or contains invalid characters. Please provide a valid string to autocomplete","StatusCode":400,"duration":"","more_info":"","details":[]}"';
+      // @ts-expect-error accessing protected property
+      expect(searchSource.isFatalError(new Error(message))).toBe(true);
+    });
+
+    it('considers non-fatal an error not matching syntax /StreamChat error code \\d+: .*failed with error: "(.*)"/', () => {
+      const message =
+        'StreamChat error code: QueryChannels failed with error: "{"code":4,"message":"$autocomplete field is empty or contains invalid characters. Please provide a valid string to autocomplete","StatusCode":400,"duration":"","more_info":"","details":[]}"';
+      // @ts-expect-error accessing protected property
+      expect(searchSource.isFatalError(new Error(message))).toBe(false);
+    });
+
+    it('considers non-fatal an error with malformed JSON in the error message', () => {
+      const message =
+        'QueryChannels failed with error: "{code":4,"message":"$autocomplete field is empty or contains invalid characters. Please provide a valid string to autocomplete","StatusCode":400,"duration":"","more_info":"","details":[]}"';
+      // @ts-expect-error accessing protected property
+      expect(searchSource.isFatalError(new Error(message))).toBe(false);
+    });
+
+    it('considers non-fatal an error not containing "field is empty or contains invalid characters"', () => {
+      const message =
+        'StreamChat error code 4: QueryChannels failed with error: "{"code":4,"message":"$autocomplete field is empty or xx invalid characters. Please provide a valid string to autocomplete","StatusCode":400,"duration":"","more_info":"","details":[]}"';
+      // @ts-expect-error accessing protected property
+      expect(searchSource.isFatalError(new Error(message))).toBe(false);
+    });
+  });
 });

test/unit/search/SearchController.test.js

@@ -10,7 +10,7 @@ import {
 import { generateUser } from '../test-utils/generateUser';
 import { generateChannel } from '../test-utils/generateChannel';
 
-import { describe, it, expect, beforeEach, afterEach } from 'vitest';
+import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest';
 
 describe('SearchController', () => {
 	let searchController;
@@ -407,6 +407,37 @@ describe('BaseSearchSource and implementations', () => {
 				expect(searchSource.items).to.deep.equal(['item1']);
 				expect(searchSource.hasNext).to.be.false;
 			});
+
+			it('stores error from a failed request, keeps ability to paginate', async () => {
+				searchSource.pageSize = 1;
+				searchSource.state.partialNext({
+					items: [],
+					isActive: true,
+					searchQuery: 'test',
+				});
+
+				vi.spyOn(searchSource, 'query').mockRejectedValue(new Error('anything'));
+
+				await searchSource.executeQuery();
+				expect(searchSource.items).toStrictEqual([]);
+				expect(searchSource.hasNext).toBe(true);
+			});
+
+			it('terminates pagination on fatal error', async () => {
+				searchSource.pageSize = 1;
+				searchSource.state.partialNext({
+					items: [],
+					isActive: true,
+					searchQuery: 'test',
+				});
+
+				vi.spyOn(searchSource, 'query').mockRejectedValue(new Error('anything'));
+				vi.spyOn(searchSource, 'isFatalError').mockReturnValue(true);
+
+				await searchSource.executeQuery();
+				expect(searchSource.items).toStrictEqual([]);
+				expect(searchSource.hasNext).toBe(false);
+			});
 		});
 
 		describe('search debounce', () => {