push notificaitons

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

@@ -74,6 +74,6 @@ export class Events implements OnInit {
         await this.pushService.resetSubscriptions();
     }
     protected async subscribe() {
-        this.pushService.subscribeToEvents();
+        await this.pushService.subscribeToEvents();
     }
 }

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

@@ -1,20 +1,28 @@
 <h1>Testeite für interne Berechtigung</h1>
 <p>API: {{apiStatus()}}</p>
 <p>Auth: {{authTest()}}</p>
-<button (click)="pushService.subscribeToEvents()">Subscribe</button>
-<button (click)="pushService.resetSubscriptions()">Unsubscribe</button>
-<button (click)="pushService.publishTestMessage()">TestMessage</button>
+<p>Capabilities: {{pushCaps|json}}</p>
+<pre>More Caps: {{asyncCaps()|json}}</pre>
+<button [claimGuard]="Claim.Useradmin" (click)="crawl()">Crawl</button>
+<button
+    [claimGuard]="Claim.Useradmin"
+    (click)="notifyAll()"
+    class="secondary-btn"
+    matButton="filled">
+    Notify All
+</button>
 Claim:
 <ul>
-    @let claims = this.auth.claims();
-    @if(claims) {
-<pre>
+    @let claims = this.auth.claims(); @if(claims) {
+    <pre>
 {{claims | json}}
-</pre>
+</pre
+    >
     }
 </ul>
 <details name="UserInfo:">
-<pre>
+    <pre>
 {{this.auth.userInfo() | json}}
-</pre>
+</pre
+    >
 </details>

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

@@ -6,25 +6,35 @@ import {
     inject,
     signal,
 } from '@angular/core';
+import { ClaimGuardDirective } from '../../directives/claim-guard.directive';
 import * as api from '../../generated-api/api';
 import { Authentication } from '../../services/authentication';
 import { PushService } from '../../services/push/pushService';
 
 @Component({
     selector: 'app-test',
-    imports: [JsonPipe],
+    imports: [JsonPipe, ClaimGuardDirective],
     templateUrl: './test.html',
     styleUrl: './test.scss',
     changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class Test {
     protected readonly pushService = inject(PushService);
-    protected auth = inject(Authentication);
+    protected readonly auth = inject(Authentication);
 
-    protected apiStatus = signal<string>('Waiting');
-    protected authTest = signal<string>('Waiting');
+    protected readonly apiStatus = signal<string>('Waiting');
+    protected readonly authTest = signal<string>('Waiting');
+    protected readonly Claim = api.Claim;
+    protected readonly pushCaps = {
+        serviceWorker: 'serviceWorker' in navigator,
+        pushManager: 'PushManager' in window,
+        notification: 'Notification' in window,
+        notifyPermission: Notification.permission,
+    };
+    protected asyncCaps = signal<any>(null);
 
     public constructor() {
+        this.loadCaps();
         effect(() => {
             const loggedIn = this.auth.loggedIn();
             if (!loggedIn) {
@@ -51,4 +61,22 @@ export class Test {
                 });
         });
     }
+
+    private async loadCaps() {
+        const caps = {
+            registraion: await navigator.serviceWorker.getRegistrations(),
+            subscription: await (
+                await navigator.serviceWorker.ready
+            ).pushManager.getSubscription(),
+        };
+
+        this.asyncCaps.set(caps);
+    }
+
+    protected async notifyAll() {
+        await api.notifyEvents();
+    }
+    protected async crawl() {
+        await api.crawl();
+    }
 }