feat: image info for docker hub images

Author: Leonardo Chaia

src/app/docker-hub/docker-hub-repo-list/docker-hub-repo-list.component.html

@@ -25,6 +25,12 @@ <h2>
       </h2>
     </div>
 
+    <div>
+      <a mat-raised-button
+         (click)="imagePreview(repo)">
+        +info
+      </a>
+    </div>
     <div>
       <a mat-raised-button
          color="primary"

src/app/docker-hub/docker-hub-repo-list/docker-hub-repo-list.component.ts

@@ -5,6 +5,7 @@ import { TimoneerTabs } from '../../timoneer-tabs';
 import { DockerHubRepositoryResponse } from '../docker-hub.model';
 import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';
+import { ImagePreviewContainerComponentData } from '../../docker-image-preview/image-preview-container/image-preview-container.component';
 
 @Component({
   selector: 'tim-docker-hub-repo-list',
@@ -46,6 +47,18 @@ export class DockerHubRepoListComponent implements OnInit, OnDestroy {
     });
   }
 
+  public imagePreview(repo: { namespace: string; name: string; }) {
+    const r = `${repo.namespace}/${repo.name}`;
+    this.tabService.add(TimoneerTabs.IMAGE_PREVIEW, {
+      title: r,
+      params: {
+        image: r,
+        registry: 'https://index.docker.io/',
+        tag: 'latest'
+      } as ImagePreviewContainerComponentData
+    });
+  }
+
   public ngOnDestroy() {
     this.componetDestroyed.next();
     this.componetDestroyed.unsubscribe();