Optimized bundle: improved components and cleaned modules

angular.json

@@ -54,12 +54,12 @@
               "sourceMap": false,
               "namedChunks": false,
               "extractLicenses": true,
-              "vendorChunk": false,
+              "vendorChunk": true,
               "buildOptimizer": true,
               "budgets": [
                 {
                   "type": "initial",
-                  "maximumWarning": "3mb",
+                  "maximumWarning": "2mb",
                   "maximumError": "5mb"
                 },
                 {
@@ -84,12 +84,12 @@
               "sourceMap": false,
               "namedChunks": false,
               "extractLicenses": true,
-              "vendorChunk": false,
+              "vendorChunk": true,
               "buildOptimizer": true,
               "budgets": [
                 {
                   "type": "initial",
-                  "maximumWarning": "3mb",
+                  "maximumWarning": "2mb",
                   "maximumError": "5mb"
                 },
                 {

src/app/dashboard-module/dashboard.module.ts

@@ -1,22 +1,11 @@
 import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
 
 import { DashboardRoutingModule } from './dashboard.routing';
-import { AppMaterialModule } from '../shared/app-material.module';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
-import { ToasterModule } from '../_helpers/toaster/toaster.module';
 import { DomainRouteService } from '../services/domain-route.service';
 
 @NgModule({
     imports: [
-        FormsModule,
-        CommonModule,
-        NgbModule,
-        ReactiveFormsModule,
         DashboardRoutingModule,
-        AppMaterialModule,
-        ToasterModule
     ],
     providers: [
         DomainRouteService

src/app/dashboard-module/domain-module/domain.module.ts

@@ -1,95 +1,17 @@
 import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { DomainComponent } from './domain/domain.component';
 
 import { DomainRoutingModule } from './domain.routing';
-import { DomainDetailComponent } from './domain-detail/domain-detail.component';
-import { ChangelogComponent } from './changelog/changelog.component';
-import { ComponentsComponent, ComponentEditDialogComponent } from './components/components.component';
-import { EnvironmentsComponent } from './environments/environments.component';
-import { GroupListComponent } from './group/group-list/group-list.component';
-import { GroupPreviewComponent } from './group/group-preview/group-preview.component';
-import { GroupDetailComponent } from './group/group-detail/group-detail.component';
 
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { ClipboardModule } from '@angular/cdk/clipboard';
-import { ConfigListComponent } from './config/config-list/config-list.component';
-import { ConfigPreviewComponent } from './config/config-preview/config-preview.component';
-import { ConfigDetailComponent } from './config/config-detail/config-detail.component';
-import { StrategyDetailComponent, ChangeLogDialogComponent } from './config/strategy-detail/strategy-detail.component';
-import { StrategyListComponent } from './config/strategy-list/strategy-list.component';
-import { EnvironmentConfigComponent } from './environment-config/environment-config.component';
-import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
-import { GroupCreateComponent } from './group/group-create/group-create.component';
-import { ConfigCreateComponent } from './config/config-create/config-create.component';
-import { ToasterModule } from 'src/app/_helpers/toaster/toaster.module';
-import { NgbdModalConfirmComponent } from 'src/app/_helpers/confirmation-dialog';
-import { StrategyCreateComponent } from './config/strategy-create/strategy-create.component';
-import { StrategyCloneComponent } from './config/strategy-clone/strategy-clone.component';
-import { BaseChartDirective } from '../../../libs/ng2-charts/src/lib/base-chart.directive';
-import { DomainSnapshotComponent } from './domain/domain-snapshot/domain-snapshot.component';
-import { TeamInviteDialogComponent } from './team-module/team-invite-dialog/team-invite-dialog.component';
 import { DomainRouteService } from 'src/app/services/domain-route.service';
-import { DomainTransferDialogComponent } from './domain/domain-transfer/domain-transfer-dialog.component';
-import { MetricModule } from './metric-module/metric.module';
-import { SpecialCharacterDirective } from './common/special.char.directive';
-import { AppMaterialModule } from 'src/app/shared/app-material.module';
-import { RelayDetailComponent, RelayVerificationDialogComponent } from './config/relay-detail/relay-detail.component';
-import { ExtSlackComponent } from './ext-slack/ext-slack.component';
-import { SlackSettingsComponent } from './ext-slack/slack-settings/slack-settings.component';
-import { ExtGitOpsComponent } from './ext-gitops/ext-gitops.component';
-import { GitOpsEnvSelectionComponent } from './ext-gitops/gitops-env-selection/gitops-env-selection.component';
-import { GitOpsUpdateTokensComponent } from './ext-gitops/gitops-update-tokens/gitops-update-tokens.component';
-import { BlockUIComponent } from 'src/app/shared/block-ui/block-ui.component';
+import { DatePipe } from '@angular/common';
 
 @NgModule({
     imports: [
-        BlockUIComponent,
-        FormsModule,
-        ReactiveFormsModule,
-        NgbModule,
-        CommonModule,
-        ClipboardModule,
-        DomainRoutingModule,
-        AppMaterialModule,
-        ToasterModule,
-        BaseChartDirective,
-        MetricModule,
-        DomainComponent,
-        DomainDetailComponent,
-        ChangelogComponent,
-        ComponentsComponent,
-        EnvironmentsComponent,
-        GroupListComponent,
-        GroupPreviewComponent,
-        GroupDetailComponent,
-        ConfigListComponent,
-        ConfigPreviewComponent,
-        ConfigDetailComponent,
-        RelayDetailComponent,
-        StrategyDetailComponent,
-        StrategyListComponent,
-        EnvironmentConfigComponent,
-        GroupCreateComponent,
-        ConfigCreateComponent,
-        NgbdModalConfirmComponent,
-        StrategyCreateComponent,
-        StrategyCloneComponent,
-        ComponentEditDialogComponent,
-        TeamInviteDialogComponent,
-        ChangeLogDialogComponent,
-        RelayVerificationDialogComponent,
-        DomainSnapshotComponent,
-        DomainTransferDialogComponent,
-        SpecialCharacterDirective,
-        ExtSlackComponent,
-        SlackSettingsComponent,
-        ExtGitOpsComponent,
-        GitOpsEnvSelectionComponent,
-        GitOpsUpdateTokensComponent
+        DomainRoutingModule
     ],
     providers: [
-        DomainRouteService
+        DomainRouteService,
+        DatePipe
     ],
     schemas: [CUSTOM_ELEMENTS_SCHEMA]
 })

src/app/dashboard-module/domain-module/metric-module/metric.module.ts

@@ -1,39 +1,9 @@
 import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { MetricComponent } from './metric/metric.component';
-import { MetricStatisticsComponent, SwitcherDataStatsDialogComponent } from './metric-statistics/metric-statistics.component';
-import { MetricDataComponent } from './metric-data/metric-data.component';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
-import { BaseChartDirective } from '../../../../libs/ng2-charts/src/lib/base-chart.directive';
 import { MetricRoutingModule } from './metric.routing';
-import { MetricFilterComponent } from './metric-filter/metric-filter.component';
-import { Metric } from 'src/app/model/metric';
-import { ElementAutocompleteComponent } from '../common/element-autocomplete/element-autocomplete.component';
-import { AppMaterialModule } from 'src/app/shared/app-material.module';
 
 @NgModule({
-    exports: [
-        MetricComponent,
-        MetricStatisticsComponent,
-        MetricDataComponent,
-        ElementAutocompleteComponent
-    ],
     imports: [
-        MetricRoutingModule,
-        CommonModule,
-        FormsModule,
-        ReactiveFormsModule,
-        NgbModule,
-        AppMaterialModule,
-        BaseChartDirective,
-        MetricComponent,
-        MetricStatisticsComponent,
-        MetricDataComponent,
-        SwitcherDataStatsDialogComponent,
-        MetricFilterComponent,
-        ElementAutocompleteComponent
-    ],
-    providers: [Metric],
+        MetricRoutingModule
+    ]
 })
 export class MetricModule { }

src/app/dashboard-module/domain-module/metric-module/metric/metric.component.ts

@@ -3,7 +3,7 @@ import { Subject, Observable } from 'rxjs';
 import { map, takeUntil } from 'rxjs/operators';
 import { ConsoleLogger } from 'src/app/_helpers/console-logger';
 import { RouterErrorHandler } from 'src/app/_helpers/router-error-handler';
-import { MatDialog } from '@angular/material/dialog';
+import { MatDialog, MatDialogModule } from '@angular/material/dialog';
 import { MetricFilterComponent } from '../metric-filter/metric-filter.component';
 import { Metric } from 'src/app/model/metric';
 import { MetricService } from 'src/app/services/metric.service';
@@ -16,6 +16,8 @@ import { MatButton } from '@angular/material/button';
 import { MatIcon } from '@angular/material/icon';
 import { MetricStatisticsComponent } from '../metric-statistics/metric-statistics.component';
 import { MetricDataComponent } from '../metric-data/metric-data.component';
+import { MatNativeDateModule } from '@angular/material/core';
+import { MAT_TOOLTIP_DEFAULT_OPTIONS } from '@angular/material/tooltip';
 
 @Component({
     selector: 'app-metric',
@@ -24,7 +26,12 @@ import { MetricDataComponent } from '../metric-data/metric-data.component';
         '../../common/css/detail.component.css',
         './metric.component.css'
     ],
-    imports: [NgClass, MatButton, MatIcon, NgbNav, NgbNavItem, NgbNavLink, NgbNavLinkBase, NgbNavContent, MetricStatisticsComponent, MetricDataComponent, NgbNavOutlet]
+    imports: [NgClass, MatButton, MatIcon, NgbNav, NgbNavItem, NgbNavLink, NgbNavLinkBase, 
+      NgbNavContent, MetricStatisticsComponent, MetricDataComponent, NgbNavOutlet, MatDialogModule, MatNativeDateModule
+    ],
+    providers: [
+      { provide: MAT_TOOLTIP_DEFAULT_OPTIONS, useValue: { showDelay: 250, hideDelay: 5, touchendHideDelay: 5, touchGestures: 'auto' } }
+    ]
 })
 export class MetricComponent implements OnInit, OnDestroy {
   private readonly activatedRoute = inject(ActivatedRoute);

src/app/dashboard-module/domain-module/team-module/team-detail/team-detail.component.html

@@ -1,3 +1,4 @@
+<app-block-ui [isBlocked]="blockuiEnabled" [message]="blockuiMessage" [showSpinner]="true">
 @if (!loading) {
 <div style="padding-top: 20px;">
     <section [ngClass]="classStatus">
@@ -78,4 +79,5 @@
         }
     </section>
 </div>
-}
+}
+<app-block-ui [isBlocked]="blockuiEnabled" [message]="blockuiMessage" [showSpinner]="true"></app-block-ui>

src/app/dashboard-module/domain-module/team-module/team-detail/team-detail.component.ts

@@ -20,6 +20,7 @@ import { NgbNav, NgbNavItem, NgbNavLink, NgbNavLinkBase, NgbNavContent, NgbNavOu
 import { TeamMembersComponent } from '../team-members/team-members.component';
 import { TeamPermissionsComponent } from '../team-permissions/team-permissions.component';
 import { TeamPendingMembersComponent } from '../team-pending-members/team-pending-members.component';
+import { BlockUIComponent } from 'src/app/shared/block-ui/block-ui.component';
 
 @Component({
     selector: 'app-team-detail',
@@ -31,7 +32,7 @@ import { TeamPendingMembersComponent } from '../team-pending-members/team-pendin
     ],
     imports: [NgClass, MatFormField, MatLabel, MatInput, FormsModule, NgStyle, ReactiveFormsModule, MatError, MatSlideToggle, 
       MatButton, MatIcon, NgbNav, NgbNavItem, NgbNavLink, NgbNavLinkBase, NgbNavContent, TeamMembersComponent, 
-      TeamPermissionsComponent, TeamPendingMembersComponent, NgbNavOutlet
+      TeamPermissionsComponent, TeamPendingMembersComponent, NgbNavOutlet, BlockUIComponent
     ]
 })
 export class TeamDetailComponent extends DetailComponent implements OnInit, OnDestroy {

src/app/dashboard-module/domain-module/team-module/team-permissions/team-permissions.component.html

@@ -1,3 +1,4 @@
+<app-block-ui [isBlocked]="blockuiEnabled" [message]="blockuiMessage" [showSpinner]="true">
 <div class="filter-permission-style">
     <button mat-button class="btn-element" (click)="createPermission()" [disabled]="!creatable">
         <mat-icon style="font-size: large;">create</mat-icon>
@@ -67,4 +68,5 @@
         <tr mat-row *matRowDef="let element; columns: dataColumns;" class="element-row"></tr>
     </table>
 </div>
-}
+}
+</app-block-ui>

src/app/dashboard-module/domain-module/team-module/team-permissions/team-permissions.component.ts

@@ -16,6 +16,7 @@ import { MatButton, MatIconButton } from '@angular/material/button';
 import { MatIcon } from '@angular/material/icon';
 import { MatFormField, MatLabel, MatInput } from '@angular/material/input';
 import { MatTooltip } from '@angular/material/tooltip';
+import { BlockUIComponent } from 'src/app/shared/block-ui/block-ui.component';
 
 @Component({
     selector: 'app-team-permissions',
@@ -26,7 +27,8 @@ import { MatTooltip } from '@angular/material/tooltip';
         './team-permissions.component.css'
     ],
     imports: [MatButton, MatIcon, MatFormField, MatLabel, MatInput, MatTable, MatSort, MatColumnDef, MatHeaderCellDef, 
-      MatHeaderCell, MatCellDef, MatCell, MatIconButton, MatSortHeader, MatTooltip, MatSlideToggle, MatHeaderRowDef, MatHeaderRow, MatRowDef, MatRow
+      MatHeaderCell, MatCellDef, MatCell, MatIconButton, MatSortHeader, MatTooltip, MatSlideToggle, MatHeaderRowDef, 
+      MatHeaderRow, MatRowDef, MatRow, BlockUIComponent
     ]
 })
 export class TeamPermissionsComponent extends BasicComponent implements OnInit, OnDestroy {

src/app/dashboard-module/domain-module/team-module/team-preview/team-preview.component.ts

@@ -26,7 +26,9 @@ import { MatIcon } from '@angular/material/icon';
         '../../common/css/detail.component.css',
         './team-preview.component.css'
     ],
-    imports: [BlockUIComponent, MatFormField, MatLabel, MatInput, FormsModule, NgStyle, ReactiveFormsModule, MatError, MatSlideToggle, NgClass, MatButton, MatIcon]
+    imports: [BlockUIComponent, MatFormField, MatLabel, MatInput, FormsModule, NgStyle, 
+      ReactiveFormsModule, MatError, MatSlideToggle, NgClass, MatButton, MatIcon, BlockUIComponent
+    ]
 })
 export class TeamPreviewComponent extends BasicComponent implements OnInit, OnDestroy {
   private readonly router = inject(Router);

src/app/dashboard-module/domain-module/team-module/team.module.ts

@@ -1,36 +1,11 @@
 import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { TeamComponent } from './team/team.component';
-import { TeamPreviewComponent } from './team-preview/team-preview.component';
 import { TeamRoutingModule } from './team.routing';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { TeamDetailComponent } from './team-detail/team-detail.component';
-import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
-import { TeamMembersComponent } from './team-members/team-members.component';
-import { TeamPermissionsComponent } from './team-permissions/team-permissions.component';
-import { TeamPermissionCreateComponent } from './team-permission-create/team-permission-create.component';
-import { TeamPendingMembersComponent } from './team-pending-members/team-pending-members.component';
 import { Team } from 'src/app/model/team';
-import { AppMaterialModule } from 'src/app/shared/app-material.module';
-import { BlockUIComponent } from 'src/app/shared/block-ui/block-ui.component';
 
 
 @NgModule({
     imports: [
-        BlockUIComponent,
-        CommonModule,
-        FormsModule,
-        ReactiveFormsModule,
-        NgbModule,
-        TeamRoutingModule,
-        AppMaterialModule,
-        TeamComponent,
-        TeamPreviewComponent,
-        TeamDetailComponent,
-        TeamMembersComponent,
-        TeamPermissionsComponent,
-        TeamPermissionCreateComponent,
-        TeamPendingMembersComponent
+        TeamRoutingModule
     ],
     providers: [Team]
 })

src/app/documentation-module/documentation.module.ts

@@ -1,14 +1,10 @@
 import { NgModule, SecurityContext } from '@angular/core';
-import { CommonModule } from '@angular/common';
 import { MarkdownModule } from 'ngx-markdown';
 import { DocumentationRoutingModule } from './documentation.routing';
-import { MatIconModule } from '@angular/material/icon';
 
 @NgModule({
     imports: [
-        CommonModule,
         DocumentationRoutingModule,
-        MatIconModule,
         MarkdownModule.forRoot({
             sanitize: SecurityContext.NONE
         }),

src/app/settings-module/settings.module.ts

@@ -1,20 +1,9 @@
 import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
 import { SettingsRoutingModule } from './settings.routing';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
-import { AppMaterialModule } from '../shared/app-material.module';
-import { ToasterModule } from '../_helpers/toaster/toaster.module';
 
 @NgModule({
     imports: [
-        FormsModule,
-        CommonModule,
-        NgbModule,
-        ReactiveFormsModule,
-        AppMaterialModule,
         SettingsRoutingModule,
-        ToasterModule
     ]
 })
 export class SettingsModule { }