Marmelator/red-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1.4k Wiki Activity

RED-3800: Improved main resolver / skeleton / loading / redirecting

Browse Source
This commit is contained in:
Adina Țeudan 2023-09-21 18:30:40 +03:00
parent f717775f24
commit d2c734b9a9
6 changed files with 63 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
apps/red-ui/src/app/app-routing.module.ts
View File

@ -1,5 +1,5 @@
import { AuthErrorComponent } from '@components/auth-error/auth-error.component';
import { CompositeRouteGuard, DEFAULT_REDIRECT_KEY, IqserPermissionsGuard, IqserRoutes } from '@iqser/common-ui';
import { CompositeRouteGuard, DEFAULT_REDIRECT_KEY, IqserPermissionsGuard, IqserRoutes, orderedAsyncGuards } from '@iqser/common-ui';
import { RedRoleGuard } from '@users/red-role.guard';
import { BaseScreenComponent } from '@components/base-screen/base-screen.component';
import { RouteReuseStrategy, RouterModule } from '@angular/router';
@ -16,7 +16,7 @@ import { ARCHIVE_ROUTE, BreadcrumbTypes, DOSSIER_ID, DOSSIER_TEMPLATE_ID, DOSSIE
import { DossierFilesGuard } from '@guards/dossier-files-guard';
import { webViewerLoadedGuard } from './modules/pdf-viewer/services/webviewer-loaded.guard';
import { Roles } from '@users/roles';
import { mainResolver } from '@utils/main.resolver';
import { mainGuard } from '@utils/main.resolver';
import { hasAnyRoleGuard, IqserAuthGuard } from '@iqser/common-ui/lib/users';
import { CustomRouteReuseStrategy } from '@iqser/common-ui/lib/utils';
import { ifLoggedIn } from '@guards/if-logged-in.guard';
@ -211,11 +211,8 @@ const routes: IqserRoutes = [
},
{
path: ':tenant/main',
canActivate: [ifLoggedIn()],
canActivate: [orderedAsyncGuards([ifLoggedIn(), mainGuard()])],
component: BaseScreenComponent,
resolve: {
whateverThisMainRouteNeeds: mainResolver,
},
children: mainRoutes,
},
{

10
apps/red-ui/src/app/app.component.html
View File

@ -3,3 +3,13 @@
<iqser-full-page-loading-indicator></iqser-full-page-loading-indicator>
<iqser-connection-status></iqser-connection-status>
<iqser-full-page-error></iqser-full-page-error>
<iqser-skeleton [templates]="{ dashboard: dashboardSkeleton, dossier: dossierSkeleton }"></iqser-skeleton>
<ng-template #dashboardSkeleton>
<redaction-dashboard-skeleton></redaction-dashboard-skeleton>
</ng-template>
<ng-template #dossierSkeleton>
<redaction-dossier-skeleton></redaction-dossier-skeleton>
</ng-template>

10
apps/red-ui/src/app/components/base-screen/base-screen.component.html
View File

@ -48,13 +48,3 @@
<router-outlet></router-outlet>
<redaction-pdf-viewer [style.visibility]="documentViewer.loaded() ? 'visible' : 'hidden'"></redaction-pdf-viewer>
<iqser-skeleton [templates]="{ dashboard: dashboardSkeleton, dossier: dossierSkeleton }"></iqser-skeleton>
<ng-template #dashboardSkeleton>
<redaction-dashboard-skeleton></redaction-dashboard-skeleton>
</ng-template>
<ng-template #dossierSkeleton>
<redaction-dossier-skeleton></redaction-dossier-skeleton>
</ng-template>

5
apps/red-ui/src/app/guards/if-logged-in.guard.ts
View File

@ -1,4 +1,4 @@
import { ActivatedRouteSnapshot, CanActivateFn, Router } from '@angular/router';
import { ActivatedRouteSnapshot, Router } from '@angular/router';
import { inject } from '@angular/core';
import { NGXLogger } from 'ngx-logger';
import { keycloakInitializer, KeycloakStatusService, TenantsService } from '@iqser/common-ui/lib/tenants';
@ -6,8 +6,9 @@ import { KeycloakService } from 'keycloak-angular';
import { UserService } from '@users/user.service';
import { LicenseService } from '@services/license.service';
import { RouterHistoryService } from '@services/router-history.service';
import { AsyncGuard } from '@iqser/common-ui';
export function ifLoggedIn(): CanActivateFn {
export function ifLoggedIn(): AsyncGuard {
return async (route: ActivatedRouteSnapshot) => {
const logger = inject(NGXLogger);
logger.info('[ROUTES] Check if can activate route', route);

79
apps/red-ui/src/app/utils/main.resolver.ts
View File

@ -1,6 +1,5 @@
import { inject } from '@angular/core';
import { ResolveFn } from '@angular/router';
import { IqserPermissionsService, LoadingService } from '@iqser/common-ui';
import { AsyncGuard, IqserPermissionsService, LoadingService } from '@iqser/common-ui';
import { TenantsService } from '@iqser/common-ui/lib/tenants';
import { BASE_HREF } from '@iqser/common-ui/lib/utils';
import { ConfigService } from '@services/config.service';
@ -13,47 +12,61 @@ import { UserPreferenceService } from '@users/user-preference.service';
import { NGXLogger } from 'ngx-logger';
import { firstValueFrom } from 'rxjs';
import { tap } from 'rxjs/operators';
import { Router, RouterStateSnapshot } from '@angular/router';
function redirectToLastDossierTemplate(baseHref: string, tenant: string, lastDossierTemplate: string) {
async function redirectToLastDossierTemplate(
router: Router,
state: RouterStateSnapshot,
baseHref: string,
tenant: string,
lastDossierTemplate: string,
) {
const lastUrlSegment = window.location.pathname.split('/').filter(Boolean).pop();
if (['main', tenant, baseHref].includes(lastUrlSegment)) {
window.location.assign(tenant + '/main/' + lastDossierTemplate);
if (['main', tenant, baseHref].includes(lastUrlSegment) && !state.url.includes(lastDossierTemplate)) {
await router.navigate([tenant, 'main', lastDossierTemplate]);
}
}
export const mainResolver: ResolveFn<void> = async () => {
const logger = inject(NGXLogger);
logger.info('[ROUTES] Main resolver started...');
export function mainGuard(): AsyncGuard {
return async (route, state) => {
const logger = inject(NGXLogger);
logger.info('[ROUTES] Main resolver started...');
inject(FeaturesService).loadConfig();
if (inject(IqserPermissionsService).has(Roles.dossiers.read)) {
inject(DossiersChangesService).initialize();
}
console.log('main guard');
const systemPreferencesService = inject(SystemPreferencesService);
const userPreferenceService = inject(UserPreferenceService);
const tenantsService = inject(TenantsService);
const loadingService = inject(LoadingService);
const configService = inject(ConfigService);
const baseHref = inject(BASE_HREF);
const router = inject(Router);
inject(FeaturesService).loadConfig();
if (inject(IqserPermissionsService).has(Roles.dossiers.read)) {
inject(DossiersChangesService).initialize();
}
const generalConfig$ = inject(GeneralSettingsService).getGeneralConfigurations();
const updatedDisplayName$ = generalConfig$.pipe(tap(config => configService.updateDisplayName(config.displayName)));
const systemPreferencesService = inject(SystemPreferencesService);
const userPreferenceService = inject(UserPreferenceService);
const tenantsService = inject(TenantsService);
const loadingService = inject(LoadingService);
const configService = inject(ConfigService);
const baseHref = inject(BASE_HREF);
await Promise.all([
systemPreferencesService.loadPreferencesIfNeeded(),
userPreferenceService.reload(),
firstValueFrom(updatedDisplayName$),
]);
const generalConfig$ = inject(GeneralSettingsService).getGeneralConfigurations();
const updatedDisplayName$ = generalConfig$.pipe(tap(config => configService.updateDisplayName(config.displayName)));
const lastDossierTemplate = userPreferenceService.getLastDossierTemplate();
await Promise.all([
systemPreferencesService.loadPreferencesIfNeeded(),
userPreferenceService.reload(),
firstValueFrom(updatedDisplayName$),
]);
if (lastDossierTemplate) {
redirectToLastDossierTemplate(baseHref, tenantsService.activeTenantId, lastDossierTemplate);
}
const lastDossierTemplate = userPreferenceService.getLastDossierTemplate();
loadingService.stop();
tenantsService.storeTenant();
if (lastDossierTemplate) {
await redirectToLastDossierTemplate(router, state, baseHref, tenantsService.activeTenantId, lastDossierTemplate);
}
logger.info('[ROUTES] Main resolver finished!');
};
loadingService.stop();
tenantsService.storeTenant();
logger.info('[ROUTES] Main resolver finished!');
return true;
};
}

2
libs/common-ui

@ -1 +1 @@
Subproject commit 2f2ee530b15e9e84dc28c3a23340cfb8b8b94319
Subproject commit 890cf417a1900eb882c61d335276360a48c9a54c