pwa notifications

listify-client/src/app/account/account.component.html

@@ -54,6 +54,50 @@
             <span>Speichert...</span>
           </div>
         }
+
+        <div class="push-row">
+          <div>
+            <h3>PWA-Benachrichtigungen</h3>
+            <p>
+              Gleiche Tasks und Zeiten wie die Task-Mail. Die App braucht dafuer eine
+              Browser-Erlaubnis.
+            </p>
+          </div>
+
+          @if (!taskPush.supported()) {
+            <span class="push-state">Nicht unterstuetzt</span>
+          } @else if (taskPush.permission() === 'granted') {
+            <button
+              mat-stroked-button
+              type="button"
+              [disabled]="taskPush.saving()"
+              (click)="disablePushNotifications()"
+            >
+              @if (taskPush.saving()) {
+                <mat-progress-spinner mode="indeterminate" diameter="18" />
+              } @else {
+                <mat-icon aria-hidden="true">notifications_off</mat-icon>
+              }
+              Deaktivieren
+            </button>
+          } @else {
+            <button
+              mat-stroked-button
+              type="button"
+              [disabled]="
+                taskPush.saving() || (auth.user()?.taskDigestPreference ?? 'both') === 'none'
+              "
+              (click)="enablePushNotifications()"
+            >
+              @if (taskPush.saving()) {
+                <mat-progress-spinner mode="indeterminate" diameter="18" />
+              } @else {
+                <mat-icon aria-hidden="true">notifications_active</mat-icon>
+              }
+              Aktivieren
+            </button>
+          }
+        </div>
       </section>
     </mat-card-content>