Skip to content

Commit

Permalink
refactor: migrate to new control flow syntax
Browse files Browse the repository at this point in the history
  • Loading branch information
@jakerenzella
jakerenzella committed Nov 9, 2023
1 parent 7271bd3 commit 2c21651
Show file tree
Hide file tree
Showing 58 changed files with 933 additions and 727 deletions.
8 changes: 4 additions & 4 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,13 +9,13 @@
"node": ">=18"
},
"scripts": {
"build": "run-s -l build:angular1 build:angular16",
"build": "run-s -l build:angular1 build:angular17",
"build:angular1": "grunt build",
"build:angular16": "ng build",
"build:angular17": "ng build",
"lint:fix": "ng lint --fix",
"lint": "ng lint",
"serve:angular16": "export NODE_OPTIONS=--max_old_space_size=4096 && ng serve --host 0.0.0.0",
"start": "npm-run-all -l -s build:angular1 -p watch:angular1 serve:angular16",
"serve:angular17": "export NODE_OPTIONS=--max_old_space_size=4096 && ng serve --host 0.0.0.0",
"start": "npm-run-all -l -s build:angular1 -p watch:angular1 serve:angular17",
"watch:angular1": "grunt delta",
"deploy:build2api": "ng build --delete-output-path=true --optimization=true --configuration production --output-path dist",
"deploy": "run-s -l build:angular1 deploy:build2api",
Expand Down
28 changes: 25 additions & 3 deletions src/app/admin/institution-settings/activity-type-list/activity-type-list.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,9 +10,27 @@ <h1 class="mb-1">Activities</h1>
<ng-container [formGroup]="formData" matColumnDef="name">
<th mat-header-cell *matHeaderCellDef mat-sort-header>Name</th>
<td mat-cell *matCellDef="let activityType">
<div *ngIf="!editing(activityType); else edit">
@if (!editing(activityType)) {
<div>
{{ activityType.name }}
</div>
} @else {

<div class="edit-actions right">
<span>
<button mat-icon-button color="warn" (click)="cancelEdit()" aria-label="cancel edit">
<mat-icon>cancel</mat-icon>
</button>
<button mat-icon-button color="primary" (click)="submit()" aria-label="submit changes">
<mat-icon>save</mat-icon>
</button>
<button mat-icon-button (click)="deleteActivity(activityType)" aria-label="delete activity type">
<mat-icon color="primary">delete</mat-icon>
</button>
</span>
</div>

}
<ng-template #edit>
<mat-form-field appearance="outline" class="data-entry">
<input matInput required formControlName="name" placeholder="Name" />
Expand All @@ -30,9 +48,11 @@ <h1 class="mb-1">Activities</h1>
<ng-container [formGroup]="formData" matColumnDef="abbreviation">
<th mat-header-cell *matHeaderCellDef mat-sort-header>Abbreviation</th>
<td mat-cell *matCellDef="let activityType">
<div *ngIf="!editing(activityType); else edit">
@if (!editing(activityType)) {
<div>
{{ activityType.abbreviation }}
</div>
} @else { #edit| }
<ng-template #edit>
<mat-form-field appearance="outline" class="data-entry">
<input matInput required formControlName="abbreviation" placeholder="Abbreviation" />
Expand All @@ -50,11 +70,13 @@ <h1 class="mb-1">Activities</h1>
<ng-container matColumnDef="options" stickyEnd>
<th mat-header-cell *matHeaderCellDef></th>
<td mat-cell *matCellDef="let activityType">
<div class="right" *ngIf="!editing(activityType); else edit">
@if (!editing(activityType)) {
<div class="right">
<button mat-icon-button (click)="flagEdit(activityType)" aria-label="edit activity type">
<mat-icon>edit</mat-icon>
</button>
</div>
} @else { #edit| }
<ng-template #edit>
<div class="edit-actions right">
<span>
Expand Down
44 changes: 37 additions & 7 deletions src/app/admin/institution-settings/campuses/campus-list/campus-list.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,9 +10,27 @@ <h1 class="mb-1">Campuses</h1>
<ng-container [formGroup]="formData" matColumnDef="name">
<th mat-header-cell *matHeaderCellDef mat-sort-header>Name</th>
<td mat-cell *matCellDef="let campus">
<div *ngIf="!editing(campus); else edit">
@if (!editing(campus)) {
<div>
{{ campus.name }}
</div>
} @else {

<div class="edit-actions right">
<span>
<button mat-icon-button color="warn" (click)="cancelEdit()" aria-label="cancel edit">
<mat-icon>cancel</mat-icon>
</button>
<button mat-icon-button color="primary" (click)="submit()" aria-label="submit changes">
<mat-icon>save</mat-icon>
</button>
<button mat-icon-button color="warn" (click)="deleteCampus(campus)" aria-label="delete campus">
<mat-icon>delete</mat-icon>
</button>
</span>
</div>

}
<ng-template #edit>
<mat-form-field appearance="outline" class="data-entry">
<input matInput required formControlName="name" placeholder="Name" />
Expand All @@ -30,9 +48,11 @@ <h1 class="mb-1">Campuses</h1>
<ng-container [formGroup]="formData" matColumnDef="abbreviation">
<th mat-header-cell *matHeaderCellDef mat-sort-header>Abbreviation</th>
<td mat-cell *matCellDef="let campus">
<div *ngIf="!editing(campus); else edit">
@if (!editing(campus)) {
<div>
{{ campus.abbreviation }}
</div>
} @else { #edit| }
<ng-template #edit>
<mat-form-field appearance="outline" class="data-entry">
<input matInput required formControlName="abbreviation" placeholder="Abbreviation" />
Expand All @@ -50,16 +70,20 @@ <h1 class="mb-1">Campuses</h1>
<ng-container [formGroup]="formData" matColumnDef="mode">
<th mat-header-cell *matHeaderCellDef mat-sort-header>Default Sync Mode</th>
<td mat-cell *matCellDef="let campus">
<div *ngIf="!editing(campus); else edit">
@if (!editing(campus)) {
<div>
{{ campus.mode | titlecase }}
</div>
} @else { #edit| }
<ng-template #edit>
<mat-form-field appearance="outline" class="data-entry">
<mat-label>Default Sync Mode</mat-label>
<mat-select required formControlName="mode">
<mat-option *ngFor="let mode of syncModes" [value]="mode">
@for (mode of syncModes; track mode) {
<mat-option [value]="mode">
{{ mode | titlecase }}
</mat-option>
}
</mat-select>
</mat-form-field>
</ng-template>
Expand All @@ -68,9 +92,11 @@ <h1 class="mb-1">Campuses</h1>
<mat-form-field appearance="outline" class="data-entry">
<mat-label>Default Sync Mode</mat-label>
<mat-select required formControlName="mode">
<mat-option *ngFor="let mode of syncModes" [value]="mode">
@for (mode of syncModes; track mode) {
<mat-option [value]="mode">
{{ mode | titlecase }}
</mat-option>
}
</mat-select>
</mat-form-field>
</td>
Expand All @@ -80,9 +106,11 @@ <h1 class="mb-1">Campuses</h1>
<ng-container [formGroup]="formData" matColumnDef="active">
<th mat-header-cell *matHeaderCellDef mat-sort-header>Active</th>
<td mat-cell *matCellDef="let campus">
<div *ngIf="!editing(campus); else edit">
@if (!editing(campus)) {
<div>
<mat-checkbox [checked]="campus.active" disabled> </mat-checkbox>
</div>
} @else { #edit| }
<ng-template #edit>
<mat-checkbox [checked]="campus.active" formControlName="active"> </mat-checkbox>
</ng-template>
Expand All @@ -96,7 +124,8 @@ <h1 class="mb-1">Campuses</h1>
<ng-container matColumnDef="options" stickyEnd>
<th mat-header-cell *matHeaderCellDef></th>
<td mat-cell *matCellDef="let campus">
<div class="right" *ngIf="!editing(campus); else edit">
@if (!editing(campus)) {
<div class="right">
<!-- <button mat-icon-button [matMenuTriggerFor]="menu" aria-label="Example icon-button with a menu">
<mat-icon>more_vert</mat-icon>
</button> -->
Expand All @@ -106,6 +135,7 @@ <h1 class="mb-1">Campuses</h1>
</button>
<!-- </mat-menu> -->
</div>
} @else { #edit| }
<ng-template #edit>
<div class="edit-actions right">
<span>
Expand Down
7 changes: 5 additions & 2 deletions src/app/admin/institution-settings/institution-settings.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,11 +9,14 @@
<mat-tab label="Teaching Periods">
<f-teaching-period-list></f-teaching-period-list>
</mat-tab>
<mat-tab label="Overseer Images" *ngIf="overseerEnabled">
@if (overseerEnabled) {
<mat-tab label="Overseer Images">
<overseer-image-list></overseer-image-list>
</mat-tab>
<mat-tab label="TurnItIn" *ngIf="tiiEnabled">
} @if (tiiEnabled) {
<mat-tab label="TurnItIn">
<f-tii-action-log></f-tii-action-log>
</mat-tab>
}
</mat-tab-group>
</div>
79 changes: 47 additions & 32 deletions src/app/admin/institution-settings/overseer-images/overseer-image-list.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,43 +6,42 @@ <h3>Overseer Images</h3>
</div>
</div>
<table mat-table [dataSource]="dataSource" matSort (matSortChange)="sortTableData($event)" class="f-table">

<!-- Name Column -->
<ng-container [formGroup]="formData" matColumnDef="name">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Name </th>
<th mat-header-cell *matHeaderCellDef mat-sort-header>Name</th>
<td mat-cell *matCellDef="let overseerImage">
<div *ngIf="!editing(overseerImage) else edit">
{{overseerImage.name}}
<div *ngIf="!editing(overseerImage); else edit">
{{ overseerImage.name }}
</div>
<ng-template #edit>
<mat-form-field class="data-entry">
<input matInput required formControlName="name" placeholder="Name">
<input matInput required formControlName="name" placeholder="Name" />
</mat-form-field>
</ng-template>
</td>
<td mat-footer-cell *matFooterCellDef>
<mat-form-field class="data-entry">
<input matInput required formControlName="name" placeholder="Name">
<input matInput required formControlName="name" placeholder="Name" />
</mat-form-field>
</td>
</ng-container>

<!-- Tag Column -->
<ng-container [formGroup]="formData" matColumnDef="tag">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Tag </th>
<th mat-header-cell *matHeaderCellDef mat-sort-header>Tag</th>
<td mat-cell *matCellDef="let overseerImage">
<div *ngIf="!editing(overseerImage) else edit">
{{overseerImage.tag}}
<div *ngIf="!editing(overseerImage); else edit">
{{ overseerImage.tag }}
</div>
<ng-template #edit>
<mat-form-field class="data-entry">
<input matInput required formControlName="tag" placeholder="Tag">
<input matInput required formControlName="tag" placeholder="Tag" />
</mat-form-field>
</ng-template>
</td>
<td mat-footer-cell *matFooterCellDef>
<mat-form-field class="data-entry">
<input matInput required formControlName="tag" placeholder="Tag">
<input matInput required formControlName="tag" placeholder="Tag" />
</mat-form-field>
</td>
</ng-container>
Expand All @@ -51,10 +50,8 @@ <h3>Overseer Images</h3>
<ng-container matColumnDef="pull">
<th mat-header-cell *matHeaderCellDef></th>
<td mat-cell *matCellDef="let overseerImage">
<div class="right" *ngIf="!editing(overseerImage) else edit">
<button mat-flat-button color="primary" (click)="pullOverseerImage(overseerImage)">
Pull
</button>
<div class="right" *ngIf="!editing(overseerImage); else edit">
<button mat-flat-button color="primary" (click)="pullOverseerImage(overseerImage)">Pull</button>
</div>
</td>
<td mat-footer-cell *matFooterCellDef></td>
Expand All @@ -64,8 +61,8 @@ <h3>Overseer Images</h3>
<ng-container matColumnDef="last-pulled">
<th mat-header-cell *matHeaderCellDef>Last Pulled</th>
<td mat-cell *matCellDef="let overseerImage">
<div class="right" *ngIf="!editing(overseerImage) else edit">
{{overseerImage.lastPulledDate}}
<div class="right" *ngIf="!editing(overseerImage); else edit">
{{ overseerImage.lastPulledDate }}
</div>
</td>
<td mat-footer-cell *matFooterCellDef></td>
Expand All @@ -75,19 +72,37 @@ <h3>Overseer Images</h3>
<ng-container matColumnDef="status">
<th mat-header-cell *matHeaderCellDef>Status</th>
<td mat-cell *matCellDef="let overseerImage">
<div class="right" *ngIf="!editing(overseerImage) else edit"
[ngStyle]="{'color': (overseerImage.pulledImageStatus === 'success') ? 'green' :
(overseerImage.pulledImageStatus === 'loading') ? 'orange' :
(overseerImage.pulledImageStatus === 'failed') ? 'red' : ''}">
<button class="status-icon" *ngIf="overseerImage.pulledImageStatus === 'success'" [matTooltip]="overseerImage.pulledImageText">
<mat-icon>check_circle_outline</mat-icon>
</button>
<button class="status-icon" *ngIf="overseerImage.pulledImageStatus === 'loading'">
<mat-icon>access_time_icon</mat-icon>
</button>
<button class="status-icon" *ngIf="overseerImage.pulledImageStatus === 'failed'" [matTooltip]="overseerImage.pulledImageText">
<mat-icon>error_outline</mat-icon>
</button>
<div
class="right"
*ngIf="!editing(overseerImage); else edit"
[ngStyle]="{
color:
overseerImage.pulledImageStatus === 'success'
? 'green'
: overseerImage.pulledImageStatus === 'loading'
? 'orange'
: overseerImage.pulledImageStatus === 'failed'
? 'red'
: ''
}"
>
<button
class="status-icon"
*ngIf="overseerImage.pulledImageStatus === 'success'"
[matTooltip]="overseerImage.pulledImageText"
>
<mat-icon>check_circle_outline</mat-icon>
</button>
<button class="status-icon" *ngIf="overseerImage.pulledImageStatus === 'loading'">
<mat-icon>access_time_icon</mat-icon>
</button>
<button
class="status-icon"
*ngIf="overseerImage.pulledImageStatus === 'failed'"
[matTooltip]="overseerImage.pulledImageText"
>
<mat-icon>error_outline</mat-icon>
</button>
</div>
</td>
<td mat-footer-cell *matFooterCellDef></td>
Expand All @@ -97,7 +112,7 @@ <h3>Overseer Images</h3>
<ng-container matColumnDef="options" stickyEnd>
<th mat-header-cell *matHeaderCellDef></th>
<td mat-cell *matCellDef="let overseerImage">
<div class="right" *ngIf="!editing(overseerImage) else edit">
<div class="right" *ngIf="!editing(overseerImage); else edit">
<button mat-icon-button [matMenuTriggerFor]="menu" aria-label="Example icon-button with a menu">
<mat-icon>more_vert</mat-icon>
</button>
Expand Down Expand Up @@ -134,7 +149,7 @@ <h3>Overseer Images</h3>
</ng-container>

<tr mat-header-row *matHeaderRowDef="columns"></tr>
<tr mat-row *matRowDef="let row; columns: columns;"></tr>
<tr mat-row *matRowDef="let row; columns: columns"></tr>
<tr [hidden]="selected" mat-footer-row *matFooterRowDef="columns"></tr>
</table>
</div>
Loading

0 comments on commit 2c21651

Please sign in to comment.