IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

GrafanaUI: Add success state to ClipboardButton (#52069)

Browse Source 
* User Experience: apply the same pattern feedback for all copy to clipboard buttons

* add copy icon to all ClipboardButton use cases

* Change primary color for copy to clipboard in create token

* Add success button variant

* Remove copy confirmation from TableCellInspectModal because it's in the base component now

* Design tweaks to copy confirmation

 - Only change the icon to tick to avoid the button changing size
 - Change button to success green
 - Only show copy confirmation state for 2 seconds

* revert TabelCellInspectModal text button back

* revert accidental change to ShareLink

Co-authored-by: joshhunt <josh@trtr.co>
This commit is contained in:
Ezequiel Victorero
2022-07-20 06:33:46 -03:00
committed by GitHub
parent ba76be174f
commit 0633840777
16 changed files with 78 additions and 125 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
public/app/features/playlist/ShareModal.tsx
View File

@@ -1,8 +1,7 @@
import React, { useState } from 'react';
import { AppEvents, SelectableValue, UrlQueryMap, urlUtil } from '@grafana/data';
import { Checkbox, ClipboardButton, Field, FieldSet, Icon, Input, Modal, RadioButtonGroup } from '@grafana/ui';
import appEvents from 'app/core/app_events';
import { SelectableValue, UrlQueryMap, urlUtil } from '@grafana/data';
import { Checkbox, ClipboardButton, Field, FieldSet, Input, Modal, RadioButtonGroup } from '@grafana/ui';
import { buildBaseUrl } from '../dashboard/components/ShareModal/utils';
@@ -23,10 +22,6 @@ export const ShareModal = ({ playlistUid, onDismiss }: ShareModalProps) => {
{ label: 'Kiosk', value: true },
];
const onShareUrlCopy = () => {
appEvents.emit(AppEvents.alertSuccess, ['Content copied to clipboard']);
};
const params: UrlQueryMap = {};
if (mode) {
params.kiosk = mode;
@@ -59,8 +54,8 @@ export const ShareModal = ({ playlistUid, onDismiss }: ShareModalProps) => {
value={shareUrl}
readOnly
addonAfter={
<ClipboardButton variant="primary" getText={() => shareUrl} onClipboardCopy={onShareUrlCopy}>
<Icon name="copy" /> Copy
<ClipboardButton icon="copy" variant="primary" getText={() => shareUrl}>
Copy
</ClipboardButton>
}
/>