AZEN-SGG/Kavita
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fixed reading list delete being broken.

Browse source
This commit is contained in:
Joseph Milazzo 2025-06-22 08:47:51 -05:00
parent 52f6e235d0
commit ff8cba71f5
4 changed files with 25 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

9
UI/Web/src/app/reading-list/_components/reading-list-detail/reading-list-detail.component.html
View file

@ -229,14 +229,17 @@
</div> </div>
} }
<app-draggable-ordered-list [items]="items" (orderUpdated)="orderUpdated($event)" [accessibilityMode]="accessibilityMode" <app-draggable-ordered-list [items]="items" [accessibilityMode]="accessibilityMode"
[disabled]="!(formGroup.get('edit')?.value || false)" [showRemoveButton]="formGroup.get('edit')?.value || false"> [disabled]="!(formGroup.get('edit')?.value || false)"
(orderUpdated)="orderUpdated($event)"
(itemRemove)="removeItem($event)"
[showRemoveButton]="formGroup.get('edit')?.value || false">
<ng-template #draggableItem let-item let-position="idx"> <ng-template #draggableItem let-item let-position="idx">
<app-reading-list-item [ngClass]="{'content-container': items.length < 100, 'non-virtualized-container': items.length >= 100}" [item]="item" <app-reading-list-item [ngClass]="{'content-container': items.length < 100, 'non-virtualized-container': items.length >= 100}" [item]="item"
[position]="position" [libraryTypes]="libraryTypes" [position]="position" [libraryTypes]="libraryTypes"
[promoted]="item.promoted" (read)="readChapter($event)" [promoted]="item.promoted" (read)="readChapter($event)"
(remove)="itemRemoved($event, position)" (remove)="removeItem($event)"
[showRemove]="false"/> [showRemove]="false"/>
</ng-template> </ng-template>
</app-draggable-ordered-list> </app-draggable-ordered-list>

10
UI/Web/src/app/reading-list/_components/reading-list-detail/reading-list-detail.component.ts
View file

@ -25,7 +25,8 @@ import {ImageService} from 'src/app/_services/image.service';
import {ReadingListService} from 'src/app/_services/reading-list.service'; import {ReadingListService} from 'src/app/_services/reading-list.service';
import { import {
DraggableOrderedListComponent, DraggableOrderedListComponent,
IndexUpdateEvent IndexUpdateEvent,
ItemRemoveEvent
} from '../draggable-ordered-list/draggable-ordered-list.component'; } from '../draggable-ordered-list/draggable-ordered-list.component';
import {forkJoin, startWith, tap} from 'rxjs'; import {forkJoin, startWith, tap} from 'rxjs';
import {ReaderService} from 'src/app/_services/reader.service'; import {ReaderService} from 'src/app/_services/reader.service';
@ -321,6 +322,7 @@ export class ReadingListDetailComponent implements OnInit {
} }
editReadingList(readingList: ReadingList) { editReadingList(readingList: ReadingList) {
if (!readingList) return;
this.actionService.editReadingList(readingList, (readingList: ReadingList) => { this.actionService.editReadingList(readingList, (readingList: ReadingList) => {
// Reload information around list // Reload information around list
this.readingListService.getReadingList(this.listId).subscribe(rl => { this.readingListService.getReadingList(this.listId).subscribe(rl => {
@ -347,10 +349,10 @@ export class ReadingListDetailComponent implements OnInit {
}); });
} }
itemRemoved(item: ReadingListItem, position: number) { removeItem(removeEvent: ItemRemoveEvent) {
if (!this.readingList) return; if (!this.readingList) return;
this.readingListService.deleteItem(this.readingList.id, item.id).subscribe(() => { this.readingListService.deleteItem(this.readingList.id, removeEvent.item.id).subscribe(() => {
this.items.splice(position, 1); this.items.splice(removeEvent.position, 1);
this.items = [...this.items]; this.items = [...this.items];
this.cdRef.markForCheck(); this.cdRef.markForCheck();
this.toastr.success(translate('toasts.item-removed')); this.toastr.success(translate('toasts.item-removed'));

8
UI/Web/src/app/reading-list/_components/reading-list-item/reading-list-item.component.html
View file

@ -18,10 +18,10 @@
{{item.title}} {{item.title}}
<div class="actions float-end"> <div class="actions float-end">
@if (showRemove) { @if (showRemove) {
<button class="btn btn-danger" (click)="remove.emit(item)"> <button class="btn btn-danger" (click)="removeItem(item)">
<span> <span>
<i class="fa fa-trash me-1" aria-hidden="true"></i> <i class="fa fa-trash me-1" aria-hidden="true"></i>
</span> </span>
<span class="d-none d-md-inline-block">{{t('remove')}}</span> <span class="d-none d-md-inline-block">{{t('remove')}}</span>
</button> </button>
} }

10
UI/Web/src/app/reading-list/_components/reading-list-item/reading-list-item.component.ts
View file

@ -9,6 +9,7 @@ import {ImageComponent} from '../../../shared/image/image.component';
import {TranslocoDirective} from "@jsverse/transloco"; import {TranslocoDirective} from "@jsverse/transloco";
import {SeriesFormatComponent} from "../../../shared/series-format/series-format.component"; import {SeriesFormatComponent} from "../../../shared/series-format/series-format.component";
import {ReadMoreComponent} from "../../../shared/read-more/read-more.component"; import {ReadMoreComponent} from "../../../shared/read-more/read-more.component";
import {ItemRemoveEvent} from "../draggable-ordered-list/draggable-ordered-list.component";
@Component({ @Component({
selector: 'app-reading-list-item', selector: 'app-reading-list-item',
@ -33,9 +34,16 @@ export class ReadingListItemComponent {
@Input() promoted: boolean = false; @Input() promoted: boolean = false;
@Output() read: EventEmitter<ReadingListItem> = new EventEmitter(); @Output() read: EventEmitter<ReadingListItem> = new EventEmitter();
@Output() remove: EventEmitter<ReadingListItem> = new EventEmitter(); @Output() remove: EventEmitter<ItemRemoveEvent> = new EventEmitter();
readChapter(item: ReadingListItem) { readChapter(item: ReadingListItem) {
this.read.emit(item); this.read.emit(item);
} }
removeItem(item: ReadingListItem) {
this.remove.emit({
item: item,
position: item.order
});
}
} }