[NRPTI-1045] - WIP - Update agency name in NRPTI

angular/projects/admin-nrpti/src/app/agencies/agencies.component.html

@@ -0,0 +1,38 @@
+<div class="container">
+  <h1>Update Agencies</h1>
+
+  <!-- Dropdown for selecting an agency -->
+  <div class="dropDownArea">
+    <label>Select The Agency You Would Like to Update:</label>
+    <br />
+    <!-- <select (change)="onSelected($event.target.value)">
+      <option *ngFor="let agency of agencyList" [value]="agency">{{ agency }}</option>
+    </select> -->
+
+    <select
+      _ngcontent-ity-c12=""
+      class="form-control ng-pristine ng-valid ng-touched"
+      (change)="onSelected($event.target.value)"
+    >
+      <option *ngFor="let agency of agencyList" [value]="agency">{{ agency }}</option>
+    </select>
+  </div>
+
+  <!-- Text field for entering a new agency -->
+  <div class="form-group">
+    <label for="newAgency">Updated Agency Name:</label>
+    <input type="text" id="newAgency" [(ngModel)]="newAgency" class="form-control" />
+  </div>
+
+  <!-- Submit button to update the selected agency -->
+  <!-- <button (click)="updateSelectedAgency()">Update Selected Agency</button> -->
+  <button _ngcontent-req-c21="" class="btn btn-primary" (click)="updateSelectedAgency()" title="Update Selected Agency">
+    Update Selected Agency
+  </button>
+
+  <!-- Displays current selection - Would probably remove before release -->
+  <!-- <div *ngIf="choiceMade">
+    <p>Selected Agency: {{ selectedAgency }}</p>
+  </div> -->
+  <!-- This div is just for debugging, Trying other ways to display the agencies -->
+</div>

angular/projects/admin-nrpti/src/app/agencies/agencies.component.scss

@@ -0,0 +1,2 @@
+@import "assets/styles/base/base.scss";
+@import "assets/styles/components/add-edit.scss";

angular/projects/admin-nrpti/src/app/agencies/agencies.component.ts

@@ -0,0 +1,106 @@
+import { Component, OnInit } from '@angular/core';
+import { IssuingAgencyService } from '../services/issuingagency.service';
+import { LoggerService } from 'nrpti-angular-components';
+import { Constants } from '../utils/constants/misc';
+import { ToastService } from '../services/toast.service';
+import { FactoryService } from '../services/factory.service';
+
+@Component({
+  selector: 'app-agencies',
+  templateUrl: './agencies.component.html',
+  styleUrls: ['./agencies.component.scss']
+})
+export class AgenciesComponent implements OnInit {
+  public loading = false;
+  selectedAgency = ''; // Initialize the selectedAgency
+  choiceMade = false;
+  newAgency = ''; // Initialize the new agency input field
+  agencies: { [key: string]: string } = { 'Kyle': 'Williams' };
+  agencyList: string[] = ['-Select-']; // Use a string array for agencyList
+  updatedData: any = {
+    agencies: []
+  };
+  constructor(
+    private issuingAgencyService: IssuingAgencyService,
+    private logger: LoggerService,
+    private toastService: ToastService,
+    private factoryService: FactoryService
+  ) {}
+
+  onSelected(value: string): void {
+    this.selectedAgency = value;
+    this.choiceMade = true;
+  }
+  putRecords(agencyCode: any, agencyName: any) {
+    this.issuingAgencyService.updateAgency(agencyCode, agencyName).then(() => {
+      // Once record is updated, refresh the agencies
+      this.refreshAgencies();
+    });
+  }
+  refreshAgencies() {
+    this.factoryService.applicationAgencyService.refreshAgencies().subscribe();
+  }
+  updateSelectedAgency(): void {
+    try {
+      if (this.newAgency.trim() !== '') {
+        // Find the agency code that matches the selected agency name
+        const matchingCode = Object.keys(this.agencies).find(key => this.agencies[key] === this.selectedAgency);
+        if (matchingCode) {
+          // Update the agencyList with the new value at the same index
+          const index = this.agencyList.indexOf(this.selectedAgency);
+          if (index !== -1) {
+            this.agencyList[index] = this.newAgency;
+          }
+          // Update the selectedAgency with the new value
+          this.selectedAgency = this.newAgency;
+          // Clear the input field
+          this.newAgency = '';
+          this.choiceMade = true;
+          // Update the updatedData object to match the desired layout
+          this.updatedData.agencies.push({
+            agencyCode: matchingCode,
+            agencyName: this.selectedAgency
+          });
+          this.putRecords(matchingCode, this.selectedAgency);
+          this.updatedData.agencies = [];
+        }
+        this.toastService.addMessage('Agency Successfully Updated', 'Success Updated', Constants.ToastTypes.SUCCESS);
+      } else {
+        this.toastService.addMessage(
+          'Updated Agency Name Cannot be Empty',
+          'Save unsuccessful',
+          Constants.ToastTypes.ERROR
+        );
+      }
+    } catch (error) {
+      this.toastService.addMessage(
+        'An error has occured while saving',
+        'Save unsuccessful',
+        Constants.ToastTypes.ERROR
+      );
+    }
+  }
+
+  ngOnInit(): void {
+    this.issuingAgencyService
+      .getIssuingAgencies()
+      .then(response => {
+        const agencies = {};
+        if (response && Array.isArray(response)) {
+          response.forEach(agency => {
+            agencies[agency.agencyCode] = agency.agencyName;
+          });
+        }
+        this.agencies = agencies; // Assign the agencies object as an Observable
+        for (const key in agencies) {
+          if (agencies.hasOwnProperty(key)) {
+            this.agencyList.push(agencies[key]);
+          }
+        }
+      })
+      .catch(error => {
+        console.error('API call error:', error);
+      });
+    this.logger.level = 0;
+  }
+}

angular/projects/admin-nrpti/src/app/agencies/agencies.module.ts

@@ -0,0 +1,32 @@
+// modules
+import { NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { CommonModule } from '@angular/common';
+import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
+import { BrowserModule } from '@angular/platform-browser';
+import { EditorModule } from '@tinymce/tinymce-angular';
+import { GlobalModule } from 'nrpti-angular-components';
+
+import { CommonModule as NrptiCommonModule } from '../../../../common/src/app/common.module';
+import { AgenciesComponent } from './agencies.component';
+import { AgenciesResolver } from './agencies.resolver';
+
+@NgModule({
+  imports: [
+    BrowserModule,
+    EditorModule,
+    FormsModule,
+    ReactiveFormsModule,
+    CommonModule,
+    GlobalModule,
+    NrptiCommonModule,
+    RouterModule,
+    NgbModule
+  ],
+  declarations: [AgenciesComponent],
+  providers: [AgenciesResolver],
+  entryComponents: [AgenciesComponent],
+  exports: []
+})
+export class AgenciesModule {}

angular/projects/admin-nrpti/src/app/agencies/agencies.resolver.ts

@@ -0,0 +1,10 @@
+import { Injectable } from '@angular/core';
+import { ActivatedRouteSnapshot, Resolve } from '@angular/router';
+import { Observable } from 'rxjs/Observable';
+
+@Injectable()
+export class AgenciesResolver implements Resolve<Observable<object>> {
+  resolve(route: ActivatedRouteSnapshot): Observable<object> {
+    return null;
+  }
+}

angular/projects/admin-nrpti/src/app/app-routing.module.ts

@@ -8,6 +8,8 @@ import { NewsResolver } from './news/news-resolver';
 import { NewsListComponent } from './news/news-list.component';
 import { CommunicationsComponent } from './communications/communications.component';
 import { LngMapInfoResolver } from './communications/lng-map-info/lng-map-info-resolver';
+import { AgenciesComponent } from './agencies/agencies.component';
+import { AgenciesResolver } from './agencies/agencies.resolver';
 
 const routes: Routes = [
   {
@@ -60,6 +62,17 @@ const routes: Routes = [
       }
     ]
   },
+  {
+    path: 'agencies',
+    pathMatch: 'full',
+    component: AgenciesComponent,
+    resolve: {
+      records: AgenciesResolver
+    },
+    data: {
+      breadcrumb: 'Agencies'
+    }
+  },
   {
     // wildcard default route
     path: '**',

angular/projects/admin-nrpti/src/app/app.module.ts

@@ -19,6 +19,7 @@ import { RecordsModule } from './records/records.module';
 import { NewsModule } from './news/news.module';
 import { MinesModule } from './mines/mines.module';
 import { CommunicationsModule } from './communications/communications.module';
+import { AgenciesModule } from './agencies/agencies.module';
 import { ToastrModule } from 'ngx-toastr';
 
 // components
@@ -43,6 +44,7 @@ import { RecordService } from './services/record.service';
 import { TaskService } from './services/task.service';
 import { ConfigService, LoggerService } from 'nrpti-angular-components';
 import { NewsService } from './services/news.service';
+import { ApplicationAgencyService } from './services/application-agency.service';
 
 // resolvers
 import { ImportListResolver } from './import/import-list-resolver';
@@ -58,11 +60,15 @@ import { TokenInterceptor } from './utils/token-interceptor';
 import { RecordUtils } from './records/utils/record-utils';
 import { CollectionService } from './services/collection.service';
 
-
-export function initConfig(configService: ConfigService, keycloakService: KeycloakService) {
+export function initConfig(
+  configService: ConfigService,
+  keycloakService: KeycloakService,
+  applicationAgency: ApplicationAgencyService
+) {
   return async () => {
     await configService.init();
     await keycloakService.init();
+    await applicationAgency.init();
   };
 }
 
@@ -98,6 +104,7 @@ export function overlayScrollFactory(overlay: Overlay): () => CloseScrollStrateg
     NewsModule,
     MinesModule,
     CommunicationsModule,
+    AgenciesModule,
     AppRoutingModule, // <-- module import order matters - https://angular.io/guide/router#module-import-order-matters
     NgbModule.forRoot(),
     NgxPaginationModule,
@@ -108,7 +115,7 @@ export function overlayScrollFactory(overlay: Overlay): () => CloseScrollStrateg
     {
       provide: APP_INITIALIZER,
       useFactory: initConfig,
-      deps: [ConfigService, KeycloakService],
+      deps: [ConfigService, KeycloakService, ApplicationAgencyService],
       multi: true
     },
     {
@@ -129,14 +136,15 @@ export function overlayScrollFactory(overlay: Overlay): () => CloseScrollStrateg
     NewsService,
     CollectionService,
     KeycloakService,
+    ApplicationAgencyService,
     LoggerService,
     TaskService,
     ImportListResolver,
     NewsResolver,
     NewsListResolver,
     CanActivateGuard,
     CanDeactivateGuard,
-    RecordUtils,
+    RecordUtils
   ],
   entryComponents: [ConfirmComponent, HomeComponent, ImportComponent, ImportTableRowsComponent],
   bootstrap: [AppComponent]

angular/projects/admin-nrpti/src/app/home/home.component.spec.ts

@@ -33,6 +33,7 @@ describe('HomeComponent', () => {
         case Constants.Menus.ENTITIES: retVal = false; break;
         case Constants.Menus.IMPORTS: retVal = true; break;
         case Constants.Menus.COMMUNICATIONS: retVal = true; break;
+        case Constants.Menus.AGENCIES: retVal = true; break;
       }
       return retVal;
     }

angular/projects/admin-nrpti/src/app/mines/mines-enforcement-actions/mines-administrative-penalty-add-edit/mines-administrative-penalty-add-edit.component.ts

@@ -45,7 +45,7 @@ export class MinesAdministrativePenaltyAddEditComponent extends AdministrativePe
     );
   }
 
-  ngOnInit() {
+  async ngOnInit() {
     this.route.data.pipe(takeUntil(this.ngUnsubscribe)).subscribe((res: any) => {
       this.isEditing = res.breadcrumb !== 'Add Administrative Penalty';
       if (this.isEditing) {