Menu
FormControl with debounceTime pattern for search inputs. Use when implementing any search or filter input.
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
Team quality gate as executable instruction. Use when reviewing completed work before merge, or when processing PR review comments received from other reviewers.
Generate well-formed user stories from technical context. Use when generating or improving story descriptions for an issue tracker.
Type-safe validated configuration properties from application.yml. Use when adding any externalisable value.
Consistent error handling with named exceptions and global handler. Use when implementing any method that can fail with a business reason.
Consistent, safe log statements with correct levels and no PII. Use when adding or reviewing log statements.
Team standard for improving existing code without changing behaviour. Use when refactoring code.
| name | debounced-search |
| description | FormControl with debounceTime pattern for search inputs. Use when implementing any search or filter input. |
FormControl + debouncesearchControl = new FormControl('');
ngOnInit(): void {
this.searchControl.valueChanges.pipe(
debounceTime(300),
distinctUntilChanged(),
takeUntil(this.destroy$)
).subscribe(query => this.filterItems(query ?? ''));
}
debounceTime(300) — 300ms standard. Do not lower.distinctUntilChanged() — prevents redundant filter runs.query ?? '' — valueChanges can emit null; always coerce to string.<input type="text" [formControl]="searchControl" aria-label="..." />
(input) or (keyup) event bindings — use FormControl.valueChangesngModel — reactive forms only