upd: prompt for confirmation on external links

This commit is contained in:
Marie 2024-09-16 01:12:20 +02:00
parent e21e2530e6
commit d2564836ed
No known key found for this signature in database
GPG key ID: 7ADF6C9CD9A28555
4 changed files with 28 additions and 3 deletions

View file

@ -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,

View file

@ -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>

View file

@ -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, {

View file

@ -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');