Merge pull request #1999 from bcgov/feature/ALCS-2322

Add status and delete to condition types admin UI

Author: trslater

alcs-frontend/src/app/features/admin/decision-condition-types/decision-condition-types-dialog/decision-condition-types-dialog.component.html

@@ -33,6 +33,14 @@ <h4>{{ isEdit ? 'Edit' : 'Create' }} Decision Condition Type</h4>
       </mat-form-field>
     </div>
 
+    <div class="dialog-field full-width">
+      <mat-label>Status *</mat-label>
+      <mat-button-toggle-group required id="isActive" formControlName="isActive" name="isActive">
+        <mat-button-toggle [value]="true">Active</mat-button-toggle>
+        <mat-button-toggle [value]="false">Inactive</mat-button-toggle>
+      </mat-button-toggle-group>
+    </div>
+
     <div class="condition-fields-container full-width">
       <span>Click to select fields</span>
 
@@ -116,7 +124,8 @@ <h4>{{ isEdit ? 'Edit' : 'Create' }} Decision Condition Type</h4>
       </div>
       <div class="warning-section">
         <div class="warning" *ngIf="showWarning">
-          <mat-icon>info</mat-icon> <b>Warning: </b>&nbsp; Changes made here will apply to all instances of this condition
+          <mat-icon>info</mat-icon> <b>Warning: </b>&nbsp; Changes made here will apply to all instances of this
+          condition
         </div>
       </div>
     </div>

alcs-frontend/src/app/features/admin/decision-condition-types/decision-condition-types-dialog/decision-condition-types-dialog.component.spec.ts

@@ -6,14 +6,15 @@ import { ApplicationDecisionConditionTypesService } from '../../../../services/a
 
 import { DecisionConditionTypesDialogComponent } from './decision-condition-types-dialog.component';
 import { MatCheckboxModule } from '@angular/material/checkbox';
+import { MatButtonToggleGroup } from '@angular/material/button-toggle';
 
 describe('DecisionConditionTypesDialogComponent', () => {
   let component: DecisionConditionTypesDialogComponent;
   let fixture: ComponentFixture<DecisionConditionTypesDialogComponent>;
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      imports: [ReactiveFormsModule, FormsModule, MatCheckboxModule],
+      imports: [ReactiveFormsModule, FormsModule, MatCheckboxModule, MatButtonToggleGroup],
       declarations: [DecisionConditionTypesDialogComponent],
       providers: [
         { provide: MAT_DIALOG_DATA, useValue: undefined },

alcs-frontend/src/app/features/admin/decision-condition-types/decision-condition-types-dialog/decision-condition-types-dialog.component.ts

@@ -35,6 +35,9 @@ export class DecisionConditionTypesDialogComponent {
       ]),
       label: new FormControl(this.data?.content?.label ? this.data.content.label : '', [Validators.required]),
       code: new FormControl(this.data?.content?.code ? this.data.content.code : '', [Validators.required]),
+      isActive: new FormControl<boolean>(this.data && this.data.content ? this.data.content.isActive : true, [
+        Validators.required,
+      ]),
       isComponentToConditionChecked: new FormControl(
         this.data?.content?.isComponentToConditionChecked ? this.data.content.isComponentToConditionChecked : true,
       ),
@@ -76,7 +79,7 @@ export class DecisionConditionTypesDialogComponent {
   }
 
   ngOnInit(): void {
-    this.conditionTypeForm.valueChanges.subscribe( () => {
+    this.conditionTypeForm.valueChanges.subscribe(() => {
       this.showWarning = this.isEdit ? true : false;
     });
   }
@@ -88,6 +91,7 @@ export class DecisionConditionTypesDialogComponent {
       code: this.conditionTypeForm.get('code')?.value,
       label: this.conditionTypeForm.get('label')?.value,
       description: this.conditionTypeForm.get('description')?.value,
+      isActive: this.conditionTypeForm.get('isActive')?.value,
       isAdministrativeFeeAmountChecked: this.conditionTypeForm.get('isAdministrativeFeeAmountChecked')?.value,
       isAdministrativeFeeAmountRequired: this.conditionTypeForm.get('isAdministrativeFeeAmountRequired')?.value,
       administrativeFeeAmount: this.conditionTypeForm.get('administrativeFeeAmount')?.value,

alcs-frontend/src/app/features/admin/decision-condition-types/decision-condition-types.component.html

@@ -23,12 +23,30 @@ <h3>Decision Condition Types</h3>
       <td mat-cell *matCellDef="let row">{{ row.code }}</td>
     </ng-container>
 
+    <ng-container matColumnDef="isActive">
+      <th mat-header-cell *matHeaderCellDef>Status</th>
+      <td mat-cell *matCellDef="let row">
+        <div class="left" *ngIf="row.isActive">
+          <mat-icon color="primary">check_circle_outline</mat-icon>
+          Active
+        </div>
+        <div class="left" *ngIf="!row.isActive">
+          <mat-icon color="warn">not_interested</mat-icon>
+          Inactive
+        </div>
+      </td>
+    </ng-container>
+
     <ng-container matColumnDef="actions">
       <th mat-header-cell *matHeaderCellDef>Actions</th>
       <td mat-cell *matCellDef="let row">
         <button class="edit-btn" mat-flat-button (click)="onEdit(row)">
           <mat-icon>edit</mat-icon>
         </button>
+
+        <button class="delete-btn" mat-flat-button (click)="onDelete(row)">
+          <mat-icon>delete</mat-icon>
+        </button>
       </td>
     </ng-container>
   </table>

alcs-frontend/src/app/features/admin/decision-condition-types/decision-condition-types.component.scss

@@ -1,9 +1,31 @@
+@use '../../../../styles/colors';
+
 .container {
+  .mat-column-actions {
+    width: 20%;
+  }
+
+  .actions-bar {
+    margin-top: 30px;
+    display: flex;
+    justify-content: space-between;
+  }
+
+  .edit-btn,
+  .delete-btn {
+    width: 48px !important;
+    min-width: unset !important;
+  }
+
   .edit-btn {
-    color: green;
+    color: colors.$primary-color-dark;
   }
 
   .delete-btn {
-    color: red;
+    color: colors.$error-color;
+  }
+
+  .mat-icon {
+    margin-right: 1px;
   }
 }

alcs-frontend/src/app/features/admin/decision-condition-types/decision-condition-types.component.ts

@@ -14,17 +14,19 @@ import { NoticeOfIntentDecisionConditionTypeDto } from '../../../services/notice
   styleUrls: ['./decision-condition-types.component.scss'],
 })
 export class DecisionConditionTypesComponent implements OnInit {
-
-  @Input() public service: ApplicationDecisionConditionTypesService | NoticeofIntentDecisionConditionTypesService | undefined;
+  @Input() public service:
+    | ApplicationDecisionConditionTypesService
+    | NoticeofIntentDecisionConditionTypesService
+    | undefined;
 
   destroy = new Subject<void>();
 
   decisionConditionTypeDtos: ApplicationDecisionConditionTypeDto[] | NoticeOfIntentDecisionConditionTypeDto[] = [];
-  displayedColumns: string[] = ['label', 'description', 'code', 'actions'];
+  displayedColumns: string[] = ['label', 'description', 'code', 'isActive', 'actions'];
 
   constructor(
     public dialog: MatDialog,
-    private confirmationDialogService: ConfirmationDialogService
+    private confirmationDialogService: ConfirmationDialogService,
   ) {}
 
   ngOnInit(): void {

alcs-frontend/src/app/features/application/decision/decision-v2/decision-input/decision-conditions/decision-condition/decision-condition.component.spec.ts

@@ -21,6 +21,7 @@ describe('DecisionConditionComponent', () => {
         code: '',
         label: '',
         description: '',
+        isActive: true,
         isAdministrativeFeeAmountChecked: false,
         isSingleDateChecked: false,
         isSecurityAmountChecked: false,

alcs-frontend/src/app/features/application/decision/decision-v2/decision-input/decision-conditions/decision-conditions.component.html

@@ -16,13 +16,9 @@ <h3>Conditions</h3>
   </div>
 
   <mat-menu xPosition="before" #decisionComponentMenu="matMenu">
-    <button
-      *ngFor="let conditionType of codes.decisionConditionTypes"
-      mat-menu-item
-      (click)="onAddNewCondition(conditionType.code)"
-    >
+    <button *ngFor="let type of activeTypes" mat-menu-item (click)="onAddNewCondition(type.code)">
       <div class="board-menu-item">
-        <span>{{ conditionType.label }}</span>
+        <span>{{ type.label }}</span>
       </div>
     </button>
   </mat-menu>

alcs-frontend/src/app/features/application/decision/decision-v2/decision-input/decision-conditions/decision-conditions.component.spec.ts

@@ -40,14 +40,7 @@ describe('DecisionConditionComponent', () => {
 
     fixture = TestBed.createComponent(DecisionConditionsComponent);
     component = fixture.componentInstance;
-    component.codes = {
-      ceoCriterion: [],
-      decisionComponentTypes: [],
-      decisionMakers: [],
-      naruSubtypes: [],
-      outcomes: [],
-      decisionConditionTypes: [],
-    };
+    component.types = [];
     fixture.detectChanges();
   });
 

alcs-frontend/src/app/features/application/decision/decision-v2/decision-input/decision-conditions/decision-conditions.component.ts

@@ -13,9 +13,9 @@ import { combineLatestWith, Subject, takeUntil } from 'rxjs';
 import {
   ApplicationDecisionConditionDto,
   ApplicationDecisionDto,
-  ApplicationDecisionCodesDto,
   ApplicationDecisionComponentDto,
   UpdateApplicationDecisionConditionDto,
+  ApplicationDecisionConditionTypeDto,
 } from '../../../../../../services/application/decision/application-decision-v2/application-decision-v2.dto';
 import { ApplicationDecisionV2Service } from '../../../../../../services/application/decision/application-decision-v2/application-decision-v2.service';
 import { ConfirmationDialogService } from '../../../../../../shared/confirmation-dialog/confirmation-dialog.service';
@@ -32,7 +32,10 @@ export type SelectableComponent = { uuid?: string; tempId: string; decisionUuid:
 export class DecisionConditionsComponent implements OnInit, OnChanges, OnDestroy {
   $destroy = new Subject<void>();
 
-  @Input() codes!: ApplicationDecisionCodesDto;
+  activeTypes!: ApplicationDecisionConditionTypeDto[];
+  @Input() set types(types: ApplicationDecisionConditionTypeDto[]) {
+    this.activeTypes = types.filter((type) => type.isActive);
+  }
   @Input() components: ApplicationDecisionComponentDto[] = [];
   @Input() conditions: ApplicationDecisionConditionDto[] = [];
   @Input() showError = false;
@@ -91,7 +94,7 @@ export class DecisionConditionsComponent implements OnInit, OnChanges, OnDestroy
   }
 
   onAddNewCondition(typeCode: string) {
-    const matchingType = this.codes.decisionConditionTypes.find((code) => code.code === typeCode);
+    const matchingType = this.activeTypes.find((type) => type.code === typeCode);
     this.mappedConditions.unshift({
       type: matchingType,
       tempUuid: (Math.random() * 10000).toFixed(0),
@@ -177,8 +180,8 @@ export class DecisionConditionsComponent implements OnInit, OnChanges, OnDestroy
     decisionYear: number | null
   ) {
     return components.map((component) => {
-      const matchingType = this.codes.decisionComponentTypes.find(
-        (type) => type.code === component.applicationDecisionComponentTypeCode
+      const matchingType = this.activeTypes.find(
+        (type) => type.code === component.applicationDecisionComponentTypeCode,
       );
       return {
         uuid: component.uuid,

alcs-frontend/src/app/features/application/decision/decision-v2/decision-input/decision-input-v2.component.html

@@ -202,7 +202,7 @@ <h3>Resolution</h3>
   <div>
     <app-app-decision-conditions
       *ngIf="codes && showComponents && showConditions"
-      [codes]="codes"
+      [types]="codes.decisionConditionTypes"
       [components]="components"
       [conditions]="conditions"
       (conditionsChange)="onConditionsChange($event)"

alcs-frontend/src/app/features/notice-of-intent/decision/decision-v2/decision-input/decision-conditions/decision-condition/decision-condition.component.spec.ts

@@ -20,6 +20,7 @@ describe('DecisionConditionComponent', () => {
         code: '',
         label: '',
         description: '',
+        isActive: true,
         isAdministrativeFeeAmountChecked: false,
         isSingleDateChecked: false,
         isSecurityAmountChecked: false,

alcs-frontend/src/app/services/application/application-decision-condition-types/application-decision-condition-types.service.spec.ts

@@ -44,6 +44,7 @@ describe('DecisionConditionTypesService', () => {
       code: '',
       label: '',
       description: '',
+      isActive: true,
       isAdministrativeFeeAmountChecked: false,
       isSingleDateChecked: false,
       isSecurityAmountChecked: false,
@@ -65,6 +66,7 @@ describe('DecisionConditionTypesService', () => {
       code: '',
       label: '',
       description: '',
+      isActive: true,
       isAdministrativeFeeAmountChecked: false,
       isSingleDateChecked: false,
       isSecurityAmountChecked: false,
@@ -86,6 +88,7 @@ describe('DecisionConditionTypesService', () => {
       code: '',
       label: '',
       description: '',
+      isActive: true,
       isAdministrativeFeeAmountChecked: false,
       isSingleDateChecked: false,
       isSecurityAmountChecked: false,
@@ -107,6 +110,7 @@ describe('DecisionConditionTypesService', () => {
       code: '',
       label: '',
       description: '',
+      isActive: true,
       isAdministrativeFeeAmountChecked: false,
       isSingleDateChecked: false,
       isSecurityAmountChecked: false,

alcs-frontend/src/app/services/application/application-decision-condition-types/application-decision-condition-types.service.ts

@@ -31,7 +31,7 @@ export class ApplicationDecisionConditionTypesService {
       return await firstValueFrom(this.http.post<ApplicationDecisionConditionTypeDto>(`${this.url}`, createDto));
     } catch (e) {
       this.toastService.showErrorToast('Failed to create decision condition type');
-      console.log(e);
+      console.error(e);
     }
     return;
   }
@@ -43,17 +43,21 @@ export class ApplicationDecisionConditionTypesService {
       );
     } catch (e) {
       this.toastService.showErrorToast('Failed to update decision condition type');
-      console.log(e);
+      console.error(e);
     }
     return;
   }
 
   async delete(code: string) {
     try {
       return await firstValueFrom(this.http.delete<ApplicationDecisionConditionTypeDto>(`${this.url}/${code}`));
-    } catch (e) {
-      this.toastService.showErrorToast('Failed to delete decision condition type');
-      console.log(e);
+    } catch (e: any) {
+      if (e && e.error && e.error.message) {
+        this.toastService.showErrorToast(e.error.message);
+      } else {
+        this.toastService.showErrorToast('Failed to delete decision condition type');
+      }
+      console.error(e);
     }
     return;
   }

alcs-frontend/src/app/services/application/decision/application-decision-v2/application-decision-v2.dto.ts

@@ -222,6 +222,7 @@ export enum DateLabel {
 }
 
 export interface ApplicationDecisionConditionTypeDto extends BaseCodeDto {
+  isActive: boolean;
   isComponentToConditionChecked?: boolean | null;
   isDescriptionChecked?: boolean | null;
   isAdministrativeFeeAmountChecked: boolean;

alcs-frontend/src/app/services/notice-of-intent/decision-v2/notice-of-intent-decision.dto.ts

@@ -69,6 +69,7 @@ export interface NoticeOfIntentDecisionDocumentDto {
 export interface NoticeOfIntentDecisionOutcomeCodeDto extends BaseCodeDto {}
 
 export interface NoticeOfIntentDecisionConditionTypeDto extends BaseCodeDto {
+  isActive: boolean;
   isComponentToConditionChecked?: boolean | null;
   isDescriptionChecked?: boolean | null;
   isAdministrativeFeeAmountChecked: boolean;