upd: prompt for confirmation on external links
This commit is contained in:
parent
e21e2530e6
commit
d2564836ed
@ -26,7 +26,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
<MkLoading v-else-if="type === 'waiting'" :class="$style.iconInner" :em="true"/>
|
||||
</div>
|
||||
<header v-if="title" :class="$style.title"><Mfm :text="title"/></header>
|
||||
<div v-if="text" :class="$style.text"><Mfm :text="text" :isBlock="true" /></div>
|
||||
<div v-if="text" :class="$style.text"><Mfm :text="text" :isBlock="true" :plain="plain" /></div>
|
||||
<MkInput v-if="input" v-model="inputValue" autofocus :type="input.type || 'text'" :placeholder="input.placeholder || undefined" :autocomplete="input.autocomplete" @keydown="onInputKeydown">
|
||||
<template v-if="input.type === 'password'" #prefix><i class="ti ti-lock"></i></template>
|
||||
<template #caption>
|
||||
@ -105,6 +105,7 @@ const props = withDefaults(defineProps<{
|
||||
cancelableByBgClick?: boolean;
|
||||
okText?: string;
|
||||
cancelText?: string;
|
||||
plain?: boolean;
|
||||
}>(), {
|
||||
type: 'info',
|
||||
showOkButton: true,
|
||||
|
@ -5,7 +5,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
|
||||
<template>
|
||||
<component
|
||||
:is="self ? 'MkA' : 'a'" ref="el" style="word-break: break-all;" class="_link" :[attr]="self ? url.substring(local.length) : url" :rel="rel ?? 'nofollow noopener'" :target="target"
|
||||
v-if="self"
|
||||
:is="'MkA'" ref="el" style="word-break: break-all;" class="_link" :to="url.substring(local.length)" :rel="rel ?? 'nofollow noopener'" :target="target"
|
||||
:behavior="props.navigationBehavior"
|
||||
:title="url"
|
||||
@click.stop
|
||||
@ -13,6 +14,17 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
<slot></slot>
|
||||
<i v-if="target === '_blank'" class="ti ti-external-link" :class="$style.icon"></i>
|
||||
</component>
|
||||
<component
|
||||
v-else
|
||||
:is="'a'" ref="el" style="word-break: break-all;" class="_link" :rel="rel ?? 'nofollow noopener popup=false'" :target="target"
|
||||
:behavior="props.navigationBehavior"
|
||||
:title="url"
|
||||
@click="promptConfirm()"
|
||||
@click.stop
|
||||
>
|
||||
<slot></slot>
|
||||
<i v-if="target === '_blank'" class="ti ti-external-link" :class="$style.icon"></i>
|
||||
</component>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
@ -22,6 +34,7 @@ import { useTooltip } from '@/scripts/use-tooltip.js';
|
||||
import * as os from '@/os.js';
|
||||
import { isEnabledUrlPreview } from '@/instance.js';
|
||||
import { MkABehavior } from '@/components/global/MkA.vue';
|
||||
import { i18n } from '@/i18n.js';
|
||||
|
||||
const props = withDefaults(defineProps<{
|
||||
url: string;
|
||||
@ -31,7 +44,6 @@ const props = withDefaults(defineProps<{
|
||||
});
|
||||
|
||||
const self = props.url.startsWith(local);
|
||||
const attr = self ? 'to' : 'href';
|
||||
const target = self ? null : '_blank';
|
||||
|
||||
const el = ref<HTMLElement | { $el: HTMLElement }>();
|
||||
@ -47,6 +59,16 @@ if (isEnabledUrlPreview.value) {
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
async function promptConfirm() {
|
||||
const { canceled } = await os.confirm({
|
||||
type: 'question',
|
||||
text: i18n.tsx.confirmRemoteUrl({x: props.url}),
|
||||
plain: true,
|
||||
});
|
||||
if (canceled) return;
|
||||
window.open(props.url, '_blank', 'nofollow noopener popup=false');
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" module>
|
||||
|
@ -245,6 +245,7 @@ export function confirm(props: {
|
||||
text?: string;
|
||||
okText?: string;
|
||||
cancelText?: string;
|
||||
plain?: boolean;
|
||||
}): Promise<{ canceled: boolean }> {
|
||||
return new Promise(resolve => {
|
||||
const { dispose } = popup(MkDialog, {
|
||||
|
@ -97,6 +97,7 @@ function createPluginEnv(opts: { plugin: Plugin; storageKey: string }): Record<s
|
||||
const { canceled } = await os.confirm({
|
||||
type: 'question',
|
||||
text: i18n.tsx.confirmRemoteUrl({x: url.value}),
|
||||
plain: true,
|
||||
});
|
||||
if (canceled) return;
|
||||
window.open(url.value, '_blank', 'noopener');
|
||||
|
Loading…
Reference in New Issue
Block a user