All files / app/component/template template.component.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
2x
2x
2x
 
 
 
2x
1x
 
1x
 
 
 
 
 
1x
1x
2x
2x
1x
 
1x
1x
2x
1x
 
1x
 
2x
1x
 
1x
 
2x
1x
 
1x
2x
1x
 
1x
 
2x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1x
1x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1x
 
1x
 
 
 
2x
 
 
 
 
<div class="link" [class.remote]="!local" [title]="template.config?.description || ''">
  @if (template.tag) {
    <a [routerLink]="['/tags', template.tag]">{{ template.name || template.tag }}</a>
  } @else {
    <a routerLink="/tags">{{ template.name || 'root' }}</a>
  }
  @if (!qualifiedTag) {
    <span class="host" i18n>(root: "")</span>
  } @else if (!template.tag && template.origin) {
    <span class="host" i18n>(root: {{ template.origin }})</span>
  } @else if (template.name && template.tag) {
    <span class="host">({{ qualifiedTag }})</span>
  } @else if (template.origin) {
    <span class="host">({{ template.origin }})</span>
  }
</div>
<div class="info">
  <span [title]="template.modified?.toISO()" i18n>modified {{ template.modified?.toRelative() }}</span>
  @if (!local) {
    &nbsp;<span i18n>on</span>&nbsp;<a [routerLink]="['/tag', template.origin]">{{ template.origin }}</a>
  }
</div>
<div class="actions">
  @if (!created && store.account.admin) {
    <app-confirm-action #action [action]="copy$" i18n>install</app-confirm-action>
  } @else if (!local) {
    <app-inline-button #action [action]="copy$" i18n>copy</app-inline-button>
  }
  @if (created && local && store.account.admin) {
    <a class="fake-link" (click)="editing = !editing" i18n>@if (editForm.dirty) {*edit*} @else {edit}</a>
  } @else {
    <a class="fake-link" (click)="viewSource = !viewSource" i18n>source</a>
  }
  @if (canDiff) {
    <a class="fake-link diff-link" (click)="toggleDiff()" i18n>diff</a>
  }
  <a class="fake-link" (click)="download()" i18n>download</a>
  @if (created && store.account.admin) {
    <app-confirm-action #action [action]="delete$" i18n>delete</app-confirm-action>
  }
</div>
 
@if (editing) {
  <form class="form" [formGroup]="editForm" (ngSubmit)="save()">
 
    <app-template-form [group]="editForm"
                       [configErrors]="configErrors"
                       [defaultsErrors]="defaultsErrors"
                       [schemaErrors]="schemaErrors"></app-template-form>
 
    @for (e of serverError; track e) {
      <span><!-- Unexpected Error --></span>
      <div class="error">{{ e }}</div>
    }
 
    <span><!-- Buttons --></span>
    <span class="buttons right">
      @if (saving) {
        <app-loading [inline]="true"></app-loading>
      }
      <button type="submit" [disabled]="saving || submitted && !editForm.valid" i18n>save</button>
      <button type="button" (click)="editing = false" i18n>cancel</button>
    </span>
  </form>
} @else if (viewSource) {
  <form class="form" [formGroup]="editForm">
    <app-template-form [group]="editForm"></app-template-form>
  </form>
} @else if (diffing && diffLocal && diffRemote) {
  <div class="diff-view form">
    <app-diff #diffEditor
              [original]="diffLocal"
              [modified]="diffRemote"
              [readOnly]="!store.account.admin">
    </app-diff>
 
    @for (e of serverError; track e) {
      <span><!-- Unexpected Error --></span>
      <div class="error">{{ e }}</div>
    }
 
    <span><!-- Buttons --></span>
    <span class="buttons right">
      @if (saving) {
        <app-loading [inline]="true"></app-loading>
      }
      @if (store.account.admin) {
        <button type="button" class="save-diff" [disabled]="saving" (click)="saveDiff()" i18n>save</button>
      }
      <button type="button" (click)="diffing = false" i18n>cancel</button>
    </span>
  </div>
} @else {
  @for (e of serverError; track e) {
    <div class="error">{{ e }}</div>
  }
}