Chore: Upgraded to Angular v17 and all the refactoring for that

Chore: Updated all dependencies in overlord
This commit is contained in:
2024-04-30 12:48:11 +05:30
parent 43cb697737
commit 34b4227148
89 changed files with 776 additions and 613 deletions
@@ -35,9 +35,11 @@
<mat-form-field class="flex-auto">
<mat-label>Product Type</mat-label>
<mat-select formControlName="productGroup" (selectionChange)="updatePG($event.value)">
<mat-option *ngFor="let pg of productGroups" [value]="pg.id">
{{ pg.name }}
</mat-option>
@for (pg of productGroups; track pg) {
<mat-option [value]="pg.id">
{{ pg.name }}
</mat-option>
}
</mat-select>
</mat-form-field>
</div>
@@ -47,67 +49,72 @@
<input matInput #nameElement formControlName="allergen" />
</mat-form-field>
</div>
<h2 *ngIf="item.productGroup?.nutritional ?? false">Nutritional Information</h2>
<div
class="flex flex-row justify-around content-start items-start"
*ngIf="item.productGroup?.nutritional ?? false"
>
<mat-form-field class="flex-auto mr-5">
<mat-label>Protein</mat-label>
<input matInput formControlName="protein" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Carbohydrate</mat-label>
<input matInput formControlName="carbohydrate" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Total Sugar</mat-label>
<input matInput formControlName="totalSugar" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Added Sugar</mat-label>
<input matInput formControlName="addedSugar" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Total Fat</mat-label>
<input matInput formControlName="totalFat" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Saturated Fat</mat-label>
<input matInput formControlName="saturatedFat" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Trans Fat</mat-label>
<input matInput formControlName="transFat" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Cholestrol</mat-label>
<input matInput formControlName="cholestrol" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Sodium</mat-label>
<input matInput formControlName="sodium" />
</mat-form-field>
</div>
<h2 *ngIf="item.productGroup?.iceCream ?? false">Ice Cream Information</h2>
<div class="flex flex-row justify-around content-start items-start" *ngIf="item.productGroup?.iceCream ?? false">
<mat-form-field class="flex-auto mr-5">
<mat-label>MSNF</mat-label>
<input matInput formControlName="msnf" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Other Solids</mat-label>
<input matInput formControlName="otherSolids" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Total Solids</mat-label>
<input matInput formControlName="totalSolids" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Water</mat-label>
<input matInput formControlName="water" />
</mat-form-field>
</div>
@if (item.productGroup?.nutritional ?? false) {
<h2>Nutritional Information</h2>
}
@if (item.productGroup?.nutritional ?? false) {
<div class="flex flex-row justify-around content-start items-start">
<mat-form-field class="flex-auto mr-5">
<mat-label>Protein</mat-label>
<input matInput formControlName="protein" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Carbohydrate</mat-label>
<input matInput formControlName="carbohydrate" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Total Sugar</mat-label>
<input matInput formControlName="totalSugar" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Added Sugar</mat-label>
<input matInput formControlName="addedSugar" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Total Fat</mat-label>
<input matInput formControlName="totalFat" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Saturated Fat</mat-label>
<input matInput formControlName="saturatedFat" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Trans Fat</mat-label>
<input matInput formControlName="transFat" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Cholestrol</mat-label>
<input matInput formControlName="cholestrol" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Sodium</mat-label>
<input matInput formControlName="sodium" />
</mat-form-field>
</div>
}
@if (item.productGroup?.iceCream ?? false) {
<h2>Ice Cream Information</h2>
}
@if (item.productGroup?.iceCream ?? false) {
<div class="flex flex-row justify-around content-start items-start">
<mat-form-field class="flex-auto mr-5">
<mat-label>MSNF</mat-label>
<input matInput formControlName="msnf" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Other Solids</mat-label>
<input matInput formControlName="otherSolids" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Total Solids</mat-label>
<input matInput formControlName="totalSolids" />
</mat-form-field>
<mat-form-field class="flex-auto mr-5">
<mat-label>Water</mat-label>
<input matInput formControlName="water" />
</mat-form-field>
</div>
}
<h2>Stock Keeping Units</h2>
<div
formGroupName="addRow"
@@ -186,6 +193,8 @@
</mat-card-content>
<mat-card-actions>
<button mat-raised-button color="primary" (click)="save()" class="mr-5">Save</button>
<button mat-raised-button color="warn" (click)="confirmDelete()" *ngIf="!!item.id">Delete</button>
@if (!!item.id) {
<button mat-raised-button color="warn" (click)="confirmDelete()">Delete</button>
}
</mat-card-actions>
</mat-card>
@@ -2,9 +2,11 @@
<mat-card-header>
<mat-card-title-group>
<mat-card-title>Products</mat-card-title>
<button mat-icon-button *ngIf="dataSource.data.length" (click)="exportCsv()">
<mat-icon>save_alt</mat-icon>
</button>
@if (dataSource.data.length) {
<button mat-icon-button (click)="exportCsv()">
<mat-icon>save_alt</mat-icon>
</button>
}
<a mat-button [routerLink]="['/products', 'new']">
<mat-icon>add_box</mat-icon>
Add
@@ -26,12 +28,14 @@
<mat-header-cell *matHeaderCellDef mat-sort-header>Name</mat-header-cell>
<mat-cell *matCellDef="let row">
<ul>
<li *ngFor="let sku of row.skus">
<a [routerLink]="['/products', row.id]"
>{{ row.name }} ({{ showExtended ? sku.fraction + ' ' + row.fractionUnits + ' = 1 ' : ''
}}{{ sku.units }})</a
>
</li>
@for (sku of row.skus; track sku) {
<li>
<a [routerLink]="['/products', row.id]"
>{{ row.name }} ({{ showExtended ? sku.fraction + ' ' + row.fractionUnits + ' = 1 ' : ''
}}{{ sku.units }})</a
>
</li>
}
</ul>
</mat-cell>
</ng-container>
@@ -41,9 +45,11 @@
<mat-header-cell *matHeaderCellDef mat-sort-header>Cost Price</mat-header-cell>
<mat-cell *matCellDef="let row">
<ul>
<li *ngFor="let sku of row.skus">
{{ sku.costPrice | currency: 'INR' }}
</li>
@for (sku of row.skus; track sku) {
<li>
{{ sku.costPrice | currency: 'INR' }}
</li>
}
</ul>
</mat-cell>
</ng-container>
@@ -53,9 +59,11 @@
<mat-header-cell *matHeaderCellDef mat-sort-header>Yield</mat-header-cell>
<mat-cell *matCellDef="let row">
<ul>
<li *ngFor="let sku of row.skus">
{{ sku.productYield | percent: '1.2-2' }}
</li>
@for (sku of row.skus; track sku) {
<li>
{{ sku.productYield | percent: '1.2-2' }}
</li>
}
</ul>
</mat-cell>
</ng-container>