Enter a query to search SEC filings
@@ -221,12 +251,18 @@
Delete Query
@if (results().length === 0 && !loading() && hasSearched()) {
-
No filings found
+
{{ showQueryEditor() ? 'No filings found' : 'No favorites yet' }}
}
@if (results().length > 0 && gridStateLoaded()) {
-
+
}
diff --git a/src/app/features/filings/filing-search.component.ts b/src/app/features/filings/filing-search.component.ts
index 26925b8..03b1ded 100644
--- a/src/app/features/filings/filing-search.component.ts
+++ b/src/app/features/filings/filing-search.component.ts
@@ -2,6 +2,7 @@ import { ChangeDetectionStrategy, Component, DestroyRef, inject, signal, compute
import { FormControl, ReactiveFormsModule } from '@angular/forms';
import { ActivatedRoute, Router } from '@angular/router';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { Subject, takeUntil } from 'rxjs';
import { NgIcon, provideIcons } from '@ng-icons/core';
import {
lucideChevronDown,
@@ -25,6 +26,8 @@ import { AppChromeService } from '../../core/services/app-chrome.service';
import { FilingService } from '../../core/services/filing.service';
import { SavedQueriesService } from '../../core/services/saved-queries.service';
import { StringsService } from '../../core/services/strings.service';
+import { FavoritesService } from '../../core/services/favorites.service';
+import { TabManagerService } from '../../core/services/tab-manager.service';
import { Filing } from '../../core/models/filing.model';
import { SavedQuery } from '../../core/models/query-parameter.model';
import { AnalyticsService } from '../../core/services/analytics.service';
@@ -35,6 +38,7 @@ import {
FilingResultsGridComponent,
FilingQueryEditorComponent,
FilingQueryItemComponent,
+ FilingTabBarComponent,
} from './components';
@Component({
@@ -55,6 +59,7 @@ import {
FilingResultsGridComponent,
FilingQueryEditorComponent,
FilingQueryItemComponent,
+ FilingTabBarComponent,
],
providers: [
provideIcons({
@@ -75,6 +80,8 @@ export class FilingSearchComponent {
private readonly filingService = inject(FilingService);
private readonly savedQueriesService = inject(SavedQueriesService);
private readonly analytics = inject(AnalyticsService);
+ readonly favoritesService = inject(FavoritesService);
+ readonly tabManager = inject(TabManagerService);
private readonly router = inject(Router);
private readonly route = inject(ActivatedRoute);
private readonly stringsService = inject(StringsService);
@@ -91,6 +98,9 @@ export class FilingSearchComponent {
results = signal
([]);
hasSearched = signal(false);
+ // Cancels in-flight queries when switching tabs
+ private readonly tabSwitch$ = new Subject();
+
// Logo animation state
animatingLogo = signal(false);
logoKey = signal(0);
@@ -111,6 +121,7 @@ export class FilingSearchComponent {
// Expose saved queries service state
savedQueries = this.savedQueriesService.savedQueries;
currentGuid = this.savedQueriesService.currentGuid;
+ currentQueryText = this.savedQueriesService.currentQuery;
hasDeletedBlueprints = this.savedQueriesService.hasDeletedBlueprints;
/** User-created queries (no blueprintId) - pinned first, then by lastUsed desc */
@@ -161,6 +172,22 @@ export class FilingSearchComponent {
gridColumnState = signal(null);
gridStateLoaded = signal(false);
+ // Tab-related state
+ showQueryEditor = computed(() => !this.tabManager.isFavoritesActive());
+ showFavoritesTab = computed(() => this.favoritesService.hasFavorites());
+ favoritesResults = signal([]);
+ favoritesLoading = signal(false);
+
+ /** Map of query GUID → display name for the tab bar */
+ tabQueryNames = computed(() => {
+ const queries = this.savedQueries();
+ const names = new Map();
+ for (const [guid, q] of Object.entries(queries)) {
+ names.set(guid, this.savedQueriesService.getQueryDisplayName(q));
+ }
+ return names;
+ });
+
constructor() {
this.appChrome.visible.set(true);
@@ -199,12 +226,50 @@ export class FilingSearchComponent {
}, 500);
- // Auto-select query from ?q= param once saved queries have loaded
+ // Once saved queries are loaded, initialize tab state
effect(() => {
const queries = this.savedQueries();
+ if (Object.keys(queries).length === 0) return;
+ if (this.tabManager.loaded()) return; // already loaded
+
const qParam = this.route.snapshot.queryParamMap.get('q');
- if (qParam && queries[qParam] && this.currentGuid() !== qParam) {
- this.selectSavedQuery(qParam);
+ const fallbackGuid = qParam && queries[qParam]
+ ? qParam
+ : Object.keys(queries)[0];
+ this.tabManager.load(fallbackGuid);
+ });
+
+ // Once tabs are loaded, select the active tab's query and run it
+ effect(() => {
+ if (!this.tabManager.loaded()) return;
+
+ // Handle favorites tab on page reload
+ if (this.tabManager.isFavoritesActive()) {
+ if (this.favoritesService.loaded() && !this.favoritesLoading()) {
+ this.loadFavorites();
+ }
+ return;
+ }
+
+ const tab = this.tabManager.activeTab();
+ if (tab) {
+ const queries = this.savedQueries();
+ if (queries[tab.queryGuid] && this.currentGuid() !== tab.queryGuid) {
+ this.savedQueriesService.selectQuery(tab.queryGuid);
+ this.queryControl.setValue(this.savedQueriesService.currentQuery(), { emitEvent: false });
+ // Auto-run if not searched yet
+ const runtime = this.tabManager.getRuntime(tab.queryGuid);
+ if (!runtime.hasSearched) {
+ this.search();
+ } else {
+ // Restore cached results
+ this.results.set(runtime.results);
+ this.loading.set(runtime.loading);
+ this.error.set(runtime.error);
+ this.hasSearched.set(runtime.hasSearched);
+ }
+ this.router.navigate([], { queryParams: { q: tab.queryGuid }, queryParamsHandling: 'merge' });
+ }
}
});
}
@@ -231,7 +296,7 @@ export class FilingSearchComponent {
// Get the compiled query with parameter values replaced
const compiledQuery = this.savedQueriesService.getCompiledQuery();
-
+
// Check compilation result
const compileResult = this.savedQueriesService.canCompile();
if (!compileResult.success) {
@@ -239,6 +304,9 @@ export class FilingSearchComponent {
return;
}
+ // Capture the tab this search belongs to
+ const targetGuid = this.tabManager.activeTab()?.queryGuid;
+
this.loading.set(true);
this.error.set(null);
this.hasSearched.set(true);
@@ -251,18 +319,48 @@ export class FilingSearchComponent {
this.filingService
.search(compiledQuery)
- .pipe(takeUntilDestroyed(this.destroyRef))
+ .pipe(
+ takeUntil(this.tabSwitch$),
+ takeUntilDestroyed(this.destroyRef),
+ )
.subscribe({
next: (filings) => {
- this.results.set(filings ?? []);
- this.loading.set(false);
+ const data = filings ?? [];
this.stopLogoAfterAnimation(animStart, ANIM_DURATION);
- this.analytics.trackSearch(this.titleText(), (filings ?? []).length);
+ this.analytics.trackSearch(this.titleText(), data.length);
+
+ // Always cache in the tab's runtime
+ if (targetGuid) {
+ this.tabManager.setRuntime(targetGuid, {
+ results: data,
+ loading: false,
+ hasSearched: true,
+ error: null,
+ });
+ }
+
+ // Only update UI if this tab is still active
+ if (this.tabManager.activeTab()?.queryGuid === targetGuid) {
+ this.results.set(data);
+ this.loading.set(false);
+ }
},
error: () => {
- this.results.set([]);
- this.loading.set(false);
this.stopLogoAfterAnimation(animStart, ANIM_DURATION);
+
+ if (targetGuid) {
+ this.tabManager.setRuntime(targetGuid, {
+ results: [],
+ loading: false,
+ hasSearched: true,
+ error: 'Search failed',
+ });
+ }
+
+ if (this.tabManager.activeTab()?.queryGuid === targetGuid) {
+ this.results.set([]);
+ this.loading.set(false);
+ }
},
});
}
@@ -276,14 +374,213 @@ export class FilingSearchComponent {
selectSavedQuery(guid: string) {
if (this.renamingGuid() === guid) return;
-
+
+ // Cancel any in-flight query
+ this.tabSwitch$.next();
+
+ // Save current tab's state before switching
+ this.saveCurrentTabRuntime();
+
+ this.tabManager.openInCurrentTab(guid);
this.savedQueriesService.selectQuery(guid);
this.queryControl.setValue(this.savedQueriesService.currentQuery());
- // Update URL without triggering navigation
this.router.navigate([], { queryParams: { q: guid }, queryParamsHandling: 'merge' });
+ this.results.set([]);
+ this.loading.set(false);
+ this.error.set(null);
+ this.hasSearched.set(false);
+ this.search();
+ }
+
+ openQueryInNewTab(guid: string) {
+ // Cancel any in-flight query
+ this.tabSwitch$.next();
+
+ this.saveCurrentTabRuntime();
+ this.tabManager.openTab(guid);
+ this.savedQueriesService.selectQuery(guid);
+ this.queryControl.setValue(this.savedQueriesService.currentQuery());
+ this.router.navigate([], { queryParams: { q: guid }, queryParamsHandling: 'merge' });
+ this.results.set([]);
+ this.loading.set(false);
+ this.error.set(null);
+ this.hasSearched.set(false);
this.search();
}
+ switchTab(index: number) {
+ if (index === this.tabManager.activeIndex()) return;
+
+ // Cancel any in-flight query from the previous tab
+ this.tabSwitch$.next();
+
+ // Save current tab state
+ this.saveCurrentTabRuntime();
+
+ this.tabManager.switchTo(index);
+
+ if (index === -1) {
+ // Favorites tab — show cached results immediately, then refresh in background
+ const cached = this.favoritesResults();
+ if (cached.length > 0) {
+ this.results.set(cached);
+ this.hasSearched.set(true);
+ this.loading.set(false);
+ this.error.set(null);
+ } else {
+ this.results.set([]);
+ this.hasSearched.set(false);
+ this.loading.set(false);
+ this.error.set(null);
+ }
+ this.loadFavorites();
+ return;
+ }
+
+ const tab = this.tabManager.tabs()[index];
+ if (!tab) return;
+
+ const runtime = this.tabManager.getRuntime(tab.queryGuid);
+ this.savedQueriesService.selectQuery(tab.queryGuid);
+ this.queryControl.setValue(this.savedQueriesService.currentQuery(), { emitEvent: false });
+ this.router.navigate([], { queryParams: { q: tab.queryGuid }, queryParamsHandling: 'merge' });
+
+ if (!runtime.hasSearched) {
+ this.results.set([]);
+ this.loading.set(false);
+ this.error.set(null);
+ this.hasSearched.set(false);
+ this.search();
+ } else {
+ this.results.set(runtime.results);
+ this.loading.set(runtime.loading);
+ this.error.set(runtime.error);
+ this.hasSearched.set(runtime.hasSearched);
+ }
+ }
+
+ closeTab(index: number) {
+ this.tabManager.closeTab(index);
+ // After closing, switch to the new active tab
+ const activeTab = this.tabManager.activeTab();
+ if (activeTab) {
+ const runtime = this.tabManager.getRuntime(activeTab.queryGuid);
+ this.savedQueriesService.selectQuery(activeTab.queryGuid);
+ this.queryControl.setValue(this.savedQueriesService.currentQuery(), { emitEvent: false });
+ this.results.set(runtime.results);
+ this.loading.set(runtime.loading);
+ this.error.set(runtime.error);
+ this.hasSearched.set(runtime.hasSearched);
+ this.router.navigate([], { queryParams: { q: activeTab.queryGuid }, queryParamsHandling: 'merge' });
+ }
+ }
+
+ newTab() {
+ this.saveCurrentTabRuntime();
+ this.savedQueriesService.newQuery();
+ const newGuid = this.savedQueriesService.currentGuid();
+ if (newGuid) {
+ this.tabManager.openTab(newGuid);
+ this.queryControl.setValue('', { emitEvent: false });
+ this.results.set([]);
+ this.loading.set(false);
+ this.error.set(null);
+ this.hasSearched.set(false);
+ this.router.navigate([], { queryParams: { q: newGuid }, queryParamsHandling: 'merge' });
+ }
+ }
+
+ loadFavorites() {
+ const ids = this.favoritesService.favoriteIds();
+ if (ids.length === 0) {
+ this.favoritesResults.set([]);
+ if (this.tabManager.isFavoritesActive()) {
+ this.results.set([]);
+ this.hasSearched.set(true);
+ this.loading.set(false);
+ }
+ return;
+ }
+
+ if (!this.favoritesService.loaded()) {
+ if (this.tabManager.isFavoritesActive()) {
+ this.loading.set(true);
+ }
+ return;
+ }
+
+ if (this.tabManager.isFavoritesActive()) {
+ this.loading.set(true);
+ this.error.set(null);
+ }
+
+ const query = `id in (${ids.join(',')}) limit ${ids.length}`;
+ this.filingService.search(query)
+ .pipe(
+ takeUntil(this.tabSwitch$),
+ takeUntilDestroyed(this.destroyRef),
+ )
+ .subscribe({
+ next: (filings) => {
+ const data = filings ?? [];
+ // Always cache favorites results
+ this.favoritesResults.set(data);
+ // Only update UI if still on favorites tab
+ if (this.tabManager.isFavoritesActive()) {
+ this.results.set(data);
+ this.loading.set(false);
+ this.hasSearched.set(true);
+ }
+ },
+ error: () => {
+ if (this.tabManager.isFavoritesActive()) {
+ this.results.set(this.favoritesResults()); // keep cached
+ this.loading.set(false);
+ this.hasSearched.set(true);
+ this.error.set('Failed to load favorites');
+ }
+ },
+ });
+ }
+
+ refreshFavorites() {
+ this.loadFavorites();
+ }
+
+ onAddToFavorites(filingId: number) {
+ this.favoritesService.addFavorite(filingId);
+ }
+
+ onRemoveFromFavorites(filingId: number) {
+ this.favoritesService.removeFavorite(filingId);
+ // If on favorites tab, immediately remove from displayed results
+ if (this.tabManager.isFavoritesActive()) {
+ this.favoritesResults.update(r => r.filter(f => f.id !== filingId));
+ this.results.update(r => r.filter(f => f.id !== filingId));
+ // If no more favorites, switch to first query tab
+ if (this.favoritesService.favoriteIds().length === 0) {
+ this.switchTab(0);
+ }
+ }
+ }
+
+ private saveCurrentTabRuntime() {
+ if (this.tabManager.isFavoritesActive()) {
+ // Cache favorites results separately
+ this.favoritesResults.set(this.results());
+ return;
+ }
+ const tab = this.tabManager.activeTab();
+ if (tab) {
+ this.tabManager.setRuntime(tab.queryGuid, {
+ results: this.results(),
+ loading: this.loading(),
+ hasSearched: this.hasSearched(),
+ error: this.error(),
+ });
+ }
+ }
+
// Context Menu Actions
onDuplicateQuery(guid: string) {
this.savedQueriesService.duplicateQuery(guid);
@@ -326,6 +623,9 @@ export class FilingSearchComponent {
if (guid) {
this.savedQueriesService.deleteQuery(guid);
this.deleteConfirmGuid.set(null);
+ // Clean up any tabs referencing the deleted query
+ const existingGuids = new Set(Object.keys(this.savedQueries()));
+ this.tabManager.cleanupDeletedQueries(existingGuids);
}
}
diff --git a/src/app/features/help/help.component.ts b/src/app/features/help/help.component.ts
index 0eb3ba2..b2cf4ec 100644
--- a/src/app/features/help/help.component.ts
+++ b/src/app/features/help/help.component.ts
@@ -246,6 +246,58 @@ import {
Example: {{ '{' }}Tags:Tags:Presentation{{ '}' }} → 'Presentation'
+