Skip to content

Commit

Permalink
open links in abuse comment in new window (misskey-dev#13381)
Browse files Browse the repository at this point in the history
* feat: changing MkA behavior from MkMFM

* chore: open links in abuse comment in new window

* docs(changelog): 通報のコメント内のリンクをクリックした際、ウィンドウで開くように

* chore: use inject instead of prop drilling

* Revert "chore: use inject instead of prop drilling"

This reverts commit b4dd14e.
  • Loading branch information
anatawa12 authored Apr 27, 2024
1 parent fe1172f commit 8e8ee2a
Show file tree
Hide file tree
Showing 7 changed files with 24 additions and 4 deletions.
1 change: 1 addition & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,7 @@
- 引用したいノートのURLをコピーしリプライ投稿画面にペーストして添付することで達成できます
- Enhance: フォローするかどうかの確認ダイアログを出せるように
- Enhance: Playを手動でリロードできるように
- Enhance: 通報のコメント内のリンクをクリックした際、ウィンドウで開くように
- Chore: AiScriptを0.18.0にバージョンアップ
- Fix: 一部のページ内リンクが正しく動作しない問題を修正
- Fix: 周年の実績が閏年を考慮しない問題を修正
Expand Down
2 changes: 1 addition & 1 deletion packages/frontend/src/components/MkAbuseReport.vue
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</div>
<div class="detail">
<div>
<Mfm :text="report.comment"/>
<Mfm :text="report.comment" :linkBehavior="'window'"/>
</div>
<hr/>
<div>{{ i18n.ts.reporter }}: <MkA :to="`/admin/user/${report.reporter.id}`" class="_link" :behavior="'window'">@{{ report.reporter.username }}</MkA></div>
Expand Down
3 changes: 3 additions & 0 deletions packages/frontend/src/components/MkLink.vue
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ 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"
:behavior="props.behavior"
:title="url"
>
<slot></slot>
Expand All @@ -19,10 +20,12 @@ import { url as local } from '@/config.js';
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';

const props = withDefaults(defineProps<{
url: string;
rel?: null | string;
behavior?: MkABehavior;
}>(), {
});

Expand Down
4 changes: 3 additions & 1 deletion packages/frontend/src/components/MkMention.vue
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only
-->

<template>
<MkA v-user-preview="canonical" :class="[$style.root, { [$style.isMe]: isMe }]" :to="url" :style="{ background: bgCss }">
<MkA v-user-preview="canonical" :class="[$style.root, { [$style.isMe]: isMe }]" :to="url" :style="{ background: bgCss }" :behavior="behavior">
<img :class="$style.icon" :src="avatarUrl" alt="">
<span>
<span>@{{ username }}</span>
Expand All @@ -21,10 +21,12 @@ import { host as localHost } from '@/config.js';
import { $i } from '@/account.js';
import { defaultStore } from '@/store.js';
import { getStaticImageUrl } from '@/scripts/media-proxy.js';
import { MkABehavior } from '@/components/global/MkA.vue';

const props = defineProps<{
username: string;
host: string;
behavior?: MkABehavior;
}>();

const canonical = props.host === localHost ? `@${props.username}` : `@${props.username}@${toUnicode(props.host)}`;
Expand Down
8 changes: 7 additions & 1 deletion packages/frontend/src/components/global/MkA.vue
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,10 @@ SPDX-License-Identifier: AGPL-3.0-only
</a>
</template>

<script lang="ts">
export type MkABehavior = 'window' | 'browser' | null;
</script>

<script lang="ts" setup>
import { computed, shallowRef } from 'vue';
import * as os from '@/os.js';
Expand All @@ -20,12 +24,14 @@ import { useRouter } from '@/router/supplier.js';
const props = withDefaults(defineProps<{
to: string;
activeClass?: null | string;
behavior?: null | 'window' | 'browser';
behavior?: MkABehavior;
}>(), {
activeClass: null,
behavior: null,
});

const linkBehaviour = props.behavior;

const el = shallowRef<HTMLElement>();

defineExpose({ $el: el });
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ import MkCode from '@/components/MkCode.vue';
import MkCodeInline from '@/components/MkCodeInline.vue';
import MkGoogle from '@/components/MkGoogle.vue';
import MkSparkle from '@/components/MkSparkle.vue';
import MkA from '@/components/global/MkA.vue';
import MkA, {MkABehavior} from '@/components/global/MkA.vue';
import { host } from '@/config.js';
import { defaultStore } from '@/store.js';
import { nyaize as doNyaize } from '@/scripts/nyaize.js';
Expand All @@ -43,6 +43,7 @@ type MfmProps = {
parsedNodes?: mfm.MfmNode[] | null;
enableEmojiMenu?: boolean;
enableEmojiMenuReaction?: boolean;
linkBehavior?: MkABehavior;
};

type MfmEvents = {
Expand Down Expand Up @@ -342,6 +343,7 @@ export default function (props: MfmProps, { emit }: { emit: SetupContext<MfmEven
key: Math.random(),
url: token.props.url,
rel: 'nofollow noopener',
behavior: props.linkBehavior,
})];
}

Expand All @@ -350,6 +352,7 @@ export default function (props: MfmProps, { emit }: { emit: SetupContext<MfmEven
key: Math.random(),
url: token.props.url,
rel: 'nofollow noopener',
behavior: props.linkBehavior,
}, genEl(token.children, scale, true))];
}

Expand All @@ -358,6 +361,7 @@ export default function (props: MfmProps, { emit }: { emit: SetupContext<MfmEven
key: Math.random(),
host: (token.props.host == null && props.author && props.author.host != null ? props.author.host : token.props.host) ?? host,
username: token.props.username,
behavior: props.linkBehavior,
})];
}

Expand All @@ -366,6 +370,7 @@ export default function (props: MfmProps, { emit }: { emit: SetupContext<MfmEven
key: Math.random(),
to: isNote ? `/tags/${encodeURIComponent(token.props.hashtag)}` : `/user-tags/${encodeURIComponent(token.props.hashtag)}`,
style: 'color:var(--hashtag);',
behavior: props.linkBehavior,
}, `#${token.props.hashtag}`)];
}

Expand Down
3 changes: 3 additions & 0 deletions packages/frontend/src/components/global/MkUrl.vue
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<template>
<component
:is="self ? 'MkA' : 'a'" ref="el" :class="$style.root" class="_link" :[attr]="self ? props.url.substring(local.length) : props.url" :rel="rel ?? 'nofollow noopener'" :target="target"
:behavior = "props.behavior"
@contextmenu.stop="() => {}"
>
<template v-if="!self">
Expand All @@ -31,11 +32,13 @@ import * as os from '@/os.js';
import { useTooltip } from '@/scripts/use-tooltip.js';
import { safeURIDecode } from '@/scripts/safe-uri-decode.js';
import { isEnabledUrlPreview } from '@/instance.js';
import { MkABehavior } from '@/components/global/MkA.vue';

const props = withDefaults(defineProps<{
url: string;
rel?: string;
showUrlPreview?: boolean;
behavior?: MkABehavior;
}>(), {
showUrlPreview: true,
});
Expand Down

0 comments on commit 8e8ee2a

Please sign in to comment.