feat: Use list for missions

frontend/src/app/mission/mission-list.component.html

 <div *ngIf="state === requestState.ERROR">
   Error occured: {{ errorMessage }}
 </div>
-<div *ngIf="state === requestState.SUCCESS">
-  <table mat-table [dataSource]="missions" class="w-full">
-    <ng-container matColumnDef="name">
-      <th mat-header-cell *matHeaderCellDef>Name</th>
-      <td mat-cell *matCellDef="let mission">
-        {{ mission.name }}
-      </td>
-    </ng-container>
+<div *ngIf="state === requestState.SUCCESS" class="main-container">
+  <mat-action-list>
+    <mat-list-item *ngFor="let mission of missions" [routerLink]="['/auth/mission/', mission.id]">
+      <p matLine class="!text-xs !tracking-widest uppercase"> {{mission.country.name}} </p>
+      <p matLine> {{mission.name}} </p>
+      <mat-divider></mat-divider>
+    </mat-list-item>
+  </mat-action-list>
 
-    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
-    <tr
-      mat-row
-      class="hover:bg-gray-200"
-      routerLink="../mission/{{ row.id }}"
-      *matRowDef="let row; columns: displayedColumns"
-    ></tr>
-  </table>
+  <button mat-fab color="accent" class="!fixed right-8 bottom-20" aria-label="Example icon button with a delete icon">
+    <mat-icon>add</mat-icon>
+  </button>
 </div>

frontend/src/app/mission/mission-list.component.ts

@@ -6,11 +6,6 @@ import { environment } from '../../environments/environment';
 import { RequestState } from '../request-state.enum';
 import { Mission } from './mission.interface';
 
-interface MissionTableItem {
-  id: string;
-  name: string;
-}
-
 @Component({
   selector: 'mission-list',
   templateUrl: 'mission-list.component.html',
@@ -19,7 +14,7 @@ export class MissionListComponent implements OnInit {
   requestState = RequestState;
   state: RequestState = this.requestState.PENDING;
   errorMessage = '';
-  missions: MissionTableItem[] = [];
+  missions: Mission[] = [];
   displayedColumns: string[] = ['name'];
 
   constructor(private httpClient: HttpClient, private router: Router) {}