Skip to content

Commit

Permalink
Rewrite search effects
Browse files Browse the repository at this point in the history
^ Conflicts:
^	libs/asset-viewer/src/lib/state/asset-search/asset-search.effects.ts
  • Loading branch information
daniel-va committed Nov 7, 2024
1 parent 517eab7 commit ca14713
Show file tree
Hide file tree
Showing 17 changed files with 278 additions and 297 deletions.
Original file line number Diff line number Diff line change
@@ -1,18 +1,18 @@
import { Component } from '@angular/core';
import { Router } from '@angular/router';
import { AuthStateService } from '@asset-sg/client-shared';
import { UntilDestroy } from '@ngneat/until-destroy';
import { AuthService } from '../../features/auth/auth.service';

@UntilDestroy()
@Component({
selector: 'asset-sg-redirect-to-lang',
template: 'Redirect to main page...',
})
export class RedirectToLangComponent {
constructor(router: Router, authService: AuthService) {
authService.isInitialized$.subscribe((isInitialized) => {
constructor(router: Router, authStateService: AuthStateService) {
authStateService.isInitialized$.subscribe((isInitialized) => {
if (isInitialized) {
router.navigate(['/de'], { queryParamsHandling: 'merge' });
router.navigate(['/de'], { queryParamsHandling: 'merge' }).then();
}
});
}
Expand Down
11 changes: 4 additions & 7 deletions apps/client-asset-sg/src/app/features/auth/auth.service.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import { HttpClient } from '@angular/common/http';
import { inject, Injectable } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { Router } from '@angular/router';
import { ApiError, appSharedStateActions, AppState } from '@asset-sg/client-shared';
import { ApiError, appSharedStateActions, AppState, AuthStateService } from '@asset-sg/client-shared';
import { ORD } from '@asset-sg/core';
import { User, UserSchema } from '@asset-sg/shared/v2';
import * as RD from '@devexperts/remote-data-ts';
Expand All @@ -22,7 +22,8 @@ export class AuthService {
private readonly dialogService = inject(MatDialog);

private readonly _state$ = new BehaviorSubject(AuthState.Ongoing);
private readonly _isInitialized$ = new BehaviorSubject(false);

private readonly stateService = inject(AuthStateService);

async initialize(oAuthConfig: Record<string, unknown>) {
if (oAuthConfig['anonymous_mode']) {
Expand All @@ -47,7 +48,7 @@ export class AuthService {
}
this.store.dispatch(appSharedStateActions.loadUserProfile());
}
this._isInitialized$.next(true);
this.stateService.markAsInitialized();
}

async signIn(): Promise<void> {
Expand Down Expand Up @@ -86,10 +87,6 @@ export class AuthService {
return this._state$.asObservable();
}

get isInitialized$(): Observable<boolean> {
return this._isInitialized$.asObservable();
}

setState(state: AuthState): void {
this._state$.next(state);
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,17 +4,14 @@
<ng-template #detail>
<div class="header">
<span translate="search.detailedInformation"></span>
<a
[routerLink]="['.']"
[queryParams]="{ assetId: undefined }"
(click)="resetAssetDetail()"
queryParamsHandling="merge"
<button
(click)="clearSelectedAsset()"
asset-sg-icon-button
class="close-button"
[attr.alt]="'search.closeAssetDetails' | translate"
>
<svg-icon key="close"></svg-icon>
</a>
</button>
</div>
<div class="asset-detail-scroll-container">
<div class="asset-detail">
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -39,8 +39,8 @@ export class AssetSearchDetailComponent {

public loadingState = this.store.select(selectAssetDetailLoadingState);

public resetAssetDetail() {
this.store.dispatch(actions.resetAssetDetail());
public clearSelectedAsset() {
this.store.dispatch(actions.clearSelectedAsset());
}

public searchForReferenceAsset(assetId: number) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ export class AssetSearchFilterListComponent<T> {
activeValues.add(filter.value);
}
this.store.dispatch(
actions.search({
actions.mergeQuery({
query: { [filter.queryKey]: activeValues.size > 0 ? [...activeValues] : undefined },
})
);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -93,7 +93,7 @@ export class AssetSearchRefineComponent implements OnInit, OnDestroy, AfterViewI
}

public removePolygon() {
this.store.dispatch(actions.removePolygon());
this.store.dispatch(actions.clearPolygon());
}

public toggleDrawPolygon() {
Expand All @@ -108,7 +108,7 @@ export class AssetSearchRefineComponent implements OnInit, OnDestroy, AfterViewI

public updateSearch(filterConfiguration: Partial<AssetSearchQuery>) {
if (this.isFiltersOpen) {
this.store.dispatch(actions.search({ query: filterConfiguration }));
this.store.dispatch(actions.mergeQuery({ query: filterConfiguration }));
}
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
{{ "search.searchResults" | translate }}:
<asset-sg-animate-number [nextValue]="(total$ | async) ?? 0" />
</div>
<button asset-sg-icon-button style="width: unset" (click)="toggleResultsOpen(isResultsOpen)">
<button asset-sg-icon-button style="width: unset" (click)="toggleResultsOpen()">
<span> {{ (isResultsOpen ? "search.hideTable" : "search.showTable") | translate }} </span>
<svg-icon [key]="isResultsOpen ? 'arrow-down' : 'arrow-up'"></svg-icon>
</button>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -68,8 +68,8 @@ export class AssetSearchResultsComponent implements OnInit, OnDestroy {
this._store.dispatch(actions.assetClicked({ assetId }));
}

public toggleResultsOpen(isCurrentlyOpen: boolean) {
this._store.dispatch(actions.manualToggleResult());
public toggleResultsOpen() {
this._store.dispatch(actions.toggleResults());
}

public onScroll(event: Event) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,13 @@ import {
ViewChild,
ViewContainerRef,
} from '@angular/core';
import { AppPortalService, AppState, LifecycleHooks, LifecycleHooksDirective } from '@asset-sg/client-shared';
import {
AppPortalService,
AppState,
AuthStateService,
LifecycleHooks,
LifecycleHooksDirective,
} from '@asset-sg/client-shared';
import { AssetEditDetail } from '@asset-sg/shared';
import { UntilDestroy, untilDestroyed } from '@ngneat/until-destroy';
import { Store } from '@ngrx/store';
Expand All @@ -22,13 +28,15 @@ import {
asyncScheduler,
combineLatest,
filter,
identity,
map,
Observable,
observeOn,
partition,
share,
Subject,
switchMap,
take,
withLatestFrom,
} from 'rxjs';

Expand Down Expand Up @@ -92,9 +100,14 @@ export class AssetViewerPageComponent implements OnInit, OnDestroy {
public assetsForPicker$: Observable<AssetEditDetail[]>;
public highlightedAssetId: number | null = null;

private readonly authStateService = inject(AuthStateService);

public ngOnInit() {
this._store.dispatch(actions.initializeSearch());
this._store.dispatch(actions.openFilters());

this.authStateService.isInitialized$.pipe(filter(identity), take(1)).subscribe(() => {
this._store.dispatch(actions.initialize());
});
this._appPortalService.setAppBarPortalContent(null);
}

Expand Down Expand Up @@ -154,8 +167,8 @@ export class AssetViewerPageComponent implements OnInit, OnDestroy {
.pipe(
map(
flow(
O.map((text) => actions.search({ query: { text } })),
O.getOrElseW(() => actions.clearSearchText())
O.map((text) => actions.mergeQuery({ query: { text } })),
O.getOrElseW(() => actions.mergeQuery({ query: { text: '' } }))
)
)
)
Expand Down
2 changes: 1 addition & 1 deletion libs/asset-viewer/src/lib/components/map/map.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -189,7 +189,7 @@ export class MapComponent implements AfterViewInit, OnChanges, OnDestroy {
)
.subscribe(([polygon, _]) =>
this.store.dispatch(
searchActions.search({
searchActions.mergeQuery({
query: { polygon: polygon },
})
)
Expand Down
12 changes: 6 additions & 6 deletions libs/asset-viewer/src/lib/services/asset-search.service.ts
Original file line number Diff line number Diff line change
Expand Up @@ -25,15 +25,15 @@ export class AssetSearchService {
);
}

public loadAssetDetailData(assetId: number): Observable<AssetEditDetail> {
public searchStats(searchQuery: AssetSearchQuery): Observable<AssetSearchStats> {
return this._httpClient
.get(`/api/asset-edit/${assetId}`)
.pipe(map((res) => (AssetEditDetail.decode(res) as E.Right<AssetEditDetail>).right));
.post('/api/assets/search/stats', searchQuery)
.pipe(map((res) => plainToInstance(AssetSearchStatsDTO, res)));
}

public updateSearchResultStats(searchQuery: AssetSearchQuery): Observable<AssetSearchStats> {
public fetchAssetEditDetail(assetId: number): Observable<AssetEditDetail> {
return this._httpClient
.post('/api/assets/search/stats', searchQuery)
.pipe(map((res) => plainToInstance(AssetSearchStatsDTO, res)));
.get(`/api/asset-edit/${assetId}`)
.pipe(map((res) => (AssetEditDetail.decode(res) as E.Right<AssetEditDetail>).right));
}
}
Original file line number Diff line number Diff line change
@@ -1,41 +1,53 @@
import { AssetEditDetail, AssetSearchQuery, AssetSearchResult, AssetSearchStats } from '@asset-sg/shared';
import { AssetId } from '@asset-sg/shared/v2';
import { createAction, props } from '@ngrx/store';
import { AllStudyDTOs } from '../../models';

export const initialize = createAction('[Asset Search] Initialize');
export const runInitialSearch = createAction(
'[Asset Search] Run Initial Search',
props<{
assetId: number | undefined;
query: AssetSearchQuery;
}>()
);
export const search = createAction(
'[Asset Search] Search',
props<{
query: Partial<AssetSearchQuery>;
query: AssetSearchQuery;
}>()
);
export const updateStats = createAction(
'[Asset Search] Update search stats',
export const mergeQuery = createAction(
'[Asset Search] Merge Query',
props<{
searchStats: AssetSearchStats;
query: AssetSearchQuery;
}>()
);
export const updateSearchResults = createAction(
'[Asset Search] Update search results',
export const executeSearch = createAction('[Asset Search] Execute Search', props<{ query: AssetSearchQuery }>());

export const updateResults = createAction(
'[Asset Search] Update Results',
props<{
searchResults: AssetSearchResult;
results: AssetSearchResult;
}>()
);
export const clearSearchText = createAction('[Asset Search] Clear search text');
export const resetSearch = createAction('[Asset Search] Reset Search');
export const removePolygon = createAction('[Asset Search] Remove polygon');
export const initializeSearch = createAction('[Asset Search] Initialize search');
export const assetClicked = createAction('[Asset Search] Asset clicked', props<{ assetId: number }>());
export const showAssetDetail = createAction('[Asset Search] Show Asset Detail', props<{ assetId: number }>());
export const updateAssetDetail = createAction(
'[Asset Search] Update Asset Detail',
props<{ assetDetail: AssetEditDetail }>()
export const updateStats = createAction(
'[Asset Search] Update Stats',
props<{
stats: AssetSearchStats;
}>()
);
export const resetAssetDetail = createAction('[Asset Search] Reset Asset Detail');
export const resetSearch = createAction('[Asset Search] Reset Search');

export const assetClicked = createAction('[Asset Search] Asset Clicked', props<{ assetId: number }>());
export const selectAsset = createAction('[Asset Search] Select Asset', props<{ assetId: AssetId }>());
export const setSelectedAsset = createAction('[Asset Search] Set Selected Asset', props<{ asset: AssetEditDetail }>());
export const clearSelectedAsset = createAction('[Asset Search] Clear Selected Asset');
export const clearPolygon = createAction('[Asset Search] Clear Polygon');
export const setStudies = createAction('[Asset Search] Set Studies', props<{ studies: AllStudyDTOs }>());

export const openFilters = createAction('[Asset Search] Open Filters');
export const closeFilters = createAction('[Asset Search] Close Filters');
export const openResults = createAction('[Asset Search] Open Results');
export const closeResults = createAction('[Asset Search] Close Results');
export const setStudies = createAction('[Asset Search] Load Studies', props<{ studies: AllStudyDTOs }>());
export const loadSearch = createAction('[Asset Search] Load Search', props<{ query: AssetSearchQuery }>());
export const updateQueryParams = createAction('[Asset Search] Update Query Params');
export const manualToggleResult = createAction('[Asset Search] Manual Toggle Params');
export const toggleResults = createAction('[Asset Search] Toggle Results');
Loading

0 comments on commit ca14713

Please sign in to comment.