<!--
  ~ 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 style="margin: 15px; padding: 15px; background-color: white">
  <nz-spin [nzSpinning]="isLoading">
    <article nz-typography>
      <h3 nz-typography>{{ 'Version' | translate }} {{ modelVersion }}</h3>
      <p nz-typography>
        <span><strong>{{ 'Stage' | translate }}: </strong></span>
        {{ isLoading ? null : modelVersionInfo.currentStage }}
      </p>
      <p nz-typography>
        <span><strong>{{ 'User id' | translate }}: </strong></span>
        {{ isLoading ? null : modelVersionInfo.userId }}
      </p>
      <p nz-typography>
        <span><strong>{{ 'Experiment id' | translate }}: </strong></span>
        <span *ngIf="!isLoading">
          <a href="/workbench/experiment/info/{{modelVersionInfo.experimentId}}">{{ modelVersionInfo.experimentId }}</a>
        </span>
      </p>
      <p nz-typography>
        <span><strong>{{ 'Dataset' | translate }}: </strong></span>
        {{ isLoading ? null : modelVersionInfo.dataset }}
      </p>
      <p nz-typography>
        <span><strong>{{ 'Create Time' | translate }}: </strong></span>
        {{ isLoading ? null : modelVersionInfo.creationTime }}
      </p>
      <p nz-typography>
        <span><strong>{{ 'Last Updated' | translate }}: </strong></span>
        {{ isLoading ? null : modelVersionInfo.lastUpdatedTime }}
      </p>
      <p nz-typography>
        <span><strong>{{ 'Tags' | translate }}: </strong></span>
        <span  *ngIf="!isLoading">
          <submarine-model-tags [modelName]="modelName" [modelVersion]="modelVersion" [tags]="modelVersionInfo.tags" [useVersionTags]="true"></submarine-model-tags>
        </span>
      </p>
      <p nz-typography>
        <span><strong>{{ 'Description' | translate }}: </strong></span>
        {{ isLoading ? null : modelVersionInfo.description }}
      </p>
    </article>
  </nz-spin>
</div>