Fix mediafile multi download permission

Fixes a permission issue in the mediafile list.
Without manage right, the vertical dot menu was not visible.
Also allows multi selection and selective download without manage
rights.

Fixes a ngrid css error in mediafile list

client/src/app/shared/directives/perms.directive.ts

@@ -49,7 +49,7 @@ export class PermsDirective implements OnInit, OnDestroy {
 
     /**
      * Add a true-false-condition additional to osPerms
-     * `*osPerms="'motions.can_manage';and:isRecoMode(ChangeRecoMode.Final)"`
+     * `*osPerms="permission.mediafilesCanManage; and: !isMultiSelect"`
      */
     private and = true;
 

client/src/app/site/mediafiles/components/mediafile-list/mediafile-list.component.html

@@ -5,8 +5,13 @@
     </div>
 
     <!-- Menu -->
-    <div class="menu-slot" *osPerms="'mediafiles.can_manage'">
-        <button type="button" mat-icon-button (click)="createNewFolder(newFolderDialog)" *ngIf="!isMultiSelect">
+    <div class="menu-slot">
+        <button
+            type="button"
+            mat-icon-button
+            (click)="createNewFolder(newFolderDialog)"
+            *osPerms="permission.mediafilesCanManage; and: !isMultiSelect"
+        >
             <mat-icon>create_new_folder</mat-icon>
         </button>
         <button type="button" mat-icon-button [matMenuTriggerFor]="mediafilesMenu">
@@ -182,7 +187,7 @@
 <!-- Menu for single files in the list -->
 <mat-menu #singleMediafileMenu="matMenu">
     <ng-template matMenuContent let-mediafile="mediafile">
-        <div *osPerms="'core.can_manage_logos_and_fonts'">
+        <div *osPerms="permission.coreCanManageLogosAndFonts">
             <!-- Exclusive for images -->
             <div *ngIf="mediafile.isImage()">
                 <div *ngFor="let action of logoActions">
@@ -233,7 +238,7 @@
             <mat-icon>cloud_download</mat-icon>
             <span>{{ 'Download folder' | translate }}</span>
         </button>
-        <button mat-menu-item *osPerms="'mediafiles.can_manage'" (click)="toggleMultiSelect()">
+        <button mat-menu-item (click)="toggleMultiSelect()">
             <mat-icon>library_add</mat-icon>
             <span>{{ 'Multiselect' | translate }}</span>
         </button>
@@ -243,7 +248,12 @@
             <mat-icon>cloud_download</mat-icon>
             <span>{{ 'Download' | translate }}</span>
         </button>
-        <button mat-menu-item [disabled]="!selectedRows.length" (click)="move(moveDialog, selectedRows)">
+        <button
+            mat-menu-item
+            *osPerms="permission.mediafilesCanManage"
+            [disabled]="!selectedRows.length"
+            (click)="move(moveDialog, selectedRows)"
+        >
             <mat-icon>near_me</mat-icon>
             <span>{{ 'Move' | translate }}</span>
         </button>
@@ -256,10 +266,10 @@
             <mat-icon>clear</mat-icon>
             <span>{{ 'Deselect all' | translate }}</span>
         </button>
-        <mat-divider></mat-divider>
+        <mat-divider *osPerms="permission.mediafilesCanManage"></mat-divider>
         <button
             mat-menu-item
-            *osPerms="'mediafiles.can_manage'"
+            *osPerms="permission.mediafilesCanManage"
             [disabled]="!selectedRows.length"
             (click)="deleteSelected()"
         >

client/src/app/site/mediafiles/components/mediafile-list/mediafile-list.component.scss

@@ -63,6 +63,16 @@ $navbar-size: 64px;
         font-size: 90%;
     }
 
+    /**
+    * Compilcated ngrid hack: The meta row won't disappear (just like that)
+    * Select the first ever container pbl-ngrid-container div and hide
+    */
+    .pbl-ngrid-container {
+        > div {
+            height: 0;
+        }
+    }
+
     .pbl-ngrid-row {
         $size: 60px;
         height: $size !important;