After successfully creating a Resolver in my code, I am wondering if there is a way to refactor my TypeScript component. Currently, whenever I try to remove any unnecessary parts of the code, it breaks my app. Here is the code for my resolver:
@Injectable()
export class MatchTableListResolver implements Resolve<MatchTable[]> {
constructor(private readonly matchTablesService: MatchTablesService
) {}
resolve(route: ActivatedRouteSnapshot, _state: RouterStateSnapshot): Observable<MatchTable[]> {
console.log("inside resolver")
return this.matchTablesService.list().map(data => {
console.log("tata", data); return data});
}
}
Now, I would like to refactor my component.TS file as follows:
this.urlWatcher$ = this.route.data.pipe(
distinctUntilChanged(),
withLatestFrom(this.matchTables$),
map(([params, newMatchTables]) => {
this.page = 1;
this.startIndex = 0;
this.endIndex = 50;
const matchTableFromParam = newMatchTables.find(m => m.technicalName === params['id']);
if (matchTableFromParam) {
this.matchTableSelected = matchTableFromParam;
this.selectLines(this.startIndex, this.endIndex);
} else {
if(newMatchTables.length > 0) {
this.matchTableSelected = newMatchTables[0];
this.router.navigate(['/configuration/matchtables/' + this.matchTableSelected.technicalName]);
this.selectLines(this.startIndex, this.endIndex);
}
}
})
);
this.matchTableList$ = this.matchTablesService.list().pipe(
map(matchTables => {
matchTables = matchTables.sort((a, b) => a.name.toLocaleLowerCase() === b.name.toLocaleLowerCase() ? 0 : a.name.toLocaleLowerCase() < b.name.toLocaleLowerCase() ? -1 : 1);
this.matchTables$.next(matchTables);
}),
catchError( (error: HttpErrorResponse) => {
this.loadingError$.next(true);
return EMPTY;
})
);
concat(this.matchTableList$, this.urlWatcher$).subscribe();
Since I am now using:
this.listMatchTable = this.route.snapshot.data.listMatchTable;
I am not very familiar with resolvers, but since I am receiving data from it, perhaps I can simplify things and potentially eliminate the observables. I'm unsure where to begin this process.