Chore: Moved from css to sass, god knows what to do now.

Chore: Prettier line length changed to 120 from 100
Fix: Hard coded the face as the primary color to make the buttons stand out

bookie/src/app/product/product-detail/product-detail.component.html

@@ -50,8 +50,6 @@
   </mat-card-content>
   <mat-card-actions>
     <button mat-raised-button color="primary" class="mr-5" (click)="save()">Save</button>
-    <button mat-raised-button color="warn" (click)="confirmDelete()" *ngIf="!!item.id">
-      Delete
-    </button>
+    <button mat-raised-button color="warn" (click)="confirmDelete()" *ngIf="!!item.id">Delete</button>
   </mat-card-actions>
 </mat-card>

bookie/src/app/product/product-list/product-list.component.html

@@ -95,17 +95,11 @@
       <!-- Quantity Column -->
       <ng-container matColumnDef="quantity">
         <mat-header-cell *matHeaderCellDef class="right">Quantity</mat-header-cell>
-        <mat-cell *matCellDef="let row" class="right">{{
-          row.quantity | number : '1.2-2'
-        }}</mat-cell>
+        <mat-cell *matCellDef="let row" class="right">{{ row.quantity | number : '1.2-2' }}</mat-cell>
       </ng-container>
 
       <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
-      <mat-row
-        *matRowDef="let row; columns: displayedColumns"
-        cdkDrag
-        [cdkDragData]="row"
-      ></mat-row>
+      <mat-row *matRowDef="let row; columns: displayedColumns" cdkDrag [cdkDragData]="row"></mat-row>
     </mat-table>
   </mat-card-content>
 </mat-card>

bookie/src/app/product/product-list/product-list.component.ts

@@ -23,11 +23,7 @@ export class ProductListComponent implements OnInit {
   searchFilter: Observable<string> = new Observable();
   menuCategoryFilter: BehaviorSubject<string> = new BehaviorSubject('');
   data: BehaviorSubject<Product[]> = new BehaviorSubject<Product[]>([]);
-  dataSource: ProductListDataSource = new ProductListDataSource(
-    this.searchFilter,
-    this.menuCategoryFilter,
-    this.data,
-  );
+  dataSource: ProductListDataSource = new ProductListDataSource(this.searchFilter, this.menuCategoryFilter, this.data);
 
   form: FormGroup<{
     menuCategory: FormControl<string | null>;
@@ -37,14 +33,7 @@ export class ProductListComponent implements OnInit {
   list: Product[] = [];
   menuCategories: MenuCategory[] = [];
   /** Columns displayed in the table. Columns IDs can be added, removed, or reordered. */
-  displayedColumns: string[] = [
-    'name',
-    'price',
-    'menuCategory',
-    'saleCategory',
-    'info',
-    'quantity',
-  ];
+  displayedColumns: string[] = ['name', 'price', 'menuCategory', 'saleCategory', 'info', 'quantity'];
 
   constructor(
     private route: ActivatedRoute,
@@ -59,10 +48,7 @@ export class ProductListComponent implements OnInit {
     this.data.subscribe((data: Product[]) => {
       this.list = data;
     });
-    this.searchFilter = this.form.controls.filter.valueChanges.pipe(
-      debounceTime(150),
-      distinctUntilChanged(),
-    );
+    this.searchFilter = this.form.controls.filter.valueChanges.pipe(debounceTime(150), distinctUntilChanged());
   }
 
   filterOn(val: string) {
@@ -70,11 +56,7 @@ export class ProductListComponent implements OnInit {
   }
 
   ngOnInit() {
-    this.dataSource = new ProductListDataSource(
-      this.searchFilter,
-      this.menuCategoryFilter,
-      this.data,
-    );
+    this.dataSource = new ProductListDataSource(this.searchFilter, this.menuCategoryFilter, this.data);
     this.route.data.subscribe((value) => {
       const data = value as { list: Product[]; menuCategories: MenuCategory[] };
       this.loadData(data.list, data.menuCategories);

bookie/src/app/product/product.service.ts

@@ -34,18 +34,14 @@ export class ProductService {
     const options = { params: new HttpParams().set('sc', id) };
     return this.http
       .get<Product[]>(`${url}/query`, options)
-      .pipe(catchError(this.log.handleError(serviceName, 'listOfSaleCategory'))) as Observable<
-      Product[]
-    >;
+      .pipe(catchError(this.log.handleError(serviceName, 'listOfSaleCategory'))) as Observable<Product[]>;
   }
 
   listIsActiveOfCategory(id: string): Observable<Product[]> {
     const options = { params: new HttpParams().set('mc', id) };
     return this.http
       .get<Product[]>(`${url}/query`, options)
-      .pipe(catchError(this.log.handleError(serviceName, 'listIsActiveOfCategory'))) as Observable<
-      Product[]
-    >;
+      .pipe(catchError(this.log.handleError(serviceName, 'listIsActiveOfCategory'))) as Observable<Product[]>;
   }
 
   save(product: Product): Observable<void> {
@@ -63,9 +59,7 @@ export class ProductService {
   updateSortOrder(list: Product[]): Observable<Product[]> {
     return this.http
       .post<Product[]>(`${url}/list`, list, httpOptions)
-      .pipe(catchError(this.log.handleError(serviceName, 'updateSortOrder'))) as Observable<
-      Product[]
-    >;
+      .pipe(catchError(this.log.handleError(serviceName, 'updateSortOrder'))) as Observable<Product[]>;
   }
 
   saveOrUpdate(product: Product): Observable<void> {