Handle empty arrays and other oddities in tags from the API

floogulinc · Mar 13, 2021 · 090d27d · 090d27d
1 parent 3331905
commit 090d27d
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 9 deletions.
diff --git a/src/app/file-info-sheet/file-info-sheet.component.html b/src/app/file-info-sheet/file-info-sheet.component.html
@@ -35,16 +35,16 @@ <h2 mat-dialog-title>File Info</h2>
 </mat-expansion-panel>
 <br>
 
-<div *ngIf="tags && Object.keys(tags).length > 1">
+<div *ngIf="tags && tags.length > 1">
   <h3 class="mat-subheading-2">Tags</h3>
   <mat-accordion multi>
-  <mat-expansion-panel *ngFor="let service of tags | keyvalue" >
+  <mat-expansion-panel *ngFor="let service of tags" >
     <mat-expansion-panel-header>
-      {{service.key}} ({{service.value[0]?.length}})
+      {{service.serviceName}} ({{service.statuses[0].length}})
     </mat-expansion-panel-header>
     <ng-template matExpansionPanelContent>
       <mat-chip-list class="mat-chip-list-stacked" aria-orientation="vertical" aria-label="File tags">
-        <mat-chip *ngFor="let tag of (service.value[0] | orderBy)" [selectable]="false" class="tag-chip" [ngClass]="'tag-namespace-' + this.tagUtils.getNamespaceNoSpace(tag)">
+        <mat-chip *ngFor="let tag of (service.statuses[0] | orderBy)" [selectable]="false" class="tag-chip" [ngClass]="'tag-namespace-' + this.tagUtils.getNamespaceNoSpace(tag)">
           {{tag}}
         </mat-chip>
       </mat-chip-list>

diff --git a/src/app/file-info-sheet/file-info-sheet.component.ts b/src/app/file-info-sheet/file-info-sheet.component.ts
@@ -31,15 +31,15 @@ export class FileInfoSheetComponent {
   tagUtils = TagUtils;
   Object = Object;
 
-  tags: ServiceNamesToStatusesToTags;
-
   constructor(
     @Inject(MAT_BOTTOM_SHEET_DATA) public data: {file: HydrusFile},
     private filesService: HydrusFilesService,
     private snackbar: MatSnackBar
-  ) {
-    this.tags = TagUtils.tagsObjectFromFile(data.file);
-  }
+  ) { }
+
+  tags = Object.entries(TagUtils.tagsObjectFromFile(this.data.file))
+    .filter(([serviceName, statuses]) => statuses[0] && statuses[0].length > 0)
+    .map(([serviceName, statuses]) => ({serviceName, statuses}));
 
   get fileIcon() {
     switch (this.data.file.file_type) {