Fix - Search

src/app/app.routes.ts

@@ -12,8 +12,6 @@ import { ProfileState } from './features/profile/store';
 import { RegistriesState } from './features/registries/store';
 import { LicensesHandlers, ProjectsHandlers, ProvidersHandlers } from './features/registries/store/handlers';
 import { FilesHandlers } from './features/registries/store/handlers/files.handlers';
-import { ResourceFiltersOptionsState } from './features/search/components/filters/store';
-import { ResourceFiltersState } from './features/search/components/resource-filters/store';
 import { SearchState } from './features/search/store';
 import { LicensesService } from './shared/services';
 
@@ -67,7 +65,7 @@ export const routes: Routes = [
  {
  path: 'search',
  loadComponent: () => import('./features/search/search.component').then((mod) => mod.SearchComponent),
- providers: [provideStates([ResourceFiltersState, ResourceFiltersOptionsState, SearchState])],
+ providers: [provideStates([SearchState])],
  },
  {
  path: 'my-projects',

src/app/features/institutions/pages/institutions-search/institutions-search.component.html

@@ -71,21 +71,27 @@ <h1>{{ institution().name }}</h1>
  <osf-reusable-filters
  [filters]="filters()"
  [selectedValues]="selectedValues()"
+ [filterSearchResults]="filterSearchResults()"
  [isLoading]="isResourcesLoading()"
  [showEmptyState]="true"
  (loadFilterOptions)="onLoadFilterOptions($event)"
  (filterValueChanged)="onFilterChanged($event)"
+ (filterSearchChanged)="onFilterSearchChanged($event)"
+ (loadMoreFilterOptions)="onLoadMoreFilterOptions($event)"
  />
  </div>
 
  <div slot="mobile-filters">
  <osf-reusable-filters
  [filters]="filters()"
  [selectedValues]="selectedValues()"
+ [filterSearchResults]="filterSearchResults()"
  [isLoading]="isResourcesLoading()"
  [showEmptyState]="true"
  (loadFilterOptions)="onLoadFilterOptions($event)"
  (filterValueChanged)="onFilterChanged($event)"
+ (filterSearchChanged)="onFilterSearchChanged($event)"
+ (loadMoreFilterOptions)="onLoadMoreFilterOptions($event)"
  />
  </div>
  </osf-search-results-container>

src/app/features/institutions/pages/institutions-search/institutions-search.component.ts

@@ -26,12 +26,15 @@ import { SEARCH_TAB_OPTIONS } from '@osf/shared/constants';
 import { ResourceTab } from '@osf/shared/enums';
 import { DiscoverableFilter } from '@osf/shared/models';
 import {
+ ClearFilterSearchResults,
  FetchInstitutionById,
  FetchResources,
  FetchResourcesByLink,
  InstitutionsSearchSelectors,
  LoadFilterOptions,
  LoadFilterOptionsAndSetValues,
+ LoadFilterOptionsWithSearch,
+ LoadMoreFilterOptions,
  SetFilterValues,
  UpdateFilterValue,
  UpdateResourceType,
@@ -75,13 +78,17 @@ export class InstitutionsSearchComponent implements OnInit {
  first = select(InstitutionsSearchSelectors.getFirst);
  next = select(InstitutionsSearchSelectors.getNext);
  previous = select(InstitutionsSearchSelectors.getPrevious);
+ filterSearchResults = select(InstitutionsSearchSelectors.getFilterSearchCache);
 
  private readonly actions = createDispatchMap({
  fetchInstitution: FetchInstitutionById,
  updateResourceType: UpdateResourceType,
  updateSortBy: UpdateSortBy,
  loadFilterOptions: LoadFilterOptions,
  loadFilterOptionsAndSetValues: LoadFilterOptionsAndSetValues,
+ loadFilterOptionsWithSearch: LoadFilterOptionsWithSearch,
+ clearFilterSearchResults: ClearFilterSearchResults,
+ loadMoreFilterOptions: LoadMoreFilterOptions,
  setFilterValues: SetFilterValues,
  updateFilterValue: UpdateFilterValue,
  fetchResourcesByLink: FetchResourcesByLink,
@@ -148,6 +155,18 @@ export class InstitutionsSearchComponent implements OnInit {
  this.actions.loadFilterOptions(event.filterType);
  }
 
+ onFilterSearchChanged(event: { filterType: string; searchText: string }): void {
+ if (event.searchText.trim()) {
+ this.actions.loadFilterOptionsWithSearch(event.filterType, event.searchText);
+ } else {
+ this.actions.clearFilterSearchResults(event.filterType);
+ }
+ }
+
+ onLoadMoreFilterOptions(event: { filterType: string; filter: DiscoverableFilter }): void {
+ this.actions.loadMoreFilterOptions(event.filterType);
+ }
+
  onFilterChanged(event: { filterType: string; value: string | null }): void {
  this.actions.updateFilterValue(event.filterType, event.value);
 

src/app/features/preprints/components/browse-by-subjects/browse-by-subjects.component.ts

@@ -6,7 +6,6 @@ import { Skeleton } from 'primeng/skeleton';
 import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';
 import { RouterLink } from '@angular/router';
 
-import { ResourceTab } from '@shared/enums';
 import { SubjectModel } from '@shared/models';
 
 @Component({
@@ -20,14 +19,8 @@ export class BrowseBySubjectsComponent {
  subjects = input.required<SubjectModel[]>();
  linksToSearchPageForSubject = computed(() => {
  return this.subjects().map((subject) => ({
- resourceTab: ResourceTab.Preprints,
- activeFilters: JSON.stringify([
- {
- filterName: 'Subject',
- label: subject.name,
- value: subject.iri,
- },
- ]),
+ tab: 'preprints',
+ filter_subject: subject.iri,
  }));
  });
  areSubjectsLoading = input.required<boolean>();

src/app/features/preprints/services/preprints-resource-filters.service.ts

@@ -6,7 +6,7 @@ import { inject, Injectable } from '@angular/core';
 
 import { PreprintsDiscoverSelectors } from '@osf/features/preprints/store/preprints-discover';
 import { PreprintsResourcesFiltersSelectors } from '@osf/features/preprints/store/preprints-resources-filters';
-import { ResourceFiltersStateModel } from '@osf/features/search/components/resource-filters/store';
+import { ProfileResourceFiltersStateModel } from '@osf/features/profile/components/profile-resource-filters/store';
 import { addFiltersParams, getResourceTypes } from '@osf/shared/helpers';
 import {
  Creator,
@@ -27,7 +27,9 @@ export class PreprintsFiltersOptionsService {
  filtersOptions = inject(FiltersOptionsService);
 
  private getFilterParams(): Record<string, string> {
- return addFiltersParams(select(PreprintsResourcesFiltersSelectors.getAllFilters)() as ResourceFiltersStateModel);
+ return addFiltersParams(
+ select(PreprintsResourcesFiltersSelectors.getAllFilters)() as ProfileResourceFiltersStateModel
+ );
  }
 
  private getParams(): Record<string, string> {

src/app/features/preprints/store/preprints-discover/preprints-discover.state.ts

@@ -14,7 +14,7 @@ import {
 } from '@osf/features/preprints/store/preprints-discover/preprints-discover.actions';
 import { PreprintsDiscoverStateModel } from '@osf/features/preprints/store/preprints-discover/preprints-discover.model';
 import { PreprintsResourcesFiltersSelectors } from '@osf/features/preprints/store/preprints-resources-filters';
-import { ResourceFiltersStateModel } from '@osf/features/search/components/resource-filters/store';
+import { ProfileResourceFiltersStateModel } from '@osf/features/profile/components/profile-resource-filters/store';
 import { addFiltersParams, getResourceTypes } from '@osf/shared/helpers';
 import { GetResourcesRequestTypeEnum, ResourceTab } from '@shared/enums';
 import { SearchService } from '@shared/services';
@@ -51,7 +51,7 @@ export class PreprintsDiscoverState implements NgxsOnInit {
  ctx.patchState({ resources: { ...state.resources, isLoading: true } });
  if (query.type === GetResourcesRequestTypeEnum.GetResources) {
  const filters = this.store.selectSnapshot(PreprintsResourcesFiltersSelectors.getAllFilters);
- const filtersParams = addFiltersParams(filters as ResourceFiltersStateModel);
+ const filtersParams = addFiltersParams(filters as ProfileResourceFiltersStateModel);
  const searchText = state.searchText;
  const sortBy = state.sortBy;
  const resourceTab = ResourceTab.Preprints;

src/app/features/profile/components/filters/store/profile-resource-filters-options.state.ts

@@ -4,8 +4,7 @@ import { tap } from 'rxjs';
 
 import { inject, Injectable } from '@angular/core';
 
-import { MyProfileFiltersOptionsService } from '@osf/features/profile/services';
-import { ResourceFiltersOptionsStateModel } from '@osf/features/search/components/filters/store';
+import { ProfileFiltersOptionsService } from '@osf/features/profile/services/profile-resource-filters.service';
 
 import {
  GetAllOptions,
@@ -36,10 +35,10 @@ import { ProfileResourceFiltersOptionsStateModel } from './profile-resource-filt
 @Injectable()
 export class ProfileResourceFiltersOptionsState {
  readonly store = inject(Store);
- readonly filtersOptionsService = inject(MyProfileFiltersOptionsService);
+ readonly filtersOptionsService = inject(ProfileFiltersOptionsService);
 
  @Action(GetDatesCreatedOptions)
- getDatesCreated(ctx: StateContext<ResourceFiltersOptionsStateModel>) {
+ getDatesCreated(ctx: StateContext<ProfileResourceFiltersOptionsStateModel>) {
  return this.filtersOptionsService.getDates().pipe(
  tap((datesCreated) => {
  ctx.patchState({ datesCreated: datesCreated });
@@ -48,7 +47,7 @@ export class ProfileResourceFiltersOptionsState {
  }
 
  @Action(GetFundersOptions)
- getFunders(ctx: StateContext<ResourceFiltersOptionsStateModel>) {
+ getFunders(ctx: StateContext<ProfileResourceFiltersOptionsStateModel>) {
  return this.filtersOptionsService.getFunders().pipe(
  tap((funders) => {
  ctx.patchState({ funders: funders });
@@ -57,7 +56,7 @@ export class ProfileResourceFiltersOptionsState {
  }
 
  @Action(GetSubjectsOptions)
- getSubjects(ctx: StateContext<ResourceFiltersOptionsStateModel>) {
+ getSubjects(ctx: StateContext<ProfileResourceFiltersOptionsStateModel>) {
  return this.filtersOptionsService.getSubjects().pipe(
  tap((subjects) => {
  ctx.patchState({ subjects: subjects });
@@ -66,7 +65,7 @@ export class ProfileResourceFiltersOptionsState {
  }
 
  @Action(GetLicensesOptions)
- getLicenses(ctx: StateContext<ResourceFiltersOptionsStateModel>) {
+ getLicenses(ctx: StateContext<ProfileResourceFiltersOptionsStateModel>) {
  return this.filtersOptionsService.getLicenses().pipe(
  tap((licenses) => {
  ctx.patchState({ licenses: licenses });
@@ -75,7 +74,7 @@ export class ProfileResourceFiltersOptionsState {
  }
 
  @Action(GetResourceTypesOptions)
- getResourceTypes(ctx: StateContext<ResourceFiltersOptionsStateModel>) {
+ getResourceTypes(ctx: StateContext<ProfileResourceFiltersOptionsStateModel>) {
  return this.filtersOptionsService.getResourceTypes().pipe(
  tap((resourceTypes) => {
  ctx.patchState({ resourceTypes: resourceTypes });
@@ -84,7 +83,7 @@ export class ProfileResourceFiltersOptionsState {
  }
 
  @Action(GetInstitutionsOptions)
- getInstitutions(ctx: StateContext<ResourceFiltersOptionsStateModel>) {
+ getInstitutions(ctx: StateContext<ProfileResourceFiltersOptionsStateModel>) {
  return this.filtersOptionsService.getInstitutions().pipe(
  tap((institutions) => {
  ctx.patchState({ institutions: institutions });
@@ -93,15 +92,15 @@ export class ProfileResourceFiltersOptionsState {
  }
 
  @Action(GetProvidersOptions)
- getProviders(ctx: StateContext<ResourceFiltersOptionsStateModel>) {
+ getProviders(ctx: StateContext<ProfileResourceFiltersOptionsStateModel>) {
  return this.filtersOptionsService.getProviders().pipe(
  tap((providers) => {
  ctx.patchState({ providers: providers });
  })
  );
  }
  @Action(GetPartOfCollectionOptions)
- getPartOfCollection(ctx: StateContext<ResourceFiltersOptionsStateModel>) {
+ getPartOfCollection(ctx: StateContext<ProfileResourceFiltersOptionsStateModel>) {
  return this.filtersOptionsService.getPartOtCollections().pipe(
  tap((partOfCollection) => {
  ctx.patchState({ partOfCollection: partOfCollection });

src/app/features/profile/components/profile-resource-filters/store/profile-resource-filters.selectors.ts

@@ -1,60 +1,60 @@
 import { Selector } from '@ngxs/store';
 
-import { ResourceFiltersStateModel } from '@osf/features/search/components/resource-filters/store';
 import { ResourceFilterLabel } from '@shared/models';
 
+import { ProfileResourceFiltersStateModel } from './profile-resource-filters.model';
 import { ProfileResourceFiltersState } from './profile-resource-filters.state';
 
 export class ProfileResourceFiltersSelectors {
  @Selector([ProfileResourceFiltersState])
- static getAllFilters(state: ResourceFiltersStateModel): ResourceFiltersStateModel {
+ static getAllFilters(state: ProfileResourceFiltersStateModel): ProfileResourceFiltersStateModel {
  return {
  ...state,
  };
  }
 
  @Selector([ProfileResourceFiltersState])
- static getCreator(state: ResourceFiltersStateModel): ResourceFilterLabel {
+ static getCreator(state: ProfileResourceFiltersStateModel): ResourceFilterLabel {
  return state.creator;
  }
 
  @Selector([ProfileResourceFiltersState])
- static getDateCreated(state: ResourceFiltersStateModel): ResourceFilterLabel {
+ static getDateCreated(state: ProfileResourceFiltersStateModel): ResourceFilterLabel {
  return state.dateCreated;
  }
 
  @Selector([ProfileResourceFiltersState])
- static getFunder(state: ResourceFiltersStateModel): ResourceFilterLabel {
+ static getFunder(state: ProfileResourceFiltersStateModel): ResourceFilterLabel {
  return state.funder;
  }
 
  @Selector([ProfileResourceFiltersState])
- static getSubject(state: ResourceFiltersStateModel): ResourceFilterLabel {
+ static getSubject(state: ProfileResourceFiltersStateModel): ResourceFilterLabel {
  return state.subject;
  }
 
  @Selector([ProfileResourceFiltersState])
- static getLicense(state: ResourceFiltersStateModel): ResourceFilterLabel {
+ static getLicense(state: ProfileResourceFiltersStateModel): ResourceFilterLabel {
  return state.license;
  }
 
  @Selector([ProfileResourceFiltersState])
- static getResourceType(state: ResourceFiltersStateModel): ResourceFilterLabel {
+ static getResourceType(state: ProfileResourceFiltersStateModel): ResourceFilterLabel {
  return state.resourceType;
  }
 
  @Selector([ProfileResourceFiltersState])
- static getInstitution(state: ResourceFiltersStateModel): ResourceFilterLabel {
+ static getInstitution(state: ProfileResourceFiltersStateModel): ResourceFilterLabel {
  return state.institution;
  }
 
  @Selector([ProfileResourceFiltersState])
- static getProvider(state: ResourceFiltersStateModel): ResourceFilterLabel {
+ static getProvider(state: ProfileResourceFiltersStateModel): ResourceFilterLabel {
  return state.provider;
  }
 
  @Selector([ProfileResourceFiltersState])
- static getPartOfCollection(state: ResourceFiltersStateModel): ResourceFilterLabel {
+ static getPartOfCollection(state: ProfileResourceFiltersStateModel): ResourceFilterLabel {
  return state.partOfCollection;
  }
 }

src/app/features/profile/profile.component.ts

@@ -10,7 +10,6 @@ import { toSignal } from '@angular/core/rxjs-interop';
 import { Router } from '@angular/router';
 
 import { UserSelectors } from '@osf/core/store/user';
-import { ResetFiltersState } from '@osf/features/search/components/resource-filters/store';
 import { ResetSearchState } from '@osf/features/search/store';
 import { EducationHistoryComponent, EmploymentHistoryComponent } from '@osf/shared/components';
 import { IS_MEDIUM } from '@osf/shared/helpers';
@@ -39,7 +38,6 @@ export class ProfileComponent implements OnDestroy {
  readonly isMedium = toSignal(inject(IS_MEDIUM));
  readonly currentUser = select(UserSelectors.getCurrentUser);
  readonly actions = createDispatchMap({
- resetFiltersState: ResetFiltersState,
  resetSearchState: ResetSearchState,
  setIsMyProfile: SetIsMyProfile,
  });
@@ -53,7 +51,6 @@ export class ProfileComponent implements OnDestroy {
  }
 
  ngOnDestroy(): void {
- this.actions.resetFiltersState();
  this.actions.resetSearchState();
  this.actions.setIsMyProfile(false);
  }

src/app/features/registries/store/registries-provider-search/registries-provider-search.state.ts

@@ -1,7 +1,7 @@
 import { Action, NgxsOnInit, State, StateContext } from '@ngxs/store';
 import { patch } from '@ngxs/store/operators';
 
-import { BehaviorSubject, catchError, EMPTY, forkJoin, of, switchMap, tap } from 'rxjs';
+import { BehaviorSubject, catchError, EMPTY, forkJoin, switchMap, tap } from 'rxjs';
 
 import { inject, Injectable } from '@angular/core';
 
@@ -141,7 +141,8 @@ export class RegistriesProviderSearchState implements NgxsOnInit {
  ctx.patchState({ filters: loadingFilters });
 
  return this.searchService.getFilterOptions(filterKey).pipe(
- tap((options) => {
+ tap((response) => {
+ const options = response.options;
  const updatedCache = { ...ctx.getState().filterOptionsCache, [filterKey]: options };
  const updatedFilters = ctx
  .getState()
@@ -189,14 +190,14 @@ export class RegistriesProviderSearchState implements NgxsOnInit {
 
  const observables = filterKeys.map((key) =>
  this.searchService.getFilterOptions(key).pipe(
- tap((options) => {
+ tap((response) => {
+ const options = response.options;
  const updatedCache = { ...ctx.getState().filterOptionsCache, [key]: options };
  const updatedFilters = ctx
  .getState()
  .filters.map((f) => (f.key === key ? { ...f, options, isLoaded: true, isLoading: false } : f));
  ctx.patchState({ filters: updatedFilters, filterOptionsCache: updatedCache });
- }),
- catchError(() => of({ filterKey: key, options: [] }))
+ })
  )
  );