Skip to content

Commit

Permalink
feat: remove collection filter
Browse files Browse the repository at this point in the history 
 - Fix #224
  • Loading branch information
@sebbousquet
sebbousquet committed Dec 17, 2024
1 parent 04917c5 commit 0ba9623
Show file tree
Hide file tree
Showing 4 changed files with 17 additions and 142 deletions.
2 changes: 1 addition & 1 deletion src/app/components/dashboard-search/dashboard-search.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ export class DashboardSearchComponent implements OnInit, OnDestroy{

public ngOnInit(): void {
this._searchSub = this.searchCtrl.valueChanges.pipe(
debounceTime(400),
debounceTime(300),
filter(v => v !== null ),
map((v: string) => this.search(v))
).subscribe();
Expand Down
17 changes: 0 additions & 17 deletions src/app/components/dynamic-hub/dynamic-hub.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,22 +38,5 @@ <h2>
{{ 'No dashboard available' | translate}}</div>
</div>
</div>


<div class="collection" *ngIf="cards?.size > 0">
<div class="collection-wrapper" [class.collection--without-edit-header]="!canCreateDashboard">
<h2>{{'Collections' | translate}}</h2>
<div class="cards">
<mat-card class="card" [style.borderLeftColor]="col.value.color"
[class.disabled]="!col.value.selected" (click)="getCheckbox(!col.value.selected, col.key)"
*ngFor="let col of cardCollections | keyvalue">
<mat-card-header>
{{col.key | getCollectionDisplayName | translate}}
</mat-card-header>
</mat-card>
<div class="scroll-hider"></div>
</div>
</div>
</div>
</div>
</div>
55 changes: 0 additions & 55 deletions src/app/components/dynamic-hub/dynamic-hub.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -88,61 +88,6 @@ h2 {
color: rgba(0, 0, 0, 0.7);
}
}
.collection {
flex: 1;

&-wrapper {
height: calc(100vh - ($top-menu-height + $header-height));
position: sticky;
width: 100%;
top: $header-height;
}

&--without-edit-header {
top: $header-height - 10px;
}

.cards {
padding-top: 1px;
height: calc(100% - 90px); // top menu height + dynamic hub header height + collection h2 height
overflow-x: hidden;
overflow-y: auto;
& .scroll-hider {
position: absolute;
background: #F5F5F5;
height: 100%;
top: 0;
right: 0;
width: 6px;
-webkit-transition: all .5s;
transition: all .5s;
opacity: 1;
}
&:hover .scroll-hider {
opacity: 0;
-webkit-transition: all .5s;
transition: all .5s;
}

.card {
margin: 4px 0px;
border-left: 3px solid;
border-radius: 0px;
padding: 8px 15px;
cursor: pointer;
box-shadow: none;

.mat-mdc-card-header {
padding: 0;
}

&.disabled {
border-color: whitesmoke !important;
color: rgba(0, 0, 0, 0.54);
}
}
}
}
}
}

Expand Down
85 changes: 16 additions & 69 deletions src/app/components/dynamic-hub/dynamic-hub.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,13 +50,10 @@ export class DynamicHubComponent implements OnInit {
public canCreateDashboardByOrg: Map<string, boolean>;
public allowedOrganisations: string[] = [];

public cardCollections = new Map<string, { color: string; selected: boolean; }>();
public canCreateDashboard = false;

public userGroups: string[] = [];

public selectedCollection: string[] = [];

public connected = false;
public isAuthentActivated: boolean;
public authentMode: 'openid' | 'iam';
Expand Down Expand Up @@ -88,7 +85,6 @@ export class DynamicHubComponent implements OnInit {
}

public ngOnInit(): void {
this.cardCollections.clear();

if (!this.isAuthentActivated) {
this.fetchCards();
Expand Down Expand Up @@ -131,17 +127,17 @@ export class DynamicHubComponent implements OnInit {
this.initSearch();
}

public initSearch(){
public initSearch() {
this.dashboardSearch.valueChanged$
.pipe(
tap(() => this.isLoading = true),
tap(() => this.isLoading = true),
debounceTime(500),
map((v) => {
this.filterDashboard(v);
this.isLoading = false;
})
)
.subscribe({error: () => this.isLoading = false});
.subscribe({ error: () => this.isLoading = false });
}

public add(org?: string) {
Expand Down Expand Up @@ -237,7 +233,7 @@ export class DynamicHubComponent implements OnInit {
}

public publicAtTheEnd = (a: KeyValue<string, Card[]>, b: KeyValue<string, Card[]>): number => {
if (a.key !== this.PUBLIC_ORG && b.key === this.PUBLIC_ORG ) {
if (a.key !== this.PUBLIC_ORG && b.key === this.PUBLIC_ORG) {
return -1;
}
if (a.key === this.PUBLIC_ORG && b.key !== this.PUBLIC_ORG) {
Expand Down Expand Up @@ -275,7 +271,7 @@ export class DynamicHubComponent implements OnInit {
));
this.cardsRef.set(o, cards);
i++;
this.applyCollectionFilter();
this.initFilter();
if (i === this.orgs.length) {
this.isLoading = false;
}
Expand All @@ -294,7 +290,7 @@ export class DynamicHubComponent implements OnInit {
next: (cards) => {
this.storeExternalOrganisationsCards(cards);
this.isLoading = false;
this.applyCollectionFilter();
this.initFilter();
}
});
}
Expand All @@ -320,8 +316,8 @@ export class DynamicHubComponent implements OnInit {
if (!publicCards) {
publicCards = [];
}
this.registerCollection(c);
c.preview$ = this.getPreview$(c.previewId,{});

c.preview$ = this.getPreview$(c.previewId, {});
this.addCard(c, publicCards);
this.cardsRef.set(publicOrg, publicCards);
}
Expand All @@ -336,11 +332,7 @@ export class DynamicHubComponent implements OnInit {

}

private registerCollection(c: Card) {
if (!this.cardCollections.has(c.collection)) {
this.cardCollections.set(c.collection, { color: c.color, selected: true });
}
}


private enrichCards(cards: Card[], fetchOptions?): Card[] {
cards.forEach(c => {
Expand All @@ -349,7 +341,7 @@ export class DynamicHubComponent implements OnInit {
.forEach(a => a.url = this.arlasSettingsService.getArlasWuiUrl());
c.actions.filter(a => a.type === ConfigActionEnum.EDIT)
.forEach(a => a.url = this.arlasSettingsService.getArlasBuilderUrl().concat('/load/'));
this.registerCollection(c);

c.preview$ = this.getPreview$(c.previewId, fetchOptions);
c.isPublic = c.readers.find(g => g.name === 'public') !== undefined;
});
Expand Down Expand Up @@ -378,30 +370,21 @@ export class DynamicHubComponent implements OnInit {
}
}

public applyCollectionFilter() {
if (this.selectedCollection.length > 0) {
const filteredMap = new Map<string, Card[]>();
this.cardsRef.forEach((values: Card[], key: string) => {
filteredMap.set(key, values.filter(c => this.selectedCollection.includes(c.collection)));
});
this.cards = filteredMap;
} else {
this.cards = this.cardsRef;
}

public initFilter() {
this.cards = this.cardsRef;
this.dashboardSearch.buildSearchIndex(this.cards);
this.filterDashboard(this.dashboardSearch.currentFilter);
}

public filterDashboard(searchValue: string, preserveEmptyCardList = false){
public filterDashboard(searchValue: string, preserveEmptyCardList = false) {
let previous;
if(searchValue){
if (searchValue) {
previous = this.cardsFiltered;
this.cardsFiltered = new Map<string, Card[]>();
this.dashboardSearch
.getMatchingSearchIndices()
.forEach(searchIndex => {
if(this.cardsFiltered.has(searchIndex.key)){
if (this.cardsFiltered.has(searchIndex.key)) {
this.cardsFiltered.get(searchIndex.key).push(this.cards.get(searchIndex.key)[searchIndex.cardIndex]);
} else {
this.cardsFiltered.set(searchIndex.key, [this.cards.get(searchIndex.key)[searchIndex.cardIndex]]);
Expand All @@ -411,49 +394,13 @@ export class DynamicHubComponent implements OnInit {
this.cardsFiltered = this.cards;
}

if(preserveEmptyCardList && this.cardsFiltered.size === 0){
if (preserveEmptyCardList && this.cardsFiltered.size === 0) {
previous.forEach((v, k) => {
this.cardsFiltered.set(k, []);
});
}
}

public getCheckbox(state: boolean, collectionKey: string) {
if (this.selectedCollection.length === 0) {
this.cardCollections.forEach(v => v.selected = false);
this.selectedCollection.push(collectionKey);
this.cardCollections.get(collectionKey).selected = true;
} else {
if (state) {
this.cardCollections.get(collectionKey).selected = true;
if (!this.selectedCollection.includes(collectionKey)) {
this.selectedCollection.push(collectionKey);
}
if (this.selectedCollection.length === this.cardCollections.size) {
this.selectedCollection = [];
}
} else {
this.selectedCollection = this.selectedCollection.filter(c => c !== collectionKey);
this.cardCollections.get(collectionKey).selected = false;
if (this.selectedCollection.length === 0) {
this.cardCollections.forEach(v => {
v.selected = true;
});
}
}
}
this.cards = this.cardsRef;
if (this.selectedCollection.length > 0) {
const filteredMap = new Map<string, Card[]>();
this.cards.forEach((values: Card[], key: string) => {
filteredMap.set(key, values.filter(c => this.selectedCollection.includes(c.collection)));
});
this.cards = filteredMap;
}
this.dashboardSearch.buildSearchIndex(this.cards);
this.filterDashboard(this.dashboardSearch.currentFilter, true);
}

public getAllowedOrganisations(): string[] {
return [...this.canCreateDashboardByOrg.entries()].filter(m => !!m[1]).map(m => m[0]);
}
Expand Down

0 comments on commit 0ba9623

Please sign in to comment.