Skip to content

Commit 20dce60

Browse files
authored
Merge branch 'main' into fix/log-view-interaction-problems
2 parents 714ecbd + 062e747 commit 20dce60

2 files changed

Lines changed: 203 additions & 239 deletions

File tree

web/src/app/diff/diff-view.component.html

Lines changed: 116 additions & 128 deletions
Original file line numberDiff line numberDiff line change
@@ -15,141 +15,129 @@
1515
-->
1616

1717
<div class="container">
18-
@if (diffViewViewModel | async; as diffViewModelValue) {
19-
<div class="diff-timeline-annotators">
20-
@for (annotator of timelineAnnotators | async; track annotator) {
21-
<ng-container
22-
*ngComponentOutlet="annotator.component; inputs: annotator.inputs"
23-
></ng-container>
24-
}
25-
</div>
26-
<as-split direction="vertical">
27-
<as-split-area size="50">
28-
<table
29-
class="revision-list-wrap"
30-
tabindex="0"
31-
(keydown)="keyDown($event)"
32-
>
33-
@if (diffViewModelValue.selectedTimeline === null) {
34-
<div class="all-columns"></div>
35-
} @else {
36-
<cdk-virtual-scroll-viewport class="revision-list">
37-
<ng-container
38-
*cdkVirtualFor="
39-
let revision of diffViewModelValue.selectedTimeline!
40-
.revisions;
41-
let i = index
42-
"
43-
class="revision-element"
44-
>
45-
@if (revision.logIndex !== -1) {
46-
@if ($logs | async; as logs) {
47-
@if (logs[revision.logIndex]; as log) {
48-
<tr
49-
class="revision-row"
50-
[class.selected]="
51-
diffViewModelValue.selectedLogIndex ===
52-
revision.logIndex
53-
"
54-
[class.highlight]="
55-
diffViewModelValue.highlightedLogIndex.has(
56-
revision.logIndex
57-
)
58-
"
18+
@let timeline = selectedTimeline();
19+
<div class="diff-timeline-annotators">
20+
@for (annotator of timelineAnnotators | async; track annotator) {
21+
<ng-container
22+
*ngComponentOutlet="annotator.component; inputs: annotator.inputs"
23+
></ng-container>
24+
}
25+
</div>
26+
<as-split direction="vertical">
27+
<as-split-area size="50">
28+
<table
29+
class="revision-list-wrap"
30+
tabindex="0"
31+
(keydown)="keyDown($event)"
32+
>
33+
@if (timeline === null) {
34+
<div class="all-columns"></div>
35+
} @else {
36+
@let li = selectedLogIndex();
37+
@let hlis = highlightedLogIndices();
38+
@let logs = allLogs();
39+
<cdk-virtual-scroll-viewport class="revision-list">
40+
<ng-container
41+
*cdkVirtualFor="let revision of timeline.revisions; let i = index"
42+
class="revision-element"
43+
>
44+
@if (revision.logIndex !== -1) {
45+
@if (logs[revision.logIndex]; as log) {
46+
<tr
47+
class="revision-row"
48+
[class.selected]="li === revision.logIndex"
49+
[class.highlight]="hlis.has(revision.logIndex)"
50+
>
51+
<td
52+
class="index"
53+
(click)="_selectRevision(revision)"
54+
(mouseover)="_highlightRevision(revision)"
55+
>
56+
{{ i }}
57+
</td>
58+
<td
59+
class="ts"
60+
(click)="_selectRevision(revision)"
61+
(mouseover)="_highlightRevision(revision)"
62+
>
63+
{{ revision.startAt | tsf | async }}
64+
</td>
65+
<td
66+
class="operation"
67+
(click)="_selectRevision(revision)"
68+
(mouseover)="_highlightRevision(revision)"
69+
>
70+
<span
71+
class="operation-span"
72+
[ngClass]="revision.verbCSSClass"
5973
>
60-
<td
61-
class="index"
62-
(click)="_selectRevision(revision)"
63-
(mouseover)="_highlightRevision(revision)"
64-
>
65-
{{ i }}
66-
</td>
67-
<td
68-
class="ts"
69-
(click)="_selectRevision(revision)"
70-
(mouseover)="_highlightRevision(revision)"
71-
>
72-
{{ revision.startAt | tsf | async }}
73-
</td>
74-
<td
75-
class="operation"
76-
(click)="_selectRevision(revision)"
77-
(mouseover)="_highlightRevision(revision)"
74+
{{ revision.verbLabel }}
75+
</span>
76+
</td>
77+
@if (revision.requestor | parsePrincipal; as author) {
78+
<td
79+
class="author"
80+
(click)="_selectRevision(revision)"
81+
(mouseover)="_highlightRevision(revision)"
82+
>
83+
<span>by</span>
84+
<span
85+
class="author-type"
86+
[ngClass]="author.type | lowercase"
87+
>{{ author.type }}</span
7888
>
79-
<span
80-
class="operation-span"
81-
[ngClass]="revision.verbCSSClass"
82-
>
83-
{{ revision.verbLabel }}
84-
</span>
85-
</td>
86-
@if (revision.requestor | parsePrincipal; as author) {
87-
<td
88-
class="author"
89-
(click)="_selectRevision(revision)"
90-
(mouseover)="_highlightRevision(revision)"
91-
>
92-
<span>by</span>
93-
<span
94-
class="author-type"
95-
[ngClass]="author.type | lowercase"
96-
>{{ author.type }}</span
97-
>
98-
<span class="author-name">{{ author.short }}</span>
99-
</td>
100-
}
101-
</tr>
89+
<span class="author-name">{{ author.short }}</span>
90+
</td>
10291
}
103-
}
92+
</tr>
10493
}
105-
</ng-container>
106-
</cdk-virtual-scroll-viewport>
107-
}
108-
</table>
109-
</as-split-area>
110-
<as-split-area size="50">
111-
@if ((timeline | async) === null) {
112-
<div>
113-
<p class="empty-message">No resource selected</p>
114-
</div>
115-
} @else {
116-
@if (diffViewModelValue.currentRevision !== null) {
117-
<div class="diff">
118-
<khi-diff-toolbar
119-
[(showManagedFields)]="showManagedFields"
120-
(openInNewTab)="openDiffInAnotherWindow()"
121-
(copyContent)="copy(diffViewModelValue.currentRevisionContent)"
122-
>
123-
</khi-diff-toolbar>
124-
<div class="diff-inner">
125-
@if (diffViewModelValue.previousRevision !== null) {
126-
@if (
127-
diffViewModelValue.currentRevisionContent !==
128-
diffViewModelValue.previousRevisionContent
129-
) {
130-
<ngx-unified-diff
131-
class="ngx-diff-light-theme"
132-
[before]="diffViewModelValue.previousRevisionContent"
133-
[after]="diffViewModelValue.currentRevisionContent"
134-
>
135-
</ngx-unified-diff>
136-
} @else {
137-
<pre
138-
class="log-body-container"
139-
><code [highlight]="diffViewModelValue.currentRevisionContent" language="yaml" lineNumbers></code></pre>
140-
}
141-
} @else {
94+
}
95+
</ng-container>
96+
</cdk-virtual-scroll-viewport>
97+
}
98+
</table>
99+
</as-split-area>
100+
<as-split-area size="50">
101+
@if (timeline === null) {
102+
<div>
103+
<p class="empty-message">No resource selected</p>
104+
</div>
105+
} @else {
106+
@let cr = currentRevision();
107+
@if (cr !== null) {
108+
<div class="diff">
109+
<khi-diff-toolbar
110+
[(showManagedFields)]="showManagedFields"
111+
(openInNewTab)="openDiffInAnotherWindow()"
112+
(copyContent)="copy(currentRevisionContent())"
113+
>
114+
</khi-diff-toolbar>
115+
<div class="diff-inner">
116+
@let pr = previousRevision();
117+
@if (pr !== null) {
118+
@if (currentRevisionContent() !== previousRevisionContent()) {
142119
<ngx-unified-diff
143120
class="ngx-diff-light-theme"
144-
before=""
145-
[after]="diffViewModelValue.currentRevisionContent"
146-
></ngx-unified-diff>
121+
[before]="previousRevisionContent()"
122+
[after]="currentRevisionContent()"
123+
>
124+
</ngx-unified-diff>
125+
} @else {
126+
<pre
127+
class="log-body-container"
128+
><code [highlight]="currentRevisionContent()" language="yaml" lineNumbers></code></pre>
147129
}
148-
</div>
130+
} @else {
131+
<ngx-unified-diff
132+
class="ngx-diff-light-theme"
133+
before=""
134+
[after]="currentRevisionContent()"
135+
></ngx-unified-diff>
136+
}
149137
</div>
150-
}
138+
</div>
151139
}
152-
</as-split-area>
153-
</as-split>
154-
}
140+
}
141+
</as-split-area>
142+
</as-split>
155143
</div>

0 commit comments

Comments
 (0)