Chore: Cleaned up imports to use Modules.

Feature: Added an eslint rule to sort component imports

bookie/src/app/tables/table-detail/table-detail.component.ts

@@ -1,13 +1,13 @@
 import { AfterViewInit, Component, ElementRef, OnInit, ViewChild } from '@angular/core';
 import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
-import { MatButton } from '@angular/material/button';
-import { MatCard, MatCardHeader, MatCardTitle, MatCardContent, MatCardActions } from '@angular/material/card';
-import { MatCheckbox } from '@angular/material/checkbox';
-import { MatOption } from '@angular/material/core';
+import { MatButtonModule } from '@angular/material/button';
+import { MatCardModule } from '@angular/material/card';
+import { MatCheckboxModule } from '@angular/material/checkbox';
+import { MatOptionModule } from '@angular/material/core';
 import { MatDialog } from '@angular/material/dialog';
-import { MatFormField, MatLabel } from '@angular/material/form-field';
-import { MatInput } from '@angular/material/input';
-import { MatSelect } from '@angular/material/select';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatInputModule } from '@angular/material/input';
+import { MatSelectModule } from '@angular/material/select';
 import { ActivatedRoute, Router } from '@angular/router';
 
 import { Section } from '../../core/section';
@@ -21,19 +21,14 @@ import { TableService } from '../table.service';
   templateUrl: './table-detail.component.html',
   styleUrls: ['./table-detail.component.css'],
   imports: [
-    MatCard,
-    MatCardHeader,
-    MatCardTitle,
-    MatCardContent,
+    MatButtonModule,
+    MatCardModule,
+    MatCheckboxModule,
+    MatFormFieldModule,
+    MatInputModule,
+    MatOptionModule,
+    MatSelectModule,
     ReactiveFormsModule,
-    MatFormField,
-    MatLabel,
-    MatInput,
-    MatSelect,
-    MatOption,
-    MatCheckbox,
-    MatCardActions,
-    MatButton,
   ],
 })
 export class TableDetailComponent implements OnInit, AfterViewInit {

bookie/src/app/tables/table-list/table-list.component.ts

@@ -1,24 +1,12 @@
-import { CdkDragDrop, moveItemInArray, CdkDropList, CdkDrag } from '@angular/cdk/drag-drop';
-import { Component, OnInit, ViewChild } from '@angular/core';
-import { MatButton, MatAnchor } from '@angular/material/button';
-import { MatCard, MatCardHeader, MatCardTitleGroup, MatCardTitle, MatCardContent } from '@angular/material/card';
-import { MatIcon } from '@angular/material/icon';
-import {
-  MatTable,
-  MatColumnDef,
-  MatHeaderCellDef,
-  MatHeaderCell,
-  MatCellDef,
-  MatCell,
-  MatHeaderRowDef,
-  MatHeaderRow,
-  MatRowDef,
-  MatRow,
-} from '@angular/material/table';
+import { CdkDragDrop, moveItemInArray, DragDropModule } from '@angular/cdk/drag-drop';
+import { Component, OnInit } from '@angular/core';
+import { MatButtonModule } from '@angular/material/button';
+import { MatCardModule } from '@angular/material/card';
+import { MatIconModule } from '@angular/material/icon';
+import { MatTableModule } from '@angular/material/table';
 import { ActivatedRoute, Router, RouterLink } from '@angular/router';
 import { BehaviorSubject } from 'rxjs';
 
-import { MenuCategory } from '../../core/menu-category';
 import { Table } from '../../core/table';
 import { ToasterService } from '../../core/toaster.service';
 import { TableService } from '../table.service';
@@ -29,32 +17,10 @@ import { TableListDataSource } from './table-list-datasource';
   selector: 'app-table-list',
   templateUrl: './table-list.component.html',
   styleUrls: ['./table-list.component.css'],
-  imports: [
-    MatCard,
-    MatCardHeader,
-    MatCardTitleGroup,
-    MatCardTitle,
-    MatButton,
-    MatAnchor,
-    RouterLink,
-    MatIcon,
-    MatCardContent,
-    MatTable,
-    CdkDropList,
-    MatColumnDef,
-    MatHeaderCellDef,
-    MatHeaderCell,
-    MatCellDef,
-    MatCell,
-    MatHeaderRowDef,
-    MatHeaderRow,
-    MatRowDef,
-    MatRow,
-    CdkDrag,
-  ],
+  imports: [DragDropModule, MatButtonModule, MatCardModule, MatIconModule, MatTableModule, RouterLink],
 })
 export class TableListComponent implements OnInit {
-  @ViewChild('table', { static: true }) table?: MatTable<MenuCategory>;
+  // @ViewChild('table', { static: true }) table?: MatTable<Table>;
   data: BehaviorSubject<Table[]> = new BehaviorSubject<Table[]>([]);
   dataSource: TableListDataSource = new TableListDataSource(this.data);
   list: Table[] = [];