<!--
  ~ Licensed to the Apache Software Foundation (ASF) under one or more
  ~ contributor license agreements.  See the NOTICE file distributed with
  ~ this work for additional information regarding copyright ownership.
  ~ The ASF licenses this file to You under the Apache License, Version 2.0
  ~ (the "License"); you may not use this file except in compliance with
  ~ the License.  You may obtain a copy of the License at
  ~
  ~     http://www.apache.org/licenses/LICENSE-2.0
  ~
  ~ Unless required by applicable law or agreed to in writing, software
  ~ distributed under the License is distributed on an "AS IS" BASIS,
  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  ~ See the License for the specific language governing permissions and
  ~ limitations under the License.
  -->

<div class="controller-service-references">
    <div *ngIf="serviceReferences == null || serviceReferences.length == 0; else hasReferences" class="value">
        No referencing components
    </div>

    <ng-template #hasReferences>
        <ng-container
            *ngTemplateOutlet="
                referenceListing;
                context: { $implicit: serviceReferences, nested: false }
            "></ng-container>
        <ng-template #referenceListing let-references let-nested="nested">
            <ul [class.nested]="nested">
                <ng-container
                    *ngTemplateOutlet="
                        nonService;
                        context: {
                            $implicit: getReferencesByType(references, 'Processor'),
                            referenceTypeLabel: 'Processors'
                        }
                    "></ng-container>
                <ng-container
                    *ngTemplateOutlet="
                        service;
                        context: { $implicit: getReferencesByType(references, 'ControllerService') }
                    "></ng-container>
                <ng-container
                    *ngTemplateOutlet="
                        nonService;
                        context: {
                            $implicit: getReferencesByType(references, 'ReportingTask'),
                            referenceTypeLabel: 'Reporting Tasks'
                        }
                    "></ng-container>
                <ng-container
                    *ngTemplateOutlet="
                        nonService;
                        context: {
                            $implicit: getReferencesByType(references, 'FlowAnalysisRule'),
                            referenceTypeLabel: 'Flow Analysis Rules'
                        }
                    "></ng-container>
                <ng-container
                    *ngTemplateOutlet="
                        nonService;
                        context: {
                            $implicit: getReferencesByType(references, 'ParameterProvider'),
                            referenceTypeLabel: 'Parameter Providers'
                        }
                    "></ng-container>
                <ng-container
                    *ngTemplateOutlet="
                        nonService;
                        context: {
                            $implicit: getReferencesByType(references, 'FlowRegistryClient'),
                            referenceTypeLabel: 'Registry Clients'
                        }
                    "></ng-container>
                <ng-container
                    *ngTemplateOutlet="
                        unauthorized;
                        context: { $implicit: getUnauthorized(references) }
                    "></ng-container>
            </ul>
        </ng-template>
        <ng-template #nonService let-references let-referenceTypeLabel="referenceTypeLabel">
            <ng-container *ngIf="references.length > 0">
                <li>
                    <h4>
                        <span class="value">{{ referenceTypeLabel }}</span> ({{ references.length }})
                    </h4>
                    <div class="references">
                        <div *ngFor="let reference of references" class="flex items-center gap-x-2">
                            <div>
                                <div
                                    *ngIf="isNonServiceInvalid(reference.component); else validNonService"
                                    class="invalid fa fa-warning"
                                    nifiTooltip
                                    [tooltipComponentType]="ValidationErrorsTip"
                                    [tooltipInputData]="getValidationErrorTipData(reference.component)"></div>
                            </div>
                            <ng-template #validNonService>
                                <div [ngClass]="getNonServiceStateIcon(reference.component)"></div>
                            </ng-template>
                            <a (click)="goToReferencingComponentClicked($event, reference.component)">{{
                                reference.component.name
                            }}</a>
                            <div
                                class="pointer fa fa-sticky-note-o"
                                *ngIf="hasBulletins(reference)"
                                nifiTooltip
                                [tooltipComponentType]="BulletinsTip"
                                [tooltipInputData]="getBulletinsTipData(reference)"></div>
                            <div *ngIf="hasActiveThreads(reference.component)">
                                ({{ reference.component.activeThreadCount }})
                            </div>
                        </div>
                    </div>
                </li>
            </ng-container>
        </ng-template>
        <ng-template #service let-references>
            <ng-container *ngIf="references.length > 0">
                <li>
                    <h4><span class="value">Controller Services</span> ({{ references.length }})</h4>
                    <div class="references">
                        <div *ngFor="let service of references" class="flex flex-col">
                            <div class="flex items-center gap-x-2">
                                <div>
                                    <div
                                        *ngIf="isServiceInvalid(service.component); else validService"
                                        class="invalid fa fa-warning"
                                        nifiTooltip
                                        [tooltipComponentType]="ValidationErrorsTip"
                                        [tooltipInputData]="getValidationErrorTipData(service.component)"></div>
                                </div>
                                <ng-template #validService>
                                    <div [ngClass]="getServiceStateIcon(service.component)"></div>
                                </ng-template>
                                <a
                                    (click)="goToReferencingComponentClicked($event, service.component)"
                                    mat-dialog-close="ROUTED"
                                    >{{ service.component.name }}</a
                                >
                                <div
                                    class="pointer fa fa-sticky-note-o"
                                    *ngIf="hasBulletins(service)"
                                    nifiTooltip
                                    [tooltipComponentType]="BulletinsTip"
                                    [tooltipInputData]="getBulletinsTipData(service)"></div>
                            </div>
                            <div>
                                <div *ngIf="service.component.referenceCycle; else noReferenceCycle" class="unset">
                                    Reference cycle detected
                                </div>
                                <ng-template #noReferenceCycle>
                                    <ng-container *ngIf="service.component.referencingComponents.length > 0">
                                        <ng-container
                                            *ngTemplateOutlet="
                                                referenceListing;
                                                context: {
                                                    $implicit: service.component.referencingComponents,
                                                    nested: true
                                                }
                                            "></ng-container>
                                    </ng-container>
                                </ng-template>
                            </div>
                        </div>
                    </div>
                </li>
            </ng-container>
        </ng-template>
        <ng-template #unauthorized let-references>
            <ng-container *ngIf="references.length > 0">
                <li>
                    <h4><span class="value">Unauthorized</span> ({{ references.length }})</h4>
                    <div class="references">
                        <div *ngFor="let reference of references" class="flex">
                            <div class="unset">{{ reference.id }}</div>
                        </div>
                    </div>
                </li>
            </ng-container>
        </ng-template>
    </ng-template>
</div>
