<div ng-if="ConnectingServer" class="import-job">
    <span translate translate-params-name="task.Name">Import of {{name}} in progress</span>
    <div class="circular-loader">
        <div class="circular-loader-spinner"></div>
    </div>
</div>
<div ng-if="!ConnectingServer && task.Errors.length == 0" class="import-job">
    <h4>
        <i ng-class="{'ic-check-fill': task.isComplete, 'ic-loader': !task.isComplete }"></i>
        <span ng-hide="task.isComplete" translate translate-params-name="task.Name">Import of {{name}} in progress</span>
        <span ng-show="task.isComplete" translate translate-params-name="task.Name">Import of {{name}} complete</span>
    </h4>        
    <wait-area ng-if="!task.isComplete" taskid="task.ID" text="ConnectionProgress" allow-cancel="false"></wait-area>
</div>
<div ng-if="!ConnectingServer && task.Errors.length > 0" class="import-job error">
    <h4>
        <i class="ic-x-fill"></i>
        <span translate translate-params-name="error.Name">Import failed for {{name}}</span>
    </h4>
    <ul>
        <li ng-repeat="vError in task.Errors  track by vError.Property">
            {{ vError.Error | translate }}
        </li>
    </ul>
</div>