forked from open-webui/open-webui
fix: safari copy link issue
This commit is contained in:
parent
b67f80f7a4
commit
a4083f43cb
3 changed files with 33 additions and 49 deletions
|
@ -12,6 +12,7 @@
|
||||||
import Placeholder from './Messages/Placeholder.svelte';
|
import Placeholder from './Messages/Placeholder.svelte';
|
||||||
import Spinner from '../common/Spinner.svelte';
|
import Spinner from '../common/Spinner.svelte';
|
||||||
import { imageGenerations } from '$lib/apis/images';
|
import { imageGenerations } from '$lib/apis/images';
|
||||||
|
import { copyToClipboard } from '$lib/utils';
|
||||||
|
|
||||||
const i18n = getContext('i18n');
|
const i18n = getContext('i18n');
|
||||||
|
|
||||||
|
@ -42,40 +43,11 @@
|
||||||
element.scrollTop = element.scrollHeight;
|
element.scrollTop = element.scrollHeight;
|
||||||
};
|
};
|
||||||
|
|
||||||
const copyToClipboard = (text) => {
|
const copyToClipboardWithToast = async (text) => {
|
||||||
if (!navigator.clipboard) {
|
const res = await copyToClipboard(text);
|
||||||
var textArea = document.createElement('textarea');
|
if (res) {
|
||||||
textArea.value = text;
|
toast.success($i18n.t('Copying to clipboard was successful!'));
|
||||||
|
|
||||||
// Avoid scrolling to bottom
|
|
||||||
textArea.style.top = '0';
|
|
||||||
textArea.style.left = '0';
|
|
||||||
textArea.style.position = 'fixed';
|
|
||||||
|
|
||||||
document.body.appendChild(textArea);
|
|
||||||
textArea.focus();
|
|
||||||
textArea.select();
|
|
||||||
|
|
||||||
try {
|
|
||||||
var successful = document.execCommand('copy');
|
|
||||||
var msg = successful ? 'successful' : 'unsuccessful';
|
|
||||||
console.log('Fallback: Copying text command was ' + msg);
|
|
||||||
} catch (err) {
|
|
||||||
console.error('Fallback: Oops, unable to copy', err);
|
|
||||||
}
|
|
||||||
|
|
||||||
document.body.removeChild(textArea);
|
|
||||||
return;
|
|
||||||
}
|
}
|
||||||
navigator.clipboard.writeText(text).then(
|
|
||||||
function () {
|
|
||||||
console.log('Async: Copying to clipboard was successful!');
|
|
||||||
toast.success($i18n.t('Copying to clipboard was successful!'));
|
|
||||||
},
|
|
||||||
function (err) {
|
|
||||||
console.error('Async: Could not copy text: ', err);
|
|
||||||
}
|
|
||||||
);
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const confirmEditMessage = async (messageId, content) => {
|
const confirmEditMessage = async (messageId, content) => {
|
||||||
|
@ -330,7 +302,7 @@
|
||||||
{confirmEditMessage}
|
{confirmEditMessage}
|
||||||
{showPreviousMessage}
|
{showPreviousMessage}
|
||||||
{showNextMessage}
|
{showNextMessage}
|
||||||
{copyToClipboard}
|
copyToClipboard={copyToClipboardWithToast}
|
||||||
/>
|
/>
|
||||||
{:else}
|
{:else}
|
||||||
<ResponseMessage
|
<ResponseMessage
|
||||||
|
@ -344,7 +316,7 @@
|
||||||
{showPreviousMessage}
|
{showPreviousMessage}
|
||||||
{showNextMessage}
|
{showNextMessage}
|
||||||
{rateMessage}
|
{rateMessage}
|
||||||
{copyToClipboard}
|
copyToClipboard={copyToClipboardWithToast}
|
||||||
{continueGeneration}
|
{continueGeneration}
|
||||||
{regenerateResponse}
|
{regenerateResponse}
|
||||||
on:save={async (e) => {
|
on:save={async (e) => {
|
||||||
|
|
|
@ -10,17 +10,18 @@
|
||||||
import Link from '../icons/Link.svelte';
|
import Link from '../icons/Link.svelte';
|
||||||
|
|
||||||
let chat = null;
|
let chat = null;
|
||||||
|
let shareUrl = null;
|
||||||
const i18n = getContext('i18n');
|
const i18n = getContext('i18n');
|
||||||
|
|
||||||
const shareLocalChat = async () => {
|
const shareLocalChat = async () => {
|
||||||
const _chat = chat;
|
const _chat = chat;
|
||||||
|
|
||||||
const sharedChat = await shareChatById(localStorage.token, $chatId);
|
const sharedChat = await shareChatById(localStorage.token, $chatId);
|
||||||
const chatShareUrl = `${window.location.origin}/s/${sharedChat.id}`;
|
shareUrl = `${window.location.origin}/s/${sharedChat.id}`;
|
||||||
|
console.log(shareUrl);
|
||||||
toast.success($i18n.t('Copied shared chat URL to clipboard!'));
|
|
||||||
copyToClipboard(chatShareUrl);
|
|
||||||
chat = await getChatById(localStorage.token, $chatId);
|
chat = await getChatById(localStorage.token, $chatId);
|
||||||
|
|
||||||
|
return shareUrl;
|
||||||
};
|
};
|
||||||
|
|
||||||
const shareChat = async () => {
|
const shareChat = async () => {
|
||||||
|
@ -131,8 +132,12 @@
|
||||||
<button
|
<button
|
||||||
class=" self-center flex items-center gap-1 px-3.5 py-2 rounded-xl text-sm font-medium bg-emerald-600 hover:bg-emerald-500 text-white"
|
class=" self-center flex items-center gap-1 px-3.5 py-2 rounded-xl text-sm font-medium bg-emerald-600 hover:bg-emerald-500 text-white"
|
||||||
type="button"
|
type="button"
|
||||||
on:click={() => {
|
on:pointerdown={() => {
|
||||||
shareLocalChat();
|
shareLocalChat();
|
||||||
|
}}
|
||||||
|
on:click={async () => {
|
||||||
|
copyToClipboard(shareUrl);
|
||||||
|
toast.success($i18n.t('Copied shared chat URL to clipboard!'));
|
||||||
show = false;
|
show = false;
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
|
|
|
@ -187,7 +187,8 @@ export const generateInitialsImage = (name) => {
|
||||||
return canvas.toDataURL();
|
return canvas.toDataURL();
|
||||||
};
|
};
|
||||||
|
|
||||||
export const copyToClipboard = (text) => {
|
export const copyToClipboard = async (text) => {
|
||||||
|
let result = false;
|
||||||
if (!navigator.clipboard) {
|
if (!navigator.clipboard) {
|
||||||
const textArea = document.createElement('textarea');
|
const textArea = document.createElement('textarea');
|
||||||
textArea.value = text;
|
textArea.value = text;
|
||||||
|
@ -205,21 +206,27 @@ export const copyToClipboard = (text) => {
|
||||||
const successful = document.execCommand('copy');
|
const successful = document.execCommand('copy');
|
||||||
const msg = successful ? 'successful' : 'unsuccessful';
|
const msg = successful ? 'successful' : 'unsuccessful';
|
||||||
console.log('Fallback: Copying text command was ' + msg);
|
console.log('Fallback: Copying text command was ' + msg);
|
||||||
|
result = true;
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.error('Fallback: Oops, unable to copy', err);
|
console.error('Fallback: Oops, unable to copy', err);
|
||||||
}
|
}
|
||||||
|
|
||||||
document.body.removeChild(textArea);
|
document.body.removeChild(textArea);
|
||||||
return;
|
return result;
|
||||||
}
|
}
|
||||||
navigator.clipboard.writeText(text).then(
|
|
||||||
function () {
|
result = await navigator.clipboard
|
||||||
|
.writeText(text)
|
||||||
|
.then(() => {
|
||||||
console.log('Async: Copying to clipboard was successful!');
|
console.log('Async: Copying to clipboard was successful!');
|
||||||
},
|
return true;
|
||||||
function (err) {
|
})
|
||||||
console.error('Async: Could not copy text: ', err);
|
.catch((error) => {
|
||||||
}
|
console.error('Async: Could not copy text: ', error);
|
||||||
);
|
return false;
|
||||||
|
});
|
||||||
|
|
||||||
|
return result;
|
||||||
};
|
};
|
||||||
|
|
||||||
export const compareVersion = (latest, current) => {
|
export const compareVersion = (latest, current) => {
|
||||||
|
|
Loading…
Reference in a new issue