harmonize search for libraries

3 files changed, 24 insertions, 2 deletions

diff --git a/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.html b/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.html
index 98a2039cc..854126443 100644
--- a/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.html
+++ b/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.html
@@ -45,7 +45,12 @@
         <ng-container *ngIf="isVideoImportFailed(videoImport)"></ng-container>
       </td>
 
-      <td>{{ videoImport.state.label }}</td>
+      <td>
+        <span class="badge" [ngClass]="getVideoImportStateClass(videoImport.state)">
+          {{ videoImport.state.label }}
+        </span>
+      </td>
+
       <td>{{ videoImport.createdAt | date: 'short' }}</td>
 
       <td class="action-cell">
diff --git a/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.scss b/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.scss
index bdd2f8270..a93c28028 100644
--- a/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.scss
+++ b/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.scss
@@ -7,4 +7,8 @@ pre {
 
 .video-import-error {
   color: red;
-}
\ No newline at end of file
+}
+
+.badge {
+  @include table-badge;
+}
diff --git a/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.ts b/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.ts
index 42ddb0ee2..9dd5ef142 100644
--- a/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.ts
+++ b/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.ts
@@ -30,6 +30,19 @@ export class MyAccountVideoImportsComponent extends RestTable implements OnInit
     return 'MyAccountVideoImportsComponent'
   }
 
+  getVideoImportStateClass (state: VideoImportState) {
+    switch (state) {
+      case VideoImportState.FAILED:
+        return 'badge-red'
+      case VideoImportState.REJECTED:
+        return 'badge-banned'
+      case VideoImportState.PENDING:
+        return 'badge-yellow'
+      default:
+        return 'badge-green'
+    }
+  }
+
   isVideoImportSuccess (videoImport: VideoImport) {
     return videoImport.state.id === VideoImportState.SUCCESS
   }