Archive improvements

Began UI for viewing/modifying archives

src/app/components/archive-viewer/archive-viewer.component.html

@@ -0,0 +1,51 @@
+<!-- (selectionChange)="sidePanelModeChanged($event.value)" -->
+
+<div [hidden]="!(archives && archives.length > 0)">
+    <div style="overflow: hidden;" class="mat-elevation-z8">
+        <mat-table style="overflow: hidden" matSort [dataSource]="dataSource">
+      
+          <!-- Date Column -->
+          <ng-container matColumnDef="timestamp">
+            <mat-header-cell *matHeaderCellDef mat-sort-header> <ng-container i18n="Date">Date</ng-container> </mat-header-cell>
+            <mat-cell *matCellDef="let element"> {{element.timestamp | date: 'short'}} </mat-cell>
+          </ng-container>
+      
+          <!-- Title Column -->
+          <ng-container matColumnDef="title">
+            <mat-header-cell *matHeaderCellDef mat-sort-header> <ng-container i18n="Title">Title</ng-container> </mat-header-cell>
+            <mat-cell *matCellDef="let element">
+                <span class="one-line" [matTooltip]="element.title ? element.title : null">
+                    {{element.title}}
+                </span>
+            </mat-cell>
+          </ng-container>
+      
+           <!-- ID Column -->
+           <ng-container matColumnDef="id">
+            <mat-header-cell *matHeaderCellDef mat-sort-header> <ng-container i18n="ID">ID</ng-container> </mat-header-cell>
+            <mat-cell *matCellDef="let element">
+                <span class="one-line" [matTooltip]="element.title ? element.title : null">
+                    {{element.id}}
+                </span>
+            </mat-cell>
+          </ng-container>
+
+          <!-- Extractor Column -->
+          <ng-container matColumnDef="extractor">
+            <mat-header-cell *matHeaderCellDef mat-sort-header> <ng-container i18n="Extractor">Extractor</ng-container> </mat-header-cell>
+            <mat-cell *matCellDef="let element">
+                <span class="one-line" [matTooltip]="element.extractor? element.extractor : null">
+                    {{element.extractor}}
+                </span>
+            </mat-cell>
+          </ng-container>
+      
+            <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
+            <mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
+        </mat-table>
+      </div>
+</div>
+
+<div *ngIf="(!archives || archives.length === 0)">
+  <h4 style="text-align: center; margin-top: 10px;" i18n="Archives empty">Archives empty</h4>
+</div>

src/app/components/archive-viewer/archive-viewer.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ArchiveViewerComponent } from './archive-viewer.component';
+
+describe('ArchiveViewerComponent', () => {
+  let component: ArchiveViewerComponent;
+  let fixture: ComponentFixture<ArchiveViewerComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ ArchiveViewerComponent ]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(ArchiveViewerComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/components/archive-viewer/archive-viewer.component.ts

@@ -0,0 +1,41 @@
+import { Component, ViewChild } from '@angular/core';
+import { MatSort } from '@angular/material/sort';
+import { MatTableDataSource } from '@angular/material/table';
+import { Archive } from 'api-types/models/Archive';
+import { PostsService } from 'app/posts.services';
+
+@Component({
+  selector: 'app-archive-viewer',
+  templateUrl: './archive-viewer.component.html',
+  styleUrls: ['./archive-viewer.component.scss']
+})
+export class ArchiveViewerComponent {
+  archives = null;
+  displayedColumns: string[] = ['timestamp', 'title', 'id', 'extractor'];
+  dataSource = null;
+  archives_retrieved = false;
+
+  @ViewChild(MatSort) sort: MatSort;
+  
+  constructor(private postsService: PostsService) {
+
+  }
+
+  filterSelectionChanged(value: string): void {
+    this.getArchives(value);
+  }
+
+  getArchives(sub_id: string = null): void {
+    this.postsService.getArchives(sub_id).subscribe(res => {
+      if (res['archives'] !== null 
+        && res['archives'] !== undefined
+        && JSON.stringify(this.archives) !== JSON.stringify(res['archives'])) {
+          this.archives = res['archives']
+          this.dataSource = new MatTableDataSource<Archive>(this.archives);
+          this.dataSource.sort = this.sort;
+      } else {
+        // failed to get downloads
+      }
+    });
+  }
+}