[Connect & Library | new-theme]:

1. projects-in-modal.module.ts: Imported DropdownFilterModule.
2. projects-in-modal.component.ts: Use common <dropdown-filter> instead of custom uk-button and uk-dropdown.
3. full-screen-modal.component.ts: [Bug fix] In ngOnDestroy added check for observer - error in ssr.
This commit is contained in:
Konstantina Galouni 2022-07-07 10:54:12 +03:00
parent b53d453785
commit fc5fcfaede
3 changed files with 18 additions and 19 deletions

View File

@ -14,23 +14,21 @@ import {OpenaireEntities} from '../../utils/properties/searchFields';
@Component({ @Component({
selector: 'projectsInModal', selector: 'projectsInModal',
template: ` template: `
<div *ngIf="fetchProjects.funders.length > 1" class="uk-margin-medium-bottom"> <div *ngIf="fetchProjects.funders.length > 1" class="uk-margin-medium-bottom">
<ng-container *ngFor="let filter of fetchProjects.filters"> <ng-container *ngFor="let filter of fetchProjects.filters">
<div class="uk-inline"> <div class="uk-inline">
<button class="uk-button uk-button-default uk-button-small uk-margin-small-bottom" type="button"> <dropdown-filter #dropdownFilter dropdownClass="uk-width-large uk-padding-small uk-margin-medium-bottom"
{{filter.title}}<span *ngIf="filter.countSelectedValues>0"> ({{filter.countSelectedValues}})</span> <span uk-icon="chevron-down"></span> [name]="filter.title" [count]="filter.countSelectedValues">
</button> <div class="uk-padding-small uk-overflow-auto uk-height-max-large uk-height-min-medium">
<div uk-dropdown="mode: click" class="uk-width-large uk-overflow-auto" style="max-width:460px !important; "> <search-filter [filter]="filter"
<div class="uk-padding-small uk-overflow-auto uk-height-max-large uk-height-min-medium"> [showResultCount]=true filterValuesNum="0"
<search-filter [filter]="filter" (onFilterChange)="filterChange($event)" [actionRoute]="false">
[showResultCount]=true filterValuesNum="0" </search-filter>
(onFilterChange)="filterChange($event)" [actionRoute]="false"> </div>
</search-filter> </dropdown-filter>
</div> </div>
</div> </ng-container>
</div> </div>
</ng-container>
</div>
<errorMessages [status]="[fetchProjects.searchUtils.status]" [type]="openaireEntities.PROJECTS" <errorMessages [status]="[fetchProjects.searchUtils.status]" [type]="openaireEntities.PROJECTS"
tab_error_class=true></errorMessages> tab_error_class=true></errorMessages>
<div *ngIf="fetchProjects.searchUtils.status == errorCodes.DONE"> <div *ngIf="fetchProjects.searchUtils.status == errorCodes.DONE">

View File

@ -13,13 +13,14 @@ import {ErrorMessagesModule} from '../../utils/errorMessages.module';
import {NoLoadPaging} from "../../searchPages/searchUtils/no-load-paging.module"; import {NoLoadPaging} from "../../searchPages/searchUtils/no-load-paging.module";
import {SearchResultsModule} from "../../searchPages/searchUtils/searchResults.module"; import {SearchResultsModule} from "../../searchPages/searchUtils/searchResults.module";
import {SearchFilterModule} from '../../searchPages/searchUtils/searchFilter.module'; import {SearchFilterModule} from '../../searchPages/searchUtils/searchFilter.module';
import {DropdownFilterModule} from "../../utils/dropdown-filter/dropdown-filter.module";
@NgModule({ @NgModule({
imports: [ imports: [
RouterModule, CommonModule, FormsModule, RouterModule, CommonModule, FormsModule,
ProjectsServiceModule, ProjectsServiceModule,
PagingModule, ErrorMessagesModule, NoLoadPaging, PagingModule, ErrorMessagesModule, NoLoadPaging,
SearchResultsModule, SearchFilterModule SearchResultsModule, SearchFilterModule, DropdownFilterModule
], ],
declarations: [ declarations: [
ProjectsInModalComponent ProjectsInModalComponent

View File

@ -99,7 +99,7 @@ export class FullScreenModalComponent implements AfterViewInit, OnDestroy {
} }
ngOnDestroy() { ngOnDestroy() {
if(this.observer instanceof ResizeObserver) { if(this.observer && this.observer instanceof ResizeObserver) {
this.observer.disconnect(); this.observer.disconnect();
} }
} }