fix(downloads): call a request a request, and mark it with a bookmark
The feature was renamed to requests and the copy was not. The badge on every Explore card and track row still offered "Want track X", the album page's button read "Want this" / "Wanted", the artist page's release menu said "Want This", and the Downloads empty state told the user to look for a control by a name nothing rendered. The `queued` badge is a bookmark rather than an hourglass. An hourglass says "wait, this is under way", which overstates what a request is: nothing may be downloading, nothing may ever be found, and the list is somewhere a user can leave one indefinitely. A bookmark says the honest thing -- it is on your list -- and reads as the opposite of the plus that put it there, which is what a toggle's two states have to do. The backend's `'wanted'` request state is deliberately untouched: it is a stored enum, not copy. Also removes a dead duplicate branch in the badge's `render()`. The first `if (this.actionable)` returned before the ring was built, so a partly-held album that could still be requested drew a plus instead of its progress arc. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01MeQt5hgXg5YGoNZQ9ozG7L
This commit is contained in:
@@ -400,7 +400,7 @@ export class DownloadsView extends ViewLifecycleMixin(LitElement) {
|
||||
private renderEmptyRequests() {
|
||||
return html`
|
||||
<div class="empty">
|
||||
Nothing requested yet. Use “Want this” on an album or artist
|
||||
Nothing requested yet. Use “Request this” on an album or artist
|
||||
to add it here.
|
||||
</div>
|
||||
`;
|
||||
|
||||
@@ -2680,7 +2680,7 @@ export class ExploreAlbumDetails extends LitElement implements ContextMenuHost {
|
||||
slot="start"
|
||||
name=${this.isRequested ? 'solid/bookmark' : 'regular/bookmark'}
|
||||
></wa-icon>
|
||||
${this.isRequested ? 'Wanted' : 'Want this'}
|
||||
${this.isRequested ? 'Requested' : 'Request this'}
|
||||
</wa-button>
|
||||
`;
|
||||
}
|
||||
|
||||
@@ -2753,7 +2753,7 @@ export class ExploreArtistDetails extends LitElement implements ContextMenuHost
|
||||
slot="icon"
|
||||
name=${requested ? 'xmark' : 'bookmark'}
|
||||
></wa-icon>
|
||||
${requested ? 'Cancel Request' : 'Want This'}
|
||||
${requested ? 'Cancel Request' : 'Request This'}
|
||||
</wa-dropdown-item>
|
||||
`
|
||||
: nothing}
|
||||
|
||||
@@ -48,7 +48,7 @@ export type LibraryStatus =
|
||||
*
|
||||
* Colours and glyphs:
|
||||
* - in-library → green circle, check mark
|
||||
* - queued → amber circle, hourglass
|
||||
* - queued → amber circle, bookmark ("on your list")
|
||||
* - not-in-library → grey circle, plus sign
|
||||
*
|
||||
* Usage:
|
||||
@@ -241,12 +241,23 @@ export class LibraryStatusIndicator extends LitElement {
|
||||
}
|
||||
`;
|
||||
|
||||
/**
|
||||
* The glyph for each state.
|
||||
*
|
||||
* `queued` is a **bookmark**, not the hourglass it used to be. An
|
||||
* hourglass says "wait, this is under way", which overstates what a
|
||||
* request is: nothing may be downloading, nothing may ever be found,
|
||||
* and the user can leave one sitting on the list indefinitely. A
|
||||
* bookmark says the honest thing — it is on your list — and reads as
|
||||
* the opposite of the plus that put it there, which is what a
|
||||
* toggle's two states have to do.
|
||||
*/
|
||||
private iconName(): string {
|
||||
switch (this.status) {
|
||||
case 'in-library':
|
||||
return 'check';
|
||||
case 'queued':
|
||||
return 'hourglass-half';
|
||||
return 'bookmark';
|
||||
default:
|
||||
return 'plus';
|
||||
}
|
||||
@@ -276,7 +287,7 @@ export class LibraryStatusIndicator extends LitElement {
|
||||
if (this.actionable) {
|
||||
return this.status === 'queued'
|
||||
? `Cancel the request for ${kind}${name}`
|
||||
: `Want ${kind}${name}`;
|
||||
: `Request ${kind}${name}`;
|
||||
}
|
||||
|
||||
switch (this.status) {
|
||||
@@ -354,25 +365,6 @@ export class LibraryStatusIndicator extends LitElement {
|
||||
}
|
||||
|
||||
const title = this.tooltip();
|
||||
const icon = this.iconName()
|
||||
? html`<wa-icon name=${this.iconName()} aria-hidden="true"></wa-icon>`
|
||||
: nothing;
|
||||
|
||||
if (this.actionable) {
|
||||
return html`
|
||||
<button
|
||||
class="badge"
|
||||
type="button"
|
||||
title=${title}
|
||||
aria-label=${title}
|
||||
?disabled=${this.busy}
|
||||
@click=${this.onActivate}
|
||||
@keydown=${this.onKeydown}
|
||||
>
|
||||
${icon}
|
||||
</button>
|
||||
`;
|
||||
}
|
||||
|
||||
// The ring stands in for the icon wherever the icon would go —
|
||||
// including inside the button, because a partly-held album is
|
||||
|
||||
@@ -120,7 +120,7 @@ describe('the context menu on an artist page release', () => {
|
||||
expect(items).toContain('Add to Queue');
|
||||
expect(items).toContain('Play Next');
|
||||
// Owned: there is nothing left to ask for.
|
||||
expect(items).not.toContain('Want This');
|
||||
expect(items).not.toContain('Request This');
|
||||
});
|
||||
|
||||
it('offers a request, and no playback, for a release nobody owns', async () => {
|
||||
@@ -132,7 +132,7 @@ describe('the context menu on an artist page release', () => {
|
||||
|
||||
expect(items).not.toContain('Play');
|
||||
expect(items).not.toContain('Add to Queue');
|
||||
expect(items).toContain('Want This');
|
||||
expect(items).toContain('Request This');
|
||||
expect(items).toContain('View on MusicBrainz');
|
||||
});
|
||||
|
||||
@@ -148,7 +148,7 @@ describe('the context menu on an artist page release', () => {
|
||||
// …but a `local:` id names nothing upstream, and wanting something
|
||||
// already in the library is not a thing to offer.
|
||||
expect(items).not.toContain('View on MusicBrainz');
|
||||
expect(items).not.toContain('Want This');
|
||||
expect(items).not.toContain('Request This');
|
||||
});
|
||||
|
||||
it('opens from the keyboard on Shift+F10', async () => {
|
||||
|
||||
@@ -166,7 +166,7 @@ describe('<library-status-indicator>', () => {
|
||||
glyphs.push(shadow(el, 'wa-icon')?.getAttribute('name'));
|
||||
}
|
||||
|
||||
expect(glyphs).toEqual(['check', 'hourglass-half', 'plus']);
|
||||
expect(glyphs).toEqual(['check', 'bookmark', 'plus']);
|
||||
});
|
||||
|
||||
it('phrases its label around the entity it describes', async () => {
|
||||
|
||||
@@ -249,7 +249,7 @@ describe('<library-status-indicator> as a control', () => {
|
||||
const el = await badge({ requestMbid: 'rg-1' });
|
||||
|
||||
expect(shadow(el, '.badge')?.getAttribute('aria-label')).toBe(
|
||||
'Want album "Abbey Road"',
|
||||
'Request album "Abbey Road"',
|
||||
);
|
||||
|
||||
await update(el, { status: 'queued' });
|
||||
|
||||
Reference in New Issue
Block a user