Feat: Add Copy URL button and reusable toast notification system
Detail page now has a "Copy URL" button that copies the image's direct file URL to the clipboard. A toast service (BehaviorSubject-backed, auto-dismissing after 3s) confirms success or failure. ToastComponent is registered at the app root and available to all future features. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
25
ui/src/app/services/toast.service.ts
Normal file
25
ui/src/app/services/toast.service.ts
Normal file
@@ -0,0 +1,25 @@
|
||||
import { Injectable } from '@angular/core';
|
||||
import { BehaviorSubject, Observable } from 'rxjs';
|
||||
|
||||
export interface Toast {
|
||||
message: string;
|
||||
type: 'success' | 'error';
|
||||
}
|
||||
|
||||
@Injectable({ providedIn: 'root' })
|
||||
export class ToastService {
|
||||
private readonly subject = new BehaviorSubject<Toast | null>(null);
|
||||
readonly current$: Observable<Toast | null> = this.subject.asObservable();
|
||||
private timer: ReturnType<typeof setTimeout> | null = null;
|
||||
|
||||
show(message: string, type: 'success' | 'error' = 'success', duration = 3000): void {
|
||||
if (this.timer !== null) {
|
||||
clearTimeout(this.timer);
|
||||
}
|
||||
this.subject.next({ message, type });
|
||||
this.timer = setTimeout(() => {
|
||||
this.subject.next(null);
|
||||
this.timer = null;
|
||||
}, duration);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user