Elgato_dark/angular
1
0
Fork 0
mirror of https://github.com/angular/angular synced 2026-05-24 09:28:37 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor(devtools): Improves clipboard error feedback with snackbar and logging

Browse source 
Enhances user experience by displaying a snackbar notification when clipboard copy fails, and logs detailed error information via the message bus

(cherry picked from commit bfcaf17005)
This commit is contained in:
SkyZeroZx 2025-10-27 13:31:44 -05:00 committed by Kristiyan Kostadinov
parent ce5ca247e5
commit 05bfda484e
1 changed files with 10 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
devtools/projects/ng-devtools/src/lib/devtools-tabs/transfer-state/transfer-state.component.ts
View file

@ -32,6 +32,7 @@ import {
import {ButtonComponent} from '../../shared/button/button.component';
import {Events, MessageBus, TransferStateValue} from '../../../../../protocol';
import {formatBytes, getFormattedValue} from '../../shared/utils/formatting';
import {MatSnackBar, MatSnackBarModule} from '@angular/material/snack-bar';
interface TransferStateItem {
key: string;
@ -47,7 +48,6 @@ export const COPY_FEEDBACK_TIMEOUT = 2000;
@Component({
selector: 'ng-transfer-state',
standalone: true,
imports: [
MatIcon,
MatTooltip,
@ -62,6 +62,7 @@ export const COPY_FEEDBACK_TIMEOUT = 2000;
MatHeaderRowDef,
MatRowDef,
ButtonComponent,
MatSnackBarModule,
],
templateUrl: './transfer-state.component.html',
styleUrls: ['./transfer-state.component.scss'],
@ -71,6 +72,8 @@ export class TransferStateComponent {
private messageBus = inject(MessageBus) as MessageBus<Events>;
private clipboard = inject(Clipboard);
private snackBar = inject(MatSnackBar);
readonly transferStateData = signal<Record<string, TransferStateValue> | null>(null);
readonly error = signal<string | null>(null);
readonly isLoading = computed(() => !this.transferStateData() && !this.error());
@ -171,7 +174,12 @@ export class TransferStateComponent {
);
}, COPY_FEEDBACK_TIMEOUT);
} catch (err) {
console.error('Failed to copy to clipboard:', err);
const message = 'Failed to copy to clipboard';
const errorDetail =
err instanceof Error ? `${err.name}: ${err.message}` : JSON.stringify(err);
this.snackBar.open(message, 'Dismiss', {duration: 3000});
this.messageBus.emit('log', [{level: 'error', message: `${message}: ${errorDetail}`}]);
}
}
}