polish icons for step lists

This commit is contained in:
Francesco Renzi
2026-01-22 12:34:20 +00:00
parent 9f96f7f3d6
commit 9ecb88f16e
4 changed files with 29 additions and 7 deletions

View File

@@ -156,6 +156,7 @@ const Icons = {
arrowUp: `<svg viewBox="0 0 16 16" width="16" height="16"><path fill="currentColor" d="M3.47 7.78a.75.75 0 0 1 0-1.06l4.25-4.25a.75.75 0 0 1 1.06 0l4.25 4.25a.751.751 0 0 1-.018 1.042.751.751 0 0 1-1.042.018L9 4.81v7.44a.75.75 0 0 1-1.5 0V4.81L4.53 7.78a.75.75 0 0 1-1.06 0Z"/></svg>`,
arrowDown: `<svg viewBox="0 0 16 16" width="16" height="16"><path fill="currentColor" d="M13.03 8.22a.75.75 0 0 1 0 1.06l-4.25 4.25a.75.75 0 0 1-1.06 0L3.47 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018l2.97 2.97V3.75a.75.75 0 0 1 1.5 0v7.44l2.97-2.97a.75.75 0 0 1 1.06 0Z"/></svg>`,
copy: `<svg viewBox="0 0 16 16" width="16" height="16"><path fill="currentColor" d="M0 6.75C0 5.784.784 5 1.75 5h1.5a.75.75 0 0 1 0 1.5h-1.5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-1.5a.75.75 0 0 1 1.5 0v1.5A1.75 1.75 0 0 1 9.25 16h-7.5A1.75 1.75 0 0 1 0 14.25ZM5 1.75C5 .784 5.784 0 6.75 0h7.5C15.216 0 16 .784 16 1.75v7.5A1.75 1.75 0 0 1 14.25 11h-7.5A1.75 1.75 0 0 1 5 9.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z"/></svg>`,
x: `<svg viewBox="0 0 16 16" width="16" height="16"><path fill="currentColor" d="M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"/></svg>`,
};
/**
@@ -458,10 +459,14 @@ function closeDebuggerPane() {
/**
* Get status icon for step
*/
function getStepStatusIcon(status) {
function getStepStatusIcon(status, result) {
switch (status) {
case 'completed':
return `<span class="dap-step-status-icon completed">${Icons.check}</span>`;
if (result === 'succeeded') {
return `<span class="dap-step-status-icon completed success">${Icons.check}</span>`;
} else {
return `<span class="dap-step-status-icon completed failed">${Icons.x}</span>`;
}
case 'current':
return `<span class="dap-step-status-icon current">${Icons.play}</span>`;
case 'pending':
@@ -485,7 +490,7 @@ function renderStepList(steps) {
stepsList = steps;
const html = steps.map((step) => {
const statusIcon = getStepStatusIcon(step.status);
const statusIcon = getStepStatusIcon(step.status, step.result);
const changeBadge = step.change ? `<span class="dap-step-badge dap-step-badge-${step.change.toLowerCase()}">[${step.change}]</span>` : '';
const typeLabel = step.type === 'uses' ? step.typeDetail || step.type : step.type;
const isPending = step.status === 'pending';