<ng-template [ngIf]="macro">
    <macro-header
            [macro]="macro"
            [isNew]="isNew"
    ></macro-header>
    <macro-list
        [macro]="macro"
        (add)="addAction($event.macroId, $event.action)"
        (edit)="editAction($event.macroId, $event.index, $event.action)"
        (delete)="deleteAction($event.macroId, $event.index, $event.action)"
        (reorder)="reorderAction($event.macroId, $event.oldIndex, $event.newIndex)"
    ></macro-list>
</ng-template>

<div *ngIf="!macro" class="not-found">
    There is no macro with id {{ route.params.select('id') | async }}.
</div>
