Skip to content

Commit 6005085

Browse files
espyespy
committed
dashboard/bugtriage: implement feedback
1 parent 8667fda commit 6005085

1 file changed

Lines changed: 57 additions & 20 deletions

File tree

‎scripts/dashboard/bugtriage/index.html‎

Lines changed: 57 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,11 @@
1111
<link rel="icon" type="image/png" sizes="32x32" href="../resources/favicon-32x32.png">
1212
<link rel="icon" type="image/png" sizes="16x16" href="../resources/favicon-16x16.png">
1313
<style>
14+
15+
body {
16+
font-size: 0.9rem;
17+
}
18+
1419
body>main {
1520
padding-block-start: 0;
1621
}
@@ -32,13 +37,27 @@
3237

3338
.sidebar {
3439
border-left: 1px solid #ddd;
35-
width: 20rem;
40+
width: 11rem;
41+
flex-shrink: 0;
42+
}
43+
44+
th,
45+
td {
46+
padding-inline: 0.25em;
47+
}
48+
49+
tr {
50+
vertical-align: top;
3651
}
3752

3853
tr td:nth-child(2) {
3954
word-break: break-word;
4055
}
4156

57+
th:last-of-type span {
58+
justify-content: end;
59+
}
60+
4261
#table-of-contents {
4362
position: fixed;
4463
margin: 0.5em 1em;
@@ -77,8 +96,15 @@
7796
.reload-button::after {
7897
content: "↻";
7998
font-size: 1.25rem;
99+
display: inline-block;
100+
}
101+
102+
.spin:after {
103+
animation: spinner 2s infinite linear;
80104
}
81105

106+
@keyframes spinner {to{transform: rotate(1turn)}}
107+
82108
[href="#top"] {
83109
cursor: pointer;
84110
text-decoration: none;
@@ -87,9 +113,9 @@
87113
}
88114

89115
.table-container {
90-
overflow-x: auto;
116+
margin-inline-start: 0;
91117
margin-inline-end: 0;
92-
max-width: calc(100vw - 20rem);
118+
max-width: calc(100vw - 14rem);
93119
}
94120

95121
th {
@@ -105,9 +131,12 @@
105131
}
106132

107133
th span:after {
108-
content: "⏶⏷";
134+
content: "";
135+
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3C!--!Font Awesome Free v7.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2026 Fonticons, Inc.--%3E%3Cpath d='M130.4 268.2C135.4 280.2 147 288 160 288L480 288C492.9 288 504.6 280.2 509.6 268.2C514.6 256.2 511.8 242.5 502.7 233.3L342.7 73.3C330.2 60.8 309.9 60.8 297.4 73.3L137.4 233.3C128.2 242.5 125.5 256.2 130.5 268.2zM130.4 371.7C125.4 383.7 128.2 397.4 137.3 406.6L297.3 566.6C309.8 579.1 330.1 579.1 342.6 566.6L502.6 406.6C511.8 397.4 514.5 383.7 509.5 371.7C504.5 359.7 492.9 352 480 352L160 352C147.1 352 135.4 359.8 130.4 371.8z'/%3E%3C/svg%3E");
109136
color: #111;
110137
opacity: 0.25;
138+
width: 1em;
139+
height: 1em;
111140
}
112141

113142
@media (prefers-color-scheme: dark) {
@@ -117,12 +146,14 @@
117146
}
118147

119148
th[aria-sort="ascending"] span:after {
120-
content: "⏶";
149+
content: "";
150+
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3C!--!Font Awesome Free v7.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2026 Fonticons, Inc.--%3E%3Cpath d='M160 288C147.1 288 135.4 280.2 130.4 268.2C125.4 256.2 128.2 242.5 137.4 233.4L297.4 73.4C309.9 60.9 330.2 60.9 342.7 73.4L502.7 233.4C511.9 242.6 514.6 256.3 509.6 268.3C504.6 280.3 492.9 288 480 288L160 288z'/%3E%3C/svg%3E");
121151
opacity: 1;
122152
}
123153

124154
th[aria-sort="descending"] span:after {
125-
content: "⏷";
155+
content: "";
156+
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3C!--!Font Awesome Free v7.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2026 Fonticons, Inc.--%3E%3Cpath d='M160 352C147.1 352 135.4 359.8 130.4 371.8C125.4 383.8 128.2 397.5 137.4 406.6L297.4 566.6C309.9 579.1 330.2 579.1 342.7 566.6L502.7 406.6C511.9 397.4 514.6 383.7 509.6 371.7C504.6 359.7 492.9 352 480 352L160 352z'/%3E%3C/svg%3E");
126157
opacity: 1;
127158
}
128159

@@ -145,7 +176,7 @@
145176
padding-inline-end: 0.4em;
146177
}
147178

148-
@media (max-width: 1024px) {
179+
@media (max-width: 1023px) {
149180
body>main {
150181
padding-right: 0;
151182
}
@@ -156,8 +187,18 @@
156187
.spread {
157188
display: flex;
158189
justify-content: space-between;
190+
}
191+
.sticky {
159192
position: sticky;
193+
top: 0;
194+
margin-inline-start: calc(var(--pico-block-spacing-horizontal) * -1);
195+
padding-inline-start: var(--pico-block-spacing-horizontal);
196+
margin-block-start: calc(var(--pico-block-spacing-vertical) * -1);
197+
padding-block-start: var(--pico-block-spacing-vertical);
198+
background-color: white;
199+
z-index: 1;
160200
}
201+
161202
body.show-nav .sidebar{
162203
transform: translateX(0em);
163204
}
@@ -171,6 +212,7 @@
171212
width: auto;
172213
transition: all 0.5s;
173214
overflow-y: auto;
215+
z-index: 2;
174216
}
175217
#table-of-contents {
176218
position: relative;
@@ -180,8 +222,13 @@
180222
margin-inline: 0;
181223
}
182224
.table-container {
225+
overflow-x: auto;
183226
max-width: 95vw;
184227
}
228+
/* make summary column fixed width on small screens */
229+
td:nth-child(2) {
230+
min-width: 30ch;
231+
}
185232
}
186233
</style>
187234
</head>
@@ -213,7 +260,7 @@
213260
</div>
214261
</div>
215262
<div class="content">
216-
<div class="spread">
263+
<div class="spread sticky">
217264
<h1 id="top" class="with-logo">Yocto Project Bug Triage</h1>
218265
<div id="nav-drawer-open">≡</div>
219266
</div>
@@ -251,7 +298,6 @@ <h4>Security-related</h4>
251298
<span>
252299
<h4>Unprioritised<span class="bug-count"></span><a class="reload-button" onclick="reloadTable('#unprioritised');">Reload Bugs</a></h4>
253300
</span>
254-
<a href="#top">Back to top ⏶</a>
255301
</span>
256302
<p>
257303
Bugs without a priority, that need a priority, target milestone, and owner assigned.
@@ -264,7 +310,6 @@ <h4>Unprioritised<span class="bug-count"></span><a class="reload-button" onclick
264310
<span>
265311
<h4>High<span class="bug-count"></span><a class="reload-button" onclick="reloadTable('#high');">Reload Bugs</a></h4>
266312
</span>
267-
<a href="#top">Back to top ⏶</a>
268313
</span>
269314
<p>
270315
All open high-priority bugs.
@@ -277,7 +322,6 @@ <h4>High<span class="bug-count"></span><a class="reload-button" onclick="reloadT
277322
<span>
278323
<h4>Reopened<span class="bug-count"></span><a class="reload-button" onclick="reloadTable('#reopened');">Reload Bugs</a></h4>
279324
</span>
280-
<a href="#top">Back to top ⏶</a>
281325
</span>
282326
<p>
283327
Bugs that have been reopened. The owner should be reviewed and the bug
@@ -291,7 +335,6 @@ <h4>Reopened<span class="bug-count"></span><a class="reload-button" onclick="rel
291335
<span>
292336
<h4>Autobuilder Intermittent<span class="bug-count"></span><a class="reload-button" onclick="reloadTable('#abint');">Reload Bugs</a></h4>
293337
</span>
294-
<a href="#top">Back to top ⏶</a>
295338
</span>
296339
<p>
297340
Bugs which are tagged as tracking intermittent failures on the
@@ -306,7 +349,6 @@ <h4>Autobuilder Intermittent<span class="bug-count"></span><a class="reload-butt
306349
<span>
307350
<h4>Need Info<span class="bug-count"></span><a class="reload-button" onclick="reloadTable('#needinfo');">Reload Bugs</a></h4>
308351
</span>
309-
<a href="#top">Back to top ⏶</a>
310352
</span>
311353
<p>
312354
All bugs that are in the NEEDINFO state, and should be reviewed to
@@ -321,7 +363,6 @@ <h4>Need Info<span class="bug-count"></span><a class="reload-button" onclick="re
321363
<span>
322364
<h4>Inactive Bugs<span class="bug-count"></span><a class="reload-button" onclick="reloadTable('#inactivebugs');">Reload Bugs</a></h4>
323365
</span>
324-
<a href="#top">Back to top ⏶</a>
325366
</span>
326367
<p>
327368
All open bugs that haven't been altered in two years.
@@ -334,7 +375,6 @@ <h4>Inactive Bugs<span class="bug-count"></span><a class="reload-button" onclick
334375
<span>
335376
<h4>Inactive Enhancements<span class="bug-count"></span><a class="reload-button" onclick="reloadTable('#inactivefeatures');">Reload Bugs</a></h4>
336377
</span>
337-
<a href="#top">Back to top ⏶</a>
338378
</span>
339379
<p>
340380
All open enhancements that haven't been altered in two years.
@@ -347,7 +387,6 @@ <h4>Inactive Enhancements<span class="bug-count"></span><a class="reload-button"
347387
<span>
348388
<h4>Wrong Milestone<span class="bug-count"></span><a class="reload-button" onclick="reloadTable('#oldmilestone');">Reload Bugs</a></h4>
349389
</span>
350-
<a href="#top">Back to top ⏶</a>
351390
</span>
352391
<p>
353392
All open bugs that are targetted for a milestone in the past: they
@@ -361,7 +400,6 @@ <h4>Wrong Milestone<span class="bug-count"></span><a class="reload-button" oncli
361400
<span>
362401
<h4>Potential Newcomer<span class="bug-count"></span><a class="reload-button" onclick="reloadTable('#newcomer');">Reload Bugs</a></h4>
363402
</span>
364-
<a href="#top">Back to top ⏶</a>
365403
</span>
366404
<p>
367405
All open bugs which have been tagged as being potentially good for
@@ -375,7 +413,6 @@ <h4>Potential Newcomer<span class="bug-count"></span><a class="reload-button" on
375413
<span>
376414
<h4>Needs Testing<span class="bug-count"></span><a class="reload-button" onclick="reloadTable('#retest');">Reload Bugs</a></h4>
377415
</span>
378-
<a href="#top">Back to top ⏶</a>
379416
</span>
380417
<p>
381418
All open bugs which have been tagged as needing to be retested.
@@ -491,9 +528,9 @@ <h4>Needs Testing<span class="bug-count"></span><a class="reload-button" onclick
491528
async function searchBugs(selector, params) {
492529
// Refresh a section
493530
const table = document.querySelector(selector)
494-
table.setAttribute('aria-busy', true)
495531
const container = document.querySelector(selector).closest("section")
496532
const reloadButton = container.querySelector('.reload-button')
533+
reloadButton.classList.toggle('spin')
497534

498535
try {
499536
params.append("include_fields", Array.from(fields.keys()).join());
@@ -512,7 +549,7 @@ <h4>Needs Testing<span class="bug-count"></span><a class="reload-button" onclick
512549
console.error(`Failed to fetch bugs for ${selector}: ${error}`);
513550
alert("Error fetching bugs. Check the console for details.");
514551
}
515-
table.setAttribute('aria-busy', false)
552+
reloadButton.classList.toggle('spin')
516553
}
517554

518555
async function bugsByWhiteboard(table, keyword) {

0 commit comments

Comments
 (0)