mirror of
https://github.com/danny-avila/LibreChat.git
synced 2025-12-17 00:40:14 +01:00
⬇️ fix: Image Download Browser Compatibility (#7950)
* fix: Add null check for SelectedTTS in MessageAudio component to prevent rendering issues * fix: image download browser compatibility with error handling and fallback mechanism - Updated the downloadImage function to use fetch for improved reliability and added error handling. - Implemented a fallback to the original download method in case of fetch failure. - Ensured the download link uses a blob URL for better compatibility with various image types.
This commit is contained in:
parent
ec7370dfe9
commit
10c0d7d474
2 changed files with 30 additions and 7 deletions
|
|
@ -46,13 +46,33 @@ const Image = ({
|
|||
[placeholderDimensions, height, width],
|
||||
);
|
||||
|
||||
const downloadImage = () => {
|
||||
const link = document.createElement('a');
|
||||
link.href = imagePath;
|
||||
link.download = altText;
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
document.body.removeChild(link);
|
||||
const downloadImage = async () => {
|
||||
try {
|
||||
const response = await fetch(imagePath);
|
||||
if (!response.ok) {
|
||||
throw new Error(`Failed to fetch image: ${response.status}`);
|
||||
}
|
||||
|
||||
const blob = await response.blob();
|
||||
const url = window.URL.createObjectURL(blob);
|
||||
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
link.download = altText || 'image.png';
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
document.body.removeChild(link);
|
||||
|
||||
window.URL.revokeObjectURL(url);
|
||||
} catch (error) {
|
||||
console.error('Download failed:', error);
|
||||
const link = document.createElement('a');
|
||||
link.href = imagePath;
|
||||
link.download = altText || 'image.png';
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
document.body.removeChild(link);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -14,6 +14,9 @@ function MessageAudio(props: TMessageAudio) {
|
|||
};
|
||||
|
||||
const SelectedTTS = TTSComponents[engineTTS];
|
||||
if (!SelectedTTS) {
|
||||
return null;
|
||||
}
|
||||
return <SelectedTTS {...props} />;
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue