Merge remote-tracking branch 'refs/remotes/misskey-original/develop' into develop

# Conflicts:
#	packages/frontend/src/components/MkAbuseReport.vue
#	packages/frontend/src/components/MkMention.vue
#	packages/frontend/src/components/global/MkMisskeyFlavoredMarkdown.ts
This commit is contained in:
mattyatea 2024-05-01 04:11:08 +09:00
commit 1a8d91355d
29 changed files with 458 additions and 108 deletions

View file

@ -24,7 +24,7 @@
"@rollup/plugin-json": "6.1.0",
"@rollup/plugin-replace": "5.0.5",
"@rollup/pluginutils": "5.1.0",
"@syuilo/aiscript": "0.17.0",
"@syuilo/aiscript": "0.18.0",
"@tabler/icons-webfont": "2.44.0",
"@twemoji/parser": "15.0.0",
"@vitejs/plugin-vue": "5.0.4",

View file

@ -20,7 +20,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</div>
<div :class="$style.detail">
<div>
<Mfm :text="report.comment"/>
<Mfm :text="report.comment" :linkBehavior="'window'"/>
<MkFolder v-if="report.notes.length !== 0" :class="$style.notes">
<template #label>{{ i18n.ts.reportedNote }}</template>
<div v-for="note in report.notes" :class="$style.notes">

View file

@ -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>
@ -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;
}>(), {
});

View file

@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only
-->
<template>
<MkA v-user-preview="canonical" :class="[$style.root, { [$style.isMe]: isMe && gamingType === '' , [$style.gamingDark]: gamingType === 'dark',[$style.gamingLight]: gamingType === 'light' }]" :to="url" :style="{ background: bgCss }">
<MkA v-user-preview="canonical" :class="[$style.root, { [$style.isMe]: isMe && gamingType === '' , [$style.gamingDark]: gamingType === 'dark',[$style.gamingLight]: gamingType === 'light' }]" :to="url" :style="{ background: bgCss }" :behavior="behavior">
<img :class="$style.icon" :src="avatarUrl" alt="">
<span>
<span>@{{ username }}</span>
@ -21,12 +21,14 @@ 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 gamingType = computed(defaultStore.makeGetterSetter('gamingType'));
const props = defineProps<{
username: string;
host: string;
behavior?: MkABehavior;
}>();
const canonical = props.host === localHost ? `@${props.username}` : `@${props.username}@${toUnicode(props.host)}`;

View file

@ -58,8 +58,8 @@ SPDX-License-Identifier: AGPL-3.0-only
<span v-else-if="notification.type === 'achievementEarned'">{{ i18n.ts._notification.achievementEarned }}</span>
<span v-else-if="notification.type === 'test'">{{ i18n.ts._notification.testNotification }}</span>
<MkA v-else-if="notification.type === 'follow' || notification.type === 'mention' || notification.type === 'reply' || notification.type === 'renote' || notification.type === 'quote' || notification.type === 'reaction' || notification.type === 'receiveFollowRequest' || notification.type === 'followRequestAccepted'" v-user-preview="notification.user.id" :class="$style.headerName" :to="userPage(notification.user)"><MkUserName :user="notification.user"/></MkA>
<span v-else-if="notification.type === 'reaction:grouped' && notification.note.reactionAcceptance === 'likeOnly'">{{ i18n.tsx._notification.likedBySomeUsers({ n: notification.reactions.length }) }}</span>
<span v-else-if="notification.type === 'reaction:grouped'">{{ i18n.tsx._notification.reactedBySomeUsers({ n: notification.reactions.length }) }}</span>
<span v-else-if="notification.type === 'reaction:grouped' && notification.note.reactionAcceptance === 'likeOnly'">{{ i18n.tsx._notification.likedBySomeUsers({ n: getActualReactedUsersCount(notification) }) }}</span>
<span v-else-if="notification.type === 'reaction:grouped'">{{ i18n.tsx._notification.reactedBySomeUsers({ n: getActualReactedUsersCount(notification) }) }}</span>
<span v-else-if="notification.type === 'renote:grouped'">{{ i18n.tsx._notification.renotedBySomeUsers({ n: notification.users.length }) }}</span>
<span v-else-if="notification.type === 'app'">{{ notification.header }}</span>
<MkTime v-if="withTime" :time="notification.createdAt" :class="$style.headerTime"/>
@ -72,7 +72,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</MkA>
<MkA v-else-if="notification.type === 'renote' || notification.type === 'renote:grouped'" :class="$style.text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note.renote)">
<i class="ti ti-quote" :class="$style.quote"></i>
<Mfm :text="getNoteSummary(notification.note.renote)" :plain="true" :nowrap="true" :author="notification.note.renote.user"/>
<Mfm :text="getNoteSummary(notification.note.renote)" :plain="true" :nowrap="true" :author="notification.note.renote?.user"/>
<i class="ti ti-quote" :class="$style.quote"></i>
</MkA>
<MkA v-else-if="notification.type === 'reply'" :class="$style.text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
@ -174,6 +174,11 @@ const rejectFollowRequest = () => {
followRequestDone.value = true;
misskeyApi('following/requests/reject', { userId: props.notification.user.id });
};
function getActualReactedUsersCount(notification: Misskey.entities.Notification) {
if (notification.type !== 'reaction:grouped') return 0;
return new Set(notification.reactions.map((reaction) => reaction.user.id)).size;
}
</script>
<style lang="scss" module>

View file

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

View file

@ -17,7 +17,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';
import { defaultStore } from '@/store';
import { mixEmoji } from '@/scripts/emojiKitchen/emojiMixer';
@ -77,6 +77,7 @@ type MfmProps = {
parsedNodes?: mfm.MfmNode[] | null;
enableEmojiMenu?: boolean;
enableEmojiMenuReaction?: boolean;
linkBehavior?: MkABehavior;
};
type MfmEvents = {
@ -415,6 +416,7 @@ export default function (props: MfmProps, { emit }: { emit: SetupContext<MfmEven
key: Math.random(),
url: token.props.url,
rel: 'nofollow noopener',
behavior: props.linkBehavior,
})];
}
@ -423,6 +425,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))];
}
@ -431,6 +434,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,
})];
}
@ -439,6 +443,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}`)];
}

View file

@ -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">
@ -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,
});

View file

@ -48,7 +48,7 @@ import MkInput from '@/components/MkInput.vue';
import MkSelect from '@/components/MkSelect.vue';
import { useRouter } from '@/router/supplier.js';
const PRESET_DEFAULT = `/// @ 0.16.0
const PRESET_DEFAULT = `/// @ 0.18.0
var name = ""
@ -60,13 +60,13 @@ Ui:render([
Ui:C:button({
text: "Hello"
onClick: @() {
Mk:dialog(null \`Hello, {name}!\`)
Mk:dialog(null, \`Hello, {name}!\`)
}
})
])
`;
const PRESET_OMIKUJI = `/// @ 0.16.0
const PRESET_OMIKUJI = `/// @ 0.18.0
//
//
@ -81,11 +81,11 @@ let choices = [
"大凶"
]
// ID+
let random = Math:gen_rng(\`{USER_ID}{Date:year()}{Date:month()}{Date:day()}\`)
// PlayID+ID+
let random = Math:gen_rng(\`{THIS_ID}{USER_ID}{Date:year()}{Date:month()}{Date:day()}\`)
//
let chosen = choices[random(0 (choices.len - 1))]
let chosen = choices[random(0, (choices.len - 1))]
//
let result = \`今日のあなたの運勢は **{chosen}** です。\`
@ -109,7 +109,7 @@ Ui:render([
])
`;
const PRESET_SHUFFLE = `/// @ 0.16.0
const PRESET_SHUFFLE = `/// @ 0.18.0
//
let string = "ペペロンチーノ"
@ -123,13 +123,13 @@ var cursor = 0
@do() {
if (cursor != 0) {
results = results.slice(0 (cursor + 1))
results = results.slice(0, (cursor + 1))
cursor = 0
}
let chars = []
for (let i, length) {
let r = Math:rnd(0 (length - 1))
let r = Math:rnd(0, (length - 1))
chars.push(string.pick(r))
}
let result = chars.join("")
@ -163,11 +163,11 @@ var cursor = 0
text: "←"
disabled: !(results.len > 1 && (results.len - cursor) > 1)
onClick: back
} {
}, {
text: "→"
disabled: !(results.len > 1 && cursor > 0)
onClick: forward
} {
}, {
text: "引き直す"
onClick: do
}]
@ -188,27 +188,27 @@ var cursor = 0
do()
`;
const PRESET_QUIZ = `/// @ 0.16.0
const PRESET_QUIZ = `/// @ 0.18.0
let title = '地理クイズ'
let qas = [{
q: 'オーストラリアの首都は?'
choices: ['シドニー' 'キャンベラ' 'メルボルン']
choices: ['シドニー', 'キャンベラ', 'メルボルン']
a: 'キャンベラ'
aDescription: '最大の都市はシドニーですが首都はキャンベラです。'
} {
}, {
q: '国土面積2番目の国は'
choices: ['カナダ' 'アメリカ' '中国']
choices: ['カナダ', 'アメリカ', '中国']
a: 'カナダ'
aDescription: '大きい順にロシア、カナダ、アメリカ、中国です。'
} {
}, {
q: '二重内陸国ではないのは?'
choices: ['リヒテンシュタイン' 'ウズベキスタン' 'レソト']
choices: ['リヒテンシュタイン', 'ウズベキスタン', 'レソト']
a: 'レソト'
aDescription: 'レソトは(一重)内陸国です。'
} {
}, {
q: '閘門がない運河は?'
choices: ['キール運河' 'スエズ運河' 'パナマ運河']
choices: ['キール運河', 'スエズ運河', 'パナマ運河']
a: 'スエズ運河'
aDescription: 'スエズ運河は高低差がないので閘門はありません。'
}]
@ -244,9 +244,9 @@ each (let qa, qas) {
})
Ui:C:container({
children: []
} \`{qa.id}:a\`)
}, \`{qa.id}:a\`)
]
} qa.id))
}, qa.id))
}
@finish() {
@ -296,12 +296,12 @@ qaEls.push(Ui:C:container({
onClick: finish
})
]
} 'footer'))
}, 'footer'))
Ui:render(qaEls)
`;
const PRESET_TIMELINE = `/// @ 0.16.0
const PRESET_TIMELINE = `/// @ 0.18.0
// API
@fetch() {
@ -315,7 +315,7 @@ const PRESET_TIMELINE = `/// @ 0.16.0
])
//
let notes = Mk:api("notes/local-timeline" {})
let notes = Mk:api("notes/local-timeline", {})
// UI
let noteEls = []

View file

@ -15,11 +15,15 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkAsUi v-if="root" :component="root" :components="components"/>
</div>
<div class="actions _panel">
<MkButton v-if="flash.isLiked" v-tooltip="i18n.ts.unlike" asLike class="button" rounded primary @click="unlike()"><i class="ti ti-heart"></i><span v-if="flash.likedCount > 0" style="margin-left: 6px;">{{ flash.likedCount }}</span></MkButton>
<MkButton v-else v-tooltip="i18n.ts.like" asLike class="button" rounded @click="like()"><i class="ti ti-heart"></i><span v-if="flash.likedCount > 0" style="margin-left: 6px;">{{ flash.likedCount }}</span></MkButton>
<MkButton v-tooltip="i18n.ts.shareWithNote" class="button" rounded @click="shareWithNote"><i class="ti ti-repeat ti-fw"></i></MkButton>
<MkButton v-tooltip="i18n.ts.copyLink" class="button" rounded @click="copyLink"><i class="ti ti-link ti-fw"></i></MkButton>
<MkButton v-if="isSupportShare()" v-tooltip="i18n.ts.share" class="button" rounded @click="share"><i class="ti ti-share ti-fw"></i></MkButton>
<div class="items">
<MkButton v-tooltip="i18n.ts.reload" class="button" rounded @click="reset"><i class="ti ti-reload"></i></MkButton>
</div>
<div class="items">
<MkButton v-if="flash.isLiked" v-tooltip="i18n.ts.unlike" asLike class="button" rounded primary @click="unlike()"><i class="ti ti-heart"></i><span v-if="flash?.likedCount && flash.likedCount > 0" style="margin-left: 6px;">{{ flash.likedCount }}</span></MkButton>
<MkButton v-else v-tooltip="i18n.ts.like" asLike class="button" rounded @click="like()"><i class="ti ti-heart"></i><span v-if="flash?.likedCount && flash.likedCount > 0" style="margin-left: 6px;">{{ flash.likedCount }}</span></MkButton>
<MkButton v-tooltip="i18n.ts.copyLink" class="button" rounded @click="copyLink"><i class="ti ti-link ti-fw"></i></MkButton>
<MkButton v-tooltip="i18n.ts.share" class="button" rounded @click="share"><i class="ti ti-share ti-fw"></i></MkButton>
</div>
</div>
</div>
<div v-else :class="$style.ready">
@ -49,7 +53,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkA v-if="$i && $i.id === flash.userId" :to="`/play/${flash.id}/edit`" style="color: var(--accent);">{{ i18n.ts._play.editThisPage }}</MkA>
<MkAd :prefer="['horizontal', 'horizontal-big']"/>
</div>
<MkError v-else-if="error" @retry="fetchPage()"/>
<MkError v-else-if="error" @retry="fetchFlash()"/>
<MkLoading v-else/>
</Transition>
</MkSpacer>
@ -94,12 +98,33 @@ function fetchFlash() {
});
}
function share(ev: MouseEvent) {
if (!flash.value) return;
os.popupMenu([
{
text: i18n.ts.shareWithNote,
icon: 'ti ti-pencil',
action: shareWithNote,
},
...(isSupportShare() ? [{
text: i18n.ts.share,
icon: 'ti ti-share',
action: shareWithNavigator,
}] : []),
], ev.currentTarget ?? ev.target);
}
function copyLink() {
if (!flash.value) return;
copyToClipboard(`${url}/play/${flash.value.id}`);
os.success();
}
function share() {
function shareWithNavigator() {
if (!flash.value) return;
navigator.share({
title: flash.value.title,
text: flash.value.summary,
@ -108,21 +133,28 @@ function share() {
}
function shareWithNote() {
if (!flash.value) return;
os.post({
initialText: `${flash.value.title} ${url}/play/${flash.value.id}`,
initialText: `${flash.value.title}\n${url}/play/${flash.value.id}`,
instant: true,
});
}
function like() {
if (!flash.value) return;
os.apiWithDialog('flash/like', {
flashId: flash.value.id,
}).then(() => {
flash.value.isLiked = true;
flash.value.likedCount++;
flash.value!.isLiked = true;
flash.value!.likedCount++;
});
}
async function unlike() {
if (!flash.value) return;
const confirm = await os.confirm({
type: 'warning',
text: i18n.ts.unlikeConfirm,
@ -131,8 +163,8 @@ async function unlike() {
os.apiWithDialog('flash/unlike', {
flashId: flash.value.id,
}).then(() => {
flash.value.isLiked = false;
flash.value.likedCount--;
flash.value!.isLiked = false;
flash.value!.likedCount--;
});
}
@ -152,6 +184,7 @@ function start() {
async function run() {
if (aiscript.value) aiscript.value.abort();
if (!flash.value) return;
aiscript.value = new Interpreter({
...createAiScriptEnv({
@ -193,12 +226,17 @@ async function run() {
}
}
onDeactivated(() => {
function reset() {
if (aiscript.value) aiscript.value.abort();
started.value = false;
}
onDeactivated(() => {
reset();
});
onUnmounted(() => {
if (aiscript.value) aiscript.value.abort();
reset();
});
const headerActions = computed(() => []);
@ -265,11 +303,19 @@ definePageMetadata(() => ({
}
> .actions {
display: flex;
justify-content: center;
gap: 12px;
margin-top: 16px;
padding: 16px;
> .items {
display: flex;
justify-content: center;
gap: 12px;
padding: 16px;
border-bottom: 1px solid var(--divider);
&:last-child {
border-bottom: none;
}
}
}
}
}

View file

@ -151,6 +151,7 @@ import MkSwitch from '@/components/MkSwitch.vue';
import { deepClone } from '@/scripts/clone.js';
import { useInterval } from '@/scripts/use-interval.js';
import { signinRequired } from '@/account.js';
import { url } from '@/config.js';
import { i18n } from '@/i18n.js';
import { misskeyApi } from '@/scripts/misskey-api.js';
import { userPage } from '@/filters/user.js';
@ -442,7 +443,7 @@ function autoplay() {
function share() {
os.post({
initialText: `#MisskeyReversi ${location.href}`,
initialText: `#MisskeyReversi\n${url}/reversi/g/${game.value.id}`,
instant: true,
});
}

View file

@ -28,6 +28,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<script lang="ts" setup>
import { ref } from 'vue';
import * as Misskey from 'misskey-js';
import MarqueeText from '@/components/MkMarquee.vue';
import { useInterval } from '@/scripts/use-interval.js';
import { shuffle } from '@/scripts/shuffle.js';
@ -42,13 +43,13 @@ const props = defineProps<{
refreshIntervalSec?: number;
}>();
const items = ref([]);
const items = ref<Misskey.entities.FetchRssResponse['items']>([]);
const fetching = ref(true);
const key = ref(0);
const tick = () => {
window.fetch(`/api/fetch-rss?url=${props.url}`, {}).then(res => {
res.json().then(feed => {
res.json().then((feed: Misskey.entities.FetchRssResponse) => {
if (props.shuffle) {
shuffle(feed.items);
}

View file

@ -24,6 +24,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<script lang="ts" setup>
import { ref, watch, computed } from 'vue';
import * as Misskey from 'misskey-js';
import { useWidgetPropsManager, WidgetComponentEmits, WidgetComponentExpose, WidgetComponentProps } from './widget.js';
import { GetFormResultType } from '@/scripts/form.js';
import MkContainer from '@/components/MkContainer.vue';
@ -64,7 +65,7 @@ const { widgetProps, configure } = useWidgetPropsManager(name,
emit,
);
const rawItems = ref([]);
const rawItems = ref<Misskey.entities.FetchRssResponse['items']>([]);
const items = computed(() => rawItems.value.slice(0, widgetProps.maxEntries));
const fetching = ref(true);
const fetchEndpoint = computed(() => {
@ -79,8 +80,8 @@ const tick = () => {
window.fetch(fetchEndpoint.value, {})
.then(res => res.json())
.then(feed => {
rawItems.value = feed.items ?? [];
.then((feed: Misskey.entities.FetchRssResponse) => {
rawItems.value = feed.items;
fetching.value = false;
});
};

View file

@ -28,6 +28,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<script lang="ts" setup>
import { ref, watch, computed } from 'vue';
import * as Misskey from 'misskey-js';
import { useWidgetPropsManager, WidgetComponentEmits, WidgetComponentExpose, WidgetComponentProps } from './widget.js';
import MarqueeText from '@/components/MkMarquee.vue';
import { GetFormResultType } from '@/scripts/form.js';
@ -87,7 +88,7 @@ const { widgetProps, configure } = useWidgetPropsManager(name,
emit,
);
const rawItems = ref([]);
const rawItems = ref<Misskey.entities.FetchRssResponse['items']>([]);
const items = computed(() => {
const newItems = rawItems.value.slice(0, widgetProps.maxEntries);
if (widgetProps.shuffle) {
@ -110,8 +111,8 @@ const tick = () => {
window.fetch(fetchEndpoint.value, {})
.then(res => res.json())
.then(feed => {
rawItems.value = feed.items ?? [];
.then((feed: Misskey.entities.FetchRssResponse) => {
rawItems.value = feed.items;
fetching.value = false;
key.value++;
});

View file

@ -51,6 +51,22 @@ const devConfig = {
'/_info_card_': httpUrl,
'/bios': httpUrl,
'/cli': httpUrl,
'/inbox': httpUrl,
'/notes': {
target: httpUrl,
headers: {
'Accept': 'application/activity+json',
},
},
'/users': {
target: httpUrl,
headers: {
'Accept': 'application/activity+json',
},
},
'/.well-known': {
target: httpUrl,
},
},
},
build: {