subscription confirmation

packages/frontend/src/app/components/events/events.html

@@ -1,9 +1,14 @@
 <h1>Gesammelte Veranstaltungen</h1>
 <p>
-    <button matButton="filled" (click)="subscribe()">Abbonieren</button>
+    @if(this.pushService.isSubscribed()){
+    <span>Aboniert<mat-icon>check</mat-icon></span
+    ><br />
     <button matButton="filled" class="secondary-btn" (click)="unsubscribe()">
         Abmelden
     </button>
+    }@else {
+    <button matButton="filled" (click)="subscribe()">Abonieren</button>
+    }
 </p>
 <div class="table-container">
     <table mat-table [dataSource]="datasource" matSort>

packages/frontend/src/app/components/events/events.ts

@@ -6,6 +6,7 @@ import {
     viewChild,
 } from '@angular/core';
 import { MatButtonModule } from '@angular/material/button';
+import { MatIconModule } from '@angular/material/icon';
 import { MatSort, MatSortModule } from '@angular/material/sort';
 import { MatTableDataSource, MatTableModule } from '@angular/material/table';
 import { parse } from 'date-fns';
@@ -15,13 +16,19 @@ import { PushService } from '../../services/push/pushService';
 
 @Component({
     selector: 'app-events',
-    imports: [MatTableModule, MatSortModule, MatButtonModule, Ellipsis],
+    imports: [
+        MatTableModule,
+        MatSortModule,
+        MatButtonModule,
+        Ellipsis,
+        MatIconModule,
+    ],
     templateUrl: './events.html',
     styleUrl: './events.scss',
     changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class Events implements OnInit {
-    private readonly pushService = inject(PushService);
+    protected readonly pushService = inject(PushService);
     protected readonly datasource = new MatTableDataSource<api.FoundEventDto>();
     protected readonly sort = viewChild.required(MatSort);
     protected readonly displayedColumns = [