UI: Improved mobile push notification settings

ui-ngx/src/app/modules/home/pages/admin/sms-provider.component.html

@@ -59,39 +59,35 @@
       <mat-progress-bar color="warn" mode="indeterminate" *ngIf="isLoading$ | async">
       </mat-progress-bar>
       <div style="height: 4px;" *ngIf="!(isLoading$ | async)"></div>
-      <mat-card-content>
-        <section formGroupName="SLACK">
-          <mat-form-field class="mat-block">
-            <mat-label translate>admin.slack-api-token</mat-label>
-            <input matInput formControlName="botToken"/>
-          </mat-form-field>
-        </section>
+      <mat-card-content formGroupName="SLACK">
+        <mat-form-field class="mat-block" subscriptSizing="dynamic">
+          <mat-label translate>admin.slack-api-token</mat-label>
+          <input matInput formControlName="botToken"/>
+        </mat-form-field>
       </mat-card-content>
-      <mat-card-header>
+      <mat-card-header *ngIf="isSysAdmin()">
         <mat-card-title>
           <span class="mat-headline-5" translate>admin.mobile-settings</span>
         </mat-card-title>
         <span fxFlex></span>
         <!--    <div tb-help="mobileSettings"></div>-->
       </mat-card-header>
-      <mat-card-content>
-        <section formGroupName="MOBILE_APP" style="margin-bottom: 16px;">
-          <tb-file-input formControlName="firebaseServiceAccountCredentials"
-                         dropLabel="{{ 'admin.select-firebase-service-account-file' | translate }}"
-                         label="{{ 'admin.firebase-service-account-file' | translate }}"
-                         accept=".json,application/json"
-                         allowedExtensions="json"
-                         [existingFileName]="notificationSettingsForm.get('deliveryMethodsConfigs.MOBILE_APP.firebaseServiceAccountCredentialsFileName')?.value"
-                         (fileNameChanged)="notificationSettingsForm?.get('deliveryMethodsConfigs.MOBILE_APP.firebaseServiceAccountCredentialsFileName').patchValue($event)">
-          </tb-file-input>
-        </section>
-        <div fxLayout="row" fxLayoutAlign="end center" fxLayout.xs="column" fxLayoutAlign.xs="end">
-          <button mat-button mat-raised-button color="primary"
-                  [disabled]="(isLoading$ | async) || notificationSettingsForm.invalid || !notificationSettingsForm.dirty"
-                  type="submit">{{'action.save' | translate}}
-          </button>
-        </div>
+      <mat-card-content formGroupName="MOBILE_APP" *ngIf="isSysAdmin()">
+        <tb-file-input formControlName="firebaseServiceAccountCredentials"
+                       dropLabel="{{ 'admin.select-firebase-service-account-file' | translate }}"
+                       label="{{ 'admin.firebase-service-account-file' | translate }}"
+                       accept=".json,application/json"
+                       allowedExtensions="json"
+                       [existingFileName]="notificationSettingsForm.get('deliveryMethodsConfigs.MOBILE_APP.firebaseServiceAccountCredentialsFileName')?.value"
+                       (fileNameChanged)="notificationSettingsForm?.get('deliveryMethodsConfigs.MOBILE_APP.firebaseServiceAccountCredentialsFileName').patchValue($event)">
+        </tb-file-input>
       </mat-card-content>
+      <mat-card-actions fxLayoutAlign="end center" fxLayout.xs="column" fxLayoutAlign.xs="end">
+        <button mat-button mat-raised-button color="primary"
+                [disabled]="(isLoading$ | async) || notificationSettingsForm.invalid || !notificationSettingsForm.dirty"
+                type="submit">{{'action.save' | translate}}
+        </button>
+      </mat-card-actions>
     </mat-card>
   </fieldset>
 </form>

ui-ngx/src/app/modules/home/pages/admin/sms-provider.component.scss

@@ -14,5 +14,11 @@
  * limitations under the License.
  */
 :host {
+  .mat-mdc-card-header {
+    align-items: center;
+  }
 
+  .mdc-card__actions {
+    padding: 16px;
+  }
 }

ui-ngx/src/app/modules/home/pages/notification/sent/sent-notification-dialog.componet.ts

@@ -305,8 +305,7 @@ export class SentNotificationDialogComponent extends
 
   allowConfigureDeliveryMethod(deliveryMethod: NotificationDeliveryMethod): boolean {
     const tenantAllowConfigureDeliveryMethod = new Set([
-      NotificationDeliveryMethod.SLACK,
-      NotificationDeliveryMethod.MOBILE_APP
+      NotificationDeliveryMethod.SLACK
     ]);
     if (deliveryMethod === NotificationDeliveryMethod.WEB) {
       return false;
@@ -329,7 +328,6 @@ export class SentNotificationDialogComponent extends
         return '/settings/outgoing-mail';
       case NotificationDeliveryMethod.SMS:
       case NotificationDeliveryMethod.SLACK:
-      case NotificationDeliveryMethod.MOBILE_APP:
         return '/settings/notifications';
     }
   }

ui-ngx/src/app/shared/models/notification.models.ts

@@ -379,8 +379,8 @@ export enum NotificationDeliveryMethod {
   SMS = 'SMS',
   EMAIL = 'EMAIL',
   SLACK = 'SLACK',
-  MICROSOFT_TEAMS = 'MICROSOFT_TEAMS',
-  MOBILE_APP = 'MOBILE_APP'
+  MOBILE_APP = 'MOBILE_APP',
+  MICROSOFT_TEAMS = 'MICROSOFT_TEAMS'
 }
 
 export const NotificationDeliveryMethodTranslateMap = new Map<NotificationDeliveryMethod, string>([
@@ -388,8 +388,8 @@ export const NotificationDeliveryMethodTranslateMap = new Map<NotificationDelive
   [NotificationDeliveryMethod.SMS, 'notification.delivery-method.sms'],
   [NotificationDeliveryMethod.EMAIL, 'notification.delivery-method.email'],
   [NotificationDeliveryMethod.SLACK, 'notification.delivery-method.slack'],
-  [NotificationDeliveryMethod.MICROSOFT_TEAMS, 'notification.delivery-method.microsoft-teams'],
-  [NotificationDeliveryMethod.MOBILE_APP, 'notification.delivery-method.mobile-app']
+  [NotificationDeliveryMethod.MOBILE_APP, 'notification.delivery-method.mobile-app'],
+  [NotificationDeliveryMethod.MICROSOFT_TEAMS, 'notification.delivery-method.microsoft-teams']
 ]);
 
 export enum NotificationRequestStatus {