增加一个全局可用的复制指定颜色代码到剪贴板的Hook。
This commit is contained in:
parent
125f235964
commit
b206a58be1
31
src/hooks/useCopyColor.ts
Normal file
31
src/hooks/useCopyColor.ts
Normal file
|
@ -0,0 +1,31 @@
|
||||||
|
import { isNil } from 'lodash-es';
|
||||||
|
import { useCallback, useEffect } from 'react';
|
||||||
|
import { useCopyToClipboard } from 'react-use';
|
||||||
|
import { NotificationType, useNotification } from '../components/Notifications';
|
||||||
|
|
||||||
|
export function useCopyColor() {
|
||||||
|
const { showToast } = useNotification();
|
||||||
|
const [cpState, copyToClipboard] = useCopyToClipboard();
|
||||||
|
const copyAction = useCallback((color: string) => {
|
||||||
|
if (color.startsWith('#')) {
|
||||||
|
copyToClipboard(color);
|
||||||
|
} else {
|
||||||
|
copyToClipboard(`#${color}`);
|
||||||
|
}
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (!isNil(cpState.error)) {
|
||||||
|
showToast(NotificationType.ERROR, 'Failed to copy to clipboard', 'tabler:alert-circle', 3000);
|
||||||
|
} else if (!isNil(cpState.value)) {
|
||||||
|
showToast(
|
||||||
|
NotificationType.SUCCESS,
|
||||||
|
`${cpState.value} has been copied to clipboard.`,
|
||||||
|
'tabler:circle-check',
|
||||||
|
3000,
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}, [cpState]);
|
||||||
|
|
||||||
|
return copyAction;
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user