open-learning-exchange/planet

<mat-toolbar>
  <button class="btnBack" mat-icon-button routerLink="/manager">
    <mat-icon>arrow_back</mat-icon>
  </button>
  <span i18n>Reports</span>
  <span class="toolbar-fill"></span>
</mat-toolbar>
<div class="space-container">
  <mat-toolbar>
    <mat-toolbar-row class="primary-color font-size-1">
    <span i18n>Summary of Connected Planets</span>
    </mat-toolbar-row>
  </mat-toolbar>
  <div class="view-container view-full-height">
    <ng-container *ngIf="hubId === null; else singleTable">
      <mat-expansion-panel *ngFor="let hub of hubs; trackBy: trackById">
        <mat-expansion-panel-header>
          <mat-panel-title>{{hub.name}}</mat-panel-title>
          <a mat-button *ngIf="hub.hubPlanetDoc" class="margin-lr-10" (click)="viewReport(hub.hubPlanetDoc, $event)" i18n>Report</a>
        </mat-expansion-panel-header>
        <planet-reports-table [planets]="hub.children"></planet-reports-table>
      </mat-expansion-panel>
      <mat-expansion-panel>
        <mat-expansion-panel-header>
          <mat-panel-title i18n>Sandbox</mat-panel-title>
        </mat-expansion-panel-header>
        <planet-reports-table [planets]="sandboxPlanets"></planet-reports-table>
      </mat-expansion-panel>
    </ng-container>
    <ng-template #singleTable>
      <planet-reports-table [planets]="sandboxPlanets"></planet-reports-table>
    </ng-template>
  </div>
</div>