mirror of
https://github.com/AeThex-Corporation/AeThex-OS.git
synced 2026-04-18 14:27:20 +00:00
81 lines
1.9 KiB
TypeScript
81 lines
1.9 KiB
TypeScript
import { useState, useCallback } from 'react';
|
|
|
|
export interface FileResult {
|
|
name: string;
|
|
size: number;
|
|
type: string;
|
|
dataUrl?: string;
|
|
}
|
|
|
|
export function useDeviceFilePicker() {
|
|
const [file, setFile] = useState<FileResult | null>(null);
|
|
const [isLoading, setIsLoading] = useState(false);
|
|
const [error, setError] = useState<string | null>(null);
|
|
|
|
const pickFile = useCallback(async () => {
|
|
try {
|
|
setIsLoading(true);
|
|
setError(null);
|
|
|
|
// Use web file input as fallback
|
|
const input = document.createElement('input');
|
|
input.type = 'file';
|
|
input.accept = '*/*';
|
|
|
|
const filePromise = new Promise<File | null>((resolve) => {
|
|
input.onchange = (e) => {
|
|
const target = e.target as HTMLInputElement;
|
|
resolve(target.files?.[0] || null);
|
|
};
|
|
input.oncancel = () => resolve(null);
|
|
});
|
|
|
|
input.click();
|
|
|
|
const selectedFile = await filePromise;
|
|
if (!selectedFile) {
|
|
return null;
|
|
}
|
|
|
|
// Read file as data URL
|
|
const reader = new FileReader();
|
|
const dataUrlPromise = new Promise<string>((resolve, reject) => {
|
|
reader.onload = () => resolve(reader.result as string);
|
|
reader.onerror = reject;
|
|
});
|
|
|
|
reader.readAsDataURL(selectedFile);
|
|
const dataUrl = await dataUrlPromise;
|
|
|
|
const result: FileResult = {
|
|
name: selectedFile.name,
|
|
size: selectedFile.size,
|
|
type: selectedFile.type,
|
|
dataUrl,
|
|
};
|
|
|
|
setFile(result);
|
|
return result;
|
|
} catch (err) {
|
|
const message = err instanceof Error ? err.message : 'File picker error';
|
|
setError(message);
|
|
console.error('[File Picker Error]', err);
|
|
return null;
|
|
} finally {
|
|
setIsLoading(false);
|
|
}
|
|
}, []);
|
|
|
|
const clearFile = useCallback(() => {
|
|
setFile(null);
|
|
setError(null);
|
|
}, []);
|
|
|
|
return {
|
|
file,
|
|
isLoading,
|
|
error,
|
|
pickFile,
|
|
clearFile,
|
|
};
|
|
}
|