feat(ui): add delete button to RecipeSheet + fix NaNd ago + full QueueItem in POST response
All checks were successful
Build & Push Docker Image / test-and-build (push) Successful in 1m1s
All checks were successful
Build & Push Docker Image / test-and-build (push) Successful in 1m1s
- RecipeSheet: add onDelete prop and 'Remove from queue' button at bottom of sheet - +page.svelte: wire onDelete -> removeItem in RecipeSheet - POST /api/queue: return full QueueItem (with createdAt, phases) instead of stripped subset - TimelineRow: defensive relTime() handles undefined/NaN, uses createdAt ?? enqueuedAt Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
@@ -352,6 +352,7 @@
|
||||
item={selectedItem}
|
||||
onClose={() => (selectedItem = null)}
|
||||
onRetry={(id) => { retryItem(id); selectedItem = null; }}
|
||||
onDelete={(id) => { removeItem(id); selectedItem = null; }}
|
||||
/>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
@@ -14,8 +14,9 @@
|
||||
item: QueueItem | null;
|
||||
onClose?: () => void;
|
||||
onRetry?: (id: string) => void;
|
||||
onDelete?: (id: string) => void;
|
||||
}
|
||||
let { item, onClose, onRetry }: Props = $props();
|
||||
let { item, onClose, onRetry, onDelete }: Props = $props();
|
||||
|
||||
const PALETTE = ['#E1306C', '#FD7E14', '#FCAF45', '#833AB4', '#C13584'];
|
||||
function strHash(s: string): number {
|
||||
@@ -164,6 +165,14 @@
|
||||
Open in Tandoor <External size={16} color="#fff" />
|
||||
</a>
|
||||
{/if}
|
||||
|
||||
<!-- Delete button -->
|
||||
{#if onDelete}
|
||||
<button class="ic-btn-reset delete-btn" onclick={() => { onDelete?.(item!.id); onClose?.(); }}>
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="3 6 5 6 21 6"/><path d="M19 6l-1 14a2 2 0 01-2 2H8a2 2 0 01-2-2L5 6"/><path d="M10 11v6M14 11v6"/><path d="M9 6V4a1 1 0 011-1h4a1 1 0 011 1v2"/></svg>
|
||||
Remove from queue
|
||||
</button>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -432,4 +441,24 @@
|
||||
box-shadow: var(--shadow-lg);
|
||||
text-decoration: none;
|
||||
}
|
||||
.delete-btn {
|
||||
width: 100%;
|
||||
margin-top: 12px;
|
||||
padding: 14px;
|
||||
border-radius: 99px;
|
||||
background: transparent;
|
||||
color: var(--muted);
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 6px;
|
||||
border: 1px solid var(--border);
|
||||
}
|
||||
.delete-btn:active {
|
||||
background: rgba(255, 59, 48, 0.08);
|
||||
color: var(--status-error);
|
||||
border-color: var(--status-error);
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user