fix: enhance file paste handler to support clipboard images on Linux with Tauri
This commit is contained in:
@@ -1,11 +1,24 @@
|
|||||||
import { useCallback, ClipboardEventHandler } from 'react';
|
import { useCallback, ClipboardEventHandler } from 'react';
|
||||||
import { getDataTransferFiles } from '../utils/dom';
|
import { getDataTransferFiles } from '../utils/dom';
|
||||||
|
import { readClipboardImage, isTauri, isLinux } from '../utils/tauri';
|
||||||
|
|
||||||
export const useFilePasteHandler = (onPaste: (file: File[]) => void): ClipboardEventHandler =>
|
export const useFilePasteHandler = (onPaste: (file: File[]) => void): ClipboardEventHandler =>
|
||||||
useCallback(
|
useCallback(
|
||||||
(evt) => {
|
async (evt) => {
|
||||||
const files = getDataTransferFiles(evt.clipboardData);
|
const files = getDataTransferFiles(evt.clipboardData);
|
||||||
if (files) onPaste(files);
|
if (files && files.length > 0) {
|
||||||
|
onPaste(files);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// On Linux with Tauri, browser clipboard API doesn't work for images
|
||||||
|
// Use our custom Tauri command with arboard/Wayland support
|
||||||
|
if (isTauri() && isLinux()) {
|
||||||
|
const clipboardImage = await readClipboardImage();
|
||||||
|
if (clipboardImage) {
|
||||||
|
onPaste([clipboardImage]);
|
||||||
|
}
|
||||||
|
}
|
||||||
},
|
},
|
||||||
[onPaste]
|
[onPaste]
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -168,3 +168,34 @@ export const sendNotification = async (options: {
|
|||||||
sendBrowserNotification({ title, body, icon, onClick });
|
sendBrowserNotification({ title, body, icon, onClick });
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Check if we're running on Linux
|
||||||
|
*/
|
||||||
|
export const isLinux = (): boolean => {
|
||||||
|
const ua = navigator.userAgent.toLowerCase();
|
||||||
|
return ua.includes('linux') && !ua.includes('android');
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Read clipboard image on Linux using Tauri command with arboard/Wayland support
|
||||||
|
* Returns a data URL if an image is found, null otherwise
|
||||||
|
*/
|
||||||
|
export const readClipboardImage = async (): Promise<File | null> => {
|
||||||
|
if (!isTauri() || !isLinux()) return null;
|
||||||
|
|
||||||
|
try {
|
||||||
|
const { invoke } = await import('@tauri-apps/api/core');
|
||||||
|
const dataUrl = await invoke<string | null>('read_clipboard_image');
|
||||||
|
|
||||||
|
if (!dataUrl) return null;
|
||||||
|
|
||||||
|
// Convert data URL to File
|
||||||
|
const response = await fetch(dataUrl);
|
||||||
|
const blob = await response.blob();
|
||||||
|
return new File([blob], 'clipboard-image.png', { type: 'image/png' });
|
||||||
|
} catch (err) {
|
||||||
|
console.warn('Failed to read clipboard image:', err);
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user