misc: import aliases

angular.json

@@ -96,7 +96,10 @@
 					"defaultConfiguration": "production"
 				},
 				"test": {
-					"builder": "@analogjs/vitest-angular:test"
+					"builder": "@analogjs/vitest-angular:test",
+					"options": {
+						"viteConfigPath": "vite.config.mts"
+					}
 				},
 				"lint": {
 					"builder": "@angular-devkit/build-angular:tslint",

src/app/components/ad/ad.component.ts

@@ -1,9 +1,9 @@
 import { Component, OnInit, Input } from '@angular/core'
 import { DomSanitizer, SafeHtml } from '@angular/platform-browser'
 import { ModalController } from '@ionic/angular'
-import { SubscribePage } from 'src/app/pages/subscribe/subscribe.page'
-import AdUtils, { AdLocation } from 'src/app/utils/AdUtils'
-import { MerchantUtils } from 'src/app/utils/MerchantUtils'
+import { SubscribePage } from '@pages/subscribe/subscribe.page'
+import AdUtils, { AdLocation } from '@utils/AdUtils'
+import { MerchantUtils } from '@utils/MerchantUtils'
 
 @Component({
 	selector: 'app-ad',

src/app/components/block/block.component.ts

@@ -1,10 +1,10 @@
 import { Component, Input } from '@angular/core'
 import * as blockies from 'ethereum-blockies'
-import { UnitconvService } from 'src/app/services/unitconv.service'
-import { ETHPOOL, ROCKETPOOL_SMOOTHING_POOL } from 'src/app/utils/BlockUtils'
+import { UnitconvService } from '@services/unitconv.service'
+import { ETHPOOL, ROCKETPOOL_SMOOTHING_POOL } from '@utils/BlockUtils'
 import BigNumber from 'bignumber.js'
-import { VDBBlocksTableRow } from 'src/app/requests/types/validator_dashboard'
-import { slotToSecondsTimestamp } from 'src/app/utils/TimeUtils'
+import { VDBBlocksTableRow } from '@requests/types/validator_dashboard'
+import { slotToSecondsTimestamp } from '@utils/TimeUtils'
 
 @Component({
 	selector: 'app-block',

src/app/components/dashboard-item/dashboard-item.component.ts

@@ -2,15 +2,15 @@ import { CommonModule } from '@angular/common'
 import { Component, computed, effect, EventEmitter, Input, OnChanges, Output, WritableSignal } from '@angular/core'
 import { Toast } from '@capacitor/toast'
 import { AlertController, IonicModule } from '@ionic/angular'
-import { ValidatorDashboard } from 'src/app/requests/types/dashboard'
-import { dashboardID, V2ChangeDashboardName, V2DeleteDashboard } from 'src/app/requests/v2-dashboard'
-import { AlertService } from 'src/app/services/alert.service'
-import { ApiService } from 'src/app/services/api.service'
-import { StorageService } from 'src/app/services/storage.service'
-import { DashboardUtils } from 'src/app/utils/DashboardUtils'
-import { MerchantUtils } from 'src/app/utils/MerchantUtils'
-import { findChainNetworkById } from 'src/app/utils/NetworkData'
-import { ValidatorUtils } from 'src/app/utils/ValidatorUtils'
+import { ValidatorDashboard } from '@requests/types/dashboard'
+import { dashboardID, V2ChangeDashboardName, V2DeleteDashboard } from '@requests/v2-dashboard'
+import { AlertService } from '@services/alert.service'
+import { ApiService } from '@services/api.service'
+import { StorageService } from '@services/storage.service'
+import { DashboardUtils } from '@utils/DashboardUtils'
+import { MerchantUtils } from '@utils/MerchantUtils'
+import { findChainNetworkById } from '@utils/NetworkData'
+import { ValidatorUtils } from '@utils/ValidatorUtils'
 import { Clipboard } from '@capacitor/clipboard'
 import { changeNetwork } from 'src/app/tabs/tab-preferences/tab-preferences.page'
 import { UnitconvService } from '@services/unitconv.service'

src/app/components/dashboard/dashboard.component.ts

@@ -22,18 +22,18 @@ import { UnitconvService } from '@services/unitconv.service'
 import { ApiService } from '@services/api.service'
 import { OverviewData2 } from '../../controllers/OverviewController'
 import { Release } from '@utils/ClientUpdateUtils'
-import ThemeUtils from 'src/app/utils/ThemeUtils'
-import { StorageService } from 'src/app/services/storage.service'
+import ThemeUtils from '@utils/ThemeUtils'
+import { StorageService } from '@services/storage.service'
 import confetti from 'canvas-confetti'
 import { Browser } from '@capacitor/browser'
 import { ModalController, Platform } from '@ionic/angular'
-import { SubscribePage } from 'src/app/pages/subscribe/subscribe.page'
-import { MerchantUtils } from 'src/app/utils/MerchantUtils'
-import { ValidatorUtils } from 'src/app/utils/ValidatorUtils'
-import FirebaseUtils from 'src/app/utils/FirebaseUtils'
-import { endEpochSyncCommittee, slotToEpoch, startEpochSyncCommittee } from 'src/app/utils/MathUtils'
-import { epochToTimestamp, getLocale } from 'src/app/utils/TimeUtils'
-import { Period, setID } from 'src/app/requests/v2-dashboard'
+import { SubscribePage } from '@pages/subscribe/subscribe.page'
+import { MerchantUtils } from '@utils/MerchantUtils'
+import { ValidatorUtils } from '@utils/ValidatorUtils'
+import FirebaseUtils from '@utils/FirebaseUtils'
+import { endEpochSyncCommittee, slotToEpoch, startEpochSyncCommittee } from '@utils/MathUtils'
+import { epochToTimestamp, getLocale } from '@utils/TimeUtils'
+import { Period, setID } from '@requests/v2-dashboard'
 import { getSuccessFailMode, Mode } from './success-fail-view/success-fail-view.component'
 import { DashboardUtils } from '@utils/DashboardUtils'
 import { formatAddress } from '@utils/Formatting'

src/app/components/dashboard/dashboard.module.ts

@@ -36,7 +36,7 @@ import { SummaryChartModule } from './summary-chart/summary-chart.module'
 import { RewardChartModule } from './reward-chart/reward-chart.module'
 import { FullPageLoadingComponent } from '../full-page-loading/full-page-loading.component'
 import { FullPageOfflineComponent } from '../full-page-offline/full-page-offline.component'
-import { FirebaseUtilsModule } from 'src/app/utils/Firebase.module'
+import { FirebaseUtilsModule } from '@utils/Firebase.module'
 import { GroupSelectorComponent } from './group-selector/group-selector.component'
 import { SlotvizWidgetComponent } from '@components/slotviz-widget/slotviz-widget.component'
 import { ClientupdateComponent } from '@components/clientupdate/clientupdate.component'

src/app/components/dashboard/performance-item/performance-item.component.ts

@@ -18,8 +18,8 @@
  */
 
 import { Component, Input } from '@angular/core'
-import { Performance } from 'src/app/controllers/OverviewController'
-import { Currency, UnitconvService } from 'src/app/services/unitconv.service'
+import { Performance } from '@controllers/OverviewController'
+import { Currency, UnitconvService } from '@services/unitconv.service'
 
 @Component({
 	selector: 'app-performance-item',

src/app/components/dashboard/reward-chart/reward-chart.component.ts

@@ -1,13 +1,13 @@
 import { Component, computed, Input } from '@angular/core'
-import { OverviewData2 } from 'src/app/controllers/OverviewController'
-import { ChartSeries } from 'src/app/requests/types/common'
-import { ApiService } from 'src/app/services/api.service'
-import { epochToTimestamp, formatTsToAbsolute, formatTsToDateTime, getLocale } from 'src/app/utils/TimeUtils'
+import { OverviewData2 } from '@controllers/OverviewController'
+import { ChartSeries } from '@requests/types/common'
+import { ApiService } from '@services/api.service'
+import { epochToTimestamp, formatTsToAbsolute, formatTsToDateTime, getLocale } from '@utils/TimeUtils'
 import { fontSize, getTooltipHeader } from '../summary-chart/summary-chart.component'
 import BigNumber from 'bignumber.js'
-import { getChartTextColor, getChartTooltipBackgroundColor, getRewardChartColors, getRewardsChartLineColor } from 'src/app/utils/ColorUtils'
-import { Currency, UnitconvService } from 'src/app/services/unitconv.service'
-import { Aggregation } from 'src/app/requests/v2-dashboard'
+import { getChartTextColor, getChartTooltipBackgroundColor, getRewardChartColors, getRewardsChartLineColor } from '@utils/ColorUtils'
+import { Currency, UnitconvService } from '@services/unitconv.service'
+import { Aggregation } from '@requests/v2-dashboard'
 import { EChartsOption } from 'echarts'
 
 @Component({

src/app/components/dashboard/success-fail-view/success-fail-view.component.ts

@@ -1,8 +1,8 @@
 import { CommonModule } from '@angular/common'
 import { Component, computed, Input, WritableSignal } from '@angular/core'
 import { IonLabel, IonItem } from '@ionic/angular/standalone'
-import { PipesModule } from 'src/app/pipes/pipes.module'
-import { StorageService } from 'src/app/services/storage.service'
+import { PipesModule } from '@pipes/pipes.module'
+import { StorageService } from '@services/storage.service'
 
 @Component({
 	selector: 'app-success-fail-view',

src/app/components/dashboard/summary-chart/summary-chart.component.ts

@@ -1,11 +1,11 @@
 import { Component, computed, Input, OnInit } from '@angular/core'
 import { Toast } from '@capacitor/toast'
-import { OverviewData2, OverviewProvider } from 'src/app/controllers/OverviewController'
-import { ChartData } from 'src/app/requests/types/common'
-import { Aggregation, V2DashboardSummaryChart } from 'src/app/requests/v2-dashboard'
-import { AlertService } from 'src/app/services/alert.service'
-import { getChartTextColor, getChartTooltipBackgroundColor, getSummaryChartGroupColors } from 'src/app/utils/ColorUtils'
-import { MerchantUtils } from 'src/app/utils/MerchantUtils'
+import { OverviewData2, OverviewProvider } from '@controllers/OverviewController'
+import { ChartData } from '@requests/types/common'
+import { Aggregation, V2DashboardSummaryChart } from '@requests/v2-dashboard'
+import { AlertService } from '@services/alert.service'
+import { getChartTextColor, getChartTooltipBackgroundColor, getSummaryChartGroupColors } from '@utils/ColorUtils'
+import { MerchantUtils } from '@utils/MerchantUtils'
 import {
 	formatGoTimestamp,
 	formatTsToDateTime,
@@ -17,10 +17,10 @@ import {
 	ONE_WEEK,
 	slotToSecondsTimestamp,
 	timestampToEpoch,
-} from 'src/app/utils/TimeUtils'
+} from '@utils/TimeUtils'
 import { get } from 'lodash-es'
 import { ECharts, EChartsOption } from 'echarts'
-import { StorageService } from 'src/app/services/storage.service'
+import { StorageService } from '@services/storage.service'
 
 const currentZoom = {
 	end: 100,

src/app/components/full-page-loading/full-page-loading.component.spec.ts

@@ -0,0 +1,94 @@
+/// <reference types="vitest" />
+import { ComponentFixture, TestBed, fakeAsync, tick } from '@angular/core/testing'
+import { FullPageLoadingComponent } from './full-page-loading.component'
+import { NoopAnimationsModule } from '@angular/platform-browser/animations'
+
+describe('FullPageLoadingComponent', () => {
+	let component: FullPageLoadingComponent
+	let fixture: ComponentFixture<FullPageLoadingComponent>
+
+	beforeEach(async () => {
+		await TestBed.configureTestingModule({
+			imports: [FullPageLoadingComponent, NoopAnimationsModule],
+		}).compileComponents()
+
+		fixture = TestBed.createComponent(FullPageLoadingComponent)
+		component = fixture.componentInstance
+	})
+
+	it('should not show loading immediately when loading is true and then show it after SKIP_LOADING_IF_FASTER_THAN ms', fakeAsync(() => {
+		// Instead of calling fixture.detectChanges(), call ngOnChanges() manually
+		component.loading = true
+		component.ngOnChanges() // simulate the one-time change
+
+		// Immediately after, reset() was called so showLoading remains false.
+		expect(component.showLoading).toBe(false)
+
+		// Advance time past SKIP_LOADING_IF_FASTER_THAN (here using 35ms as a buffer).
+		tick(35)
+		// The setTimeout callback should now have run and, since loading is still true,
+		// set showLoading to true (it also calls cdr.detectChanges(), so we don't trigger extra change detection).
+		expect(component.showLoading).toBe(true)
+	}))
+
+	it('should skip showing the loading screen if loading becomes false quickly', fakeAsync(() => {
+		// Start with loading true and call ngOnChanges once.
+		component.loading = true
+		component.ngOnChanges()
+		tick(20)
+
+		// Now simulate that loading becomes false quickly.
+		component.loading = false
+		// Call ngOnChanges again to simulate the input change.
+		component.ngOnChanges()
+
+		// Advance time to flush the pending timeout.
+		tick(31)
+		// In the "else" branch of ngOnChanges, loadingDoneStartPreRender() is called,
+		// which sets showContent to true and ensures showLoading stays false.
+		expect(component.showLoading).toBe(false)
+		expect(component.showContent).toBe(true)
+
+		// Because the real animation callbacks aren’t triggered in test mode (using NoopAnimationsModule),
+		// manually simulate the animation finish.
+		component.onLoadingAnimationDone()
+		tick(component.renderWait)
+		expect(component.fadeInComplete).toBe('done')
+	}))
+
+	it('should emit fadeInCompleted event after loading animation is done', fakeAsync(() => {
+		const fadeInSpy = vi.spyOn(component.fadeInCompleted, 'emit')
+
+		// For immediate loading completion, set loading to false and call ngOnChanges.
+		component.loading = false
+		component.ngOnChanges()
+
+		tick(31)
+		// Manually simulate the animation callback.
+		component.onLoadingAnimationDone()
+		tick(component.renderWait)
+
+		expect(fadeInSpy).toHaveBeenCalled()
+	}))
+
+	it('should reset the component state when reset() is called', () => {
+		// Set some non-default state.
+		component.showContent = true
+		component.fadeInComplete = 'done'
+		component.showLoading = true
+
+		// Call reset().
+		component.reset()
+
+		// Verify that state is reset to its initial values.
+		expect(component.showContent).toBe(false)
+		expect(component.fadeInComplete).toBe('wait')
+		expect(component.showLoading).toBe(false)
+	})
+
+	it('onLoadingAnimationStart should mark that loading animation has started', () => {
+		component.onLoadingAnimationStart()
+		const loadingAnimationStarted = (component as any).loadingAnimationStarted
+		expect(loadingAnimationStarted).toBe(true)
+	})
+})

src/app/components/help/help.component.ts

@@ -19,10 +19,10 @@
 
 import { Component, OnInit, Input } from '@angular/core'
 import { Router } from '@angular/router'
-import { StorageService } from 'src/app/services/storage.service'
-import { OAuthUtils } from 'src/app/utils/OAuthUtils'
+import { StorageService } from '@services/storage.service'
+import { OAuthUtils } from '@utils/OAuthUtils'
 import { Browser } from '@capacitor/browser'
-import { ApiService } from 'src/app/services/api.service'
+import { ApiService } from '@services/api.service'
 
 @Component({
 	selector: 'app-help',

src/app/components/machinechart/machinechart.component.ts

@@ -1,9 +1,9 @@
 import { Component, Input, OnInit, SimpleChanges } from '@angular/core'
-import { highChartOptions } from 'src/app/utils/HighchartOptions'
+import { highChartOptions } from '@utils/HighchartOptions'
 import * as HighCharts from 'highcharts'
 import * as Highstock from 'highcharts/highstock'
-import { MachineChartData } from 'src/app/controllers/MachineController'
-import { ApiService } from 'src/app/services/api.service'
+import { MachineChartData } from '@controllers/MachineController'
+import { ApiService } from '@services/api.service'
 
 @Component({
 	selector: 'app-machinechart',

src/app/components/message/message.component.ts

@@ -19,12 +19,12 @@
 
 import { Component, OnInit, Input } from '@angular/core'
 import { AlertController } from '@ionic/angular'
-import { StorageService } from 'src/app/services/storage.service'
+import { StorageService } from '@services/storage.service'
 import confetti from 'canvas-confetti'
 
 import { Browser } from '@capacitor/browser'
 import { Output, EventEmitter } from '@angular/core'
-import FirebaseUtils from 'src/app/utils/FirebaseUtils'
+import FirebaseUtils from '@utils/FirebaseUtils'
 
 @Component({
 	selector: 'app-message',

src/app/components/message/message.module.ts

@@ -24,7 +24,7 @@ import { FormsModule } from '@angular/forms'
 import { IonicModule } from '@ionic/angular'
 
 import { MessageComponent } from './message.component'
-import { FirebaseUtilsModule } from 'src/app/utils/Firebase.module'
+import { FirebaseUtilsModule } from '@utils/Firebase.module'
 
 @NgModule({
 	imports: [CommonModule, FormsModule, IonicModule, FirebaseUtilsModule],

src/app/components/validator/validator.component.ts

@@ -19,7 +19,7 @@
 
 import { Component, Input } from '@angular/core'
 import * as blockies from 'ethereum-blockies'
-import { getDisplayName, ValidatorState } from 'src/app/utils/ValidatorUtils'
+import { getDisplayName, ValidatorState } from '@utils/ValidatorUtils'
 import { UnitconvService } from '@services/unitconv.service'
 import { MobileValidatorDashboardValidatorsTableRow } from '@requests/types/mobile'
 

src/app/modals/dashboard-and-group-select/dashboard-and-group-select.component.ts

@@ -1,26 +1,26 @@
 import { Component, computed, effect, Input, OnInit, signal, WritableSignal } from '@angular/core'
 import { AlertController, IonicModule, ModalController } from '@ionic/angular'
-import { UserDashboardsData, ValidatorDashboard } from 'src/app/requests/types/dashboard'
-import { V2MyDashboards } from 'src/app/requests/v2-user'
-import { ApiService, capitalize } from 'src/app/services/api.service'
+import { UserDashboardsData, ValidatorDashboard } from '@requests/types/dashboard'
+import { V2MyDashboards } from '@requests/v2-user'
+import { ApiService, capitalize } from '@services/api.service'
 import { DashboardItemComponent, LegacyAdd } from '@components/dashboard-item/dashboard-item.component'
 import { CommonModule } from '@angular/common'
-import { dashboardID, V2CreateDashboard, V2DashboardOverview } from 'src/app/requests/v2-dashboard'
-import { AlertService, DASHBOARD_SELECTOR } from 'src/app/services/alert.service'
+import { dashboardID, V2CreateDashboard, V2DashboardOverview } from '@requests/v2-dashboard'
+import { AlertService, DASHBOARD_SELECTOR } from '@services/alert.service'
 import { Toast } from '@capacitor/toast'
-import { MerchantUtils } from 'src/app/utils/MerchantUtils'
-import { StorageService } from 'src/app/services/storage.service'
-import { DashboardUtils } from 'src/app/utils/DashboardUtils'
-import { OAuthUtils } from 'src/app/utils/OAuthUtils'
-import { SubscribePage } from 'src/app/pages/subscribe/subscribe.page'
+import { MerchantUtils } from '@utils/MerchantUtils'
+import { StorageService } from '@services/storage.service'
+import { DashboardUtils } from '@utils/DashboardUtils'
+import { OAuthUtils } from '@utils/OAuthUtils'
+import { SubscribePage } from '@pages/subscribe/subscribe.page'
 import { FullPageLoadingComponent } from '@components/full-page-loading/full-page-loading.component'
-import { CHAIN_NETWORKS, findChainNetworkById, findChainNetworkByName } from 'src/app/utils/NetworkData'
+import { CHAIN_NETWORKS, findChainNetworkById, findChainNetworkByName } from '@utils/NetworkData'
 import { fromEvent, Subscription } from 'rxjs'
 import { FullPageOfflineComponent } from '@components/full-page-offline/full-page-offline.component'
 import { OfflineComponentModule } from '@components/offline/offline.module'
-import { ValidatorUtils } from 'src/app/utils/ValidatorUtils'
-import { getValidatorCount } from 'src/app/controllers/OverviewController'
-import { APIUnauthorizedError } from 'src/app/requests/requests'
+import { ValidatorUtils } from '@utils/ValidatorUtils'
+import { getValidatorCount } from '@controllers/OverviewController'
+import { APIUnauthorizedError } from '@requests/requests'
 import { SHOW_TESTNETS_CONFIG } from 'src/app/tabs/tab-preferences/tab-preferences.page'
 import { UserInfo } from '@requests/types/user'
 

src/app/pages/block-detail/block-detail.module.ts

@@ -7,7 +7,7 @@ import { IonicModule } from '@ionic/angular'
 import { BlockDetailPageRoutingModule } from './block-detail-routing.module'
 
 import { BlockDetailPage } from './block-detail.page'
-import { PipesModule } from 'src/app/pipes/pipes.module'
+import { PipesModule } from '@pipes/pipes.module'
 import { FullPageLoadingComponent } from '@components/full-page-loading/full-page-loading.component'
 import { FullPageOfflineComponent } from '@components/full-page-offline/full-page-offline.component'