OpenSource/misskey
OpenSource/misskey
1
0
Fork 0
mirror of https://github.com/misskey-dev/misskey.git synced 2024-12-23 12:50:39 +01:00
Code Issues Projects Releases Packages Wiki Activity

wip

Browse source
This commit is contained in:
syuilo 2024-08-26 15:34:29 +09:00
parent e90bdae545
commit bc1070f30a
1 changed files with 7 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
packages/frontend-embed/src/components/EmNote.vue
View file

@ -26,7 +26,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</template> </template>
</I18n> </I18n>
<div :class="$style.renoteInfo"> <div :class="$style.renoteInfo">
<button ref="renoteTime" :class="$style.renoteTime" class="_button" @mousedown.prevent="showRenoteMenu()"> <button ref="renoteTime" :class="$style.renoteTime" class="_button">
<i class="ti ti-dots" :class="$style.renoteMenu"></i> <i class="ti ti-dots" :class="$style.renoteMenu"></i>
<EmTime :time="note.createdAt"/> <EmTime :time="note.createdAt"/>
</button> </button>
@ -39,7 +39,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<span v-if="note.channel" style="margin-left: 0.5em;" :title="note.channel.name"><i class="ti ti-device-tv"></i></span> <span v-if="note.channel" style="margin-left: 0.5em;" :title="note.channel.name"><i class="ti ti-device-tv"></i></span>
</div> </div>
</div> </div>
<article :class="$style.article" @contextmenu.stop="onContextmenu"> <article :class="$style.article">
<div v-if="appearNote.channel" :class="$style.colorBar" :style="{ background: appearNote.channel.color }"></div> <div v-if="appearNote.channel" :class="$style.colorBar" :style="{ background: appearNote.channel.color }"></div>
<EmAvatar :class="$style.avatar" :user="appearNote.user"/> <EmAvatar :class="$style.avatar" :user="appearNote.user"/>
<div :class="$style.main"> <div :class="$style.main">
@ -85,7 +85,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</div> </div>
<EmA v-if="appearNote.channel && !inChannel" :class="$style.channel" :to="`/channels/${appearNote.channel.id}`"><i class="ti ti-device-tv"></i> {{ appearNote.channel.name }}</EmA> <EmA v-if="appearNote.channel && !inChannel" :class="$style.channel" :to="`/channels/${appearNote.channel.id}`"><i class="ti ti-device-tv"></i> {{ appearNote.channel.name }}</EmA>
</div> </div>
<EmReactionsViewer v-if="appearNote.reactionAcceptance !== 'likeOnly'" :note="appearNote" :maxNumber="16" @mockUpdateMyReaction="emitUpdReaction"> <EmReactionsViewer v-if="appearNote.reactionAcceptance !== 'likeOnly'" :note="appearNote" :maxNumber="16">
<template #more> <template #more>
<EmA :to="`/notes/${appearNote.id}/reactions`" :class="[$style.reactionOmitted]">{{ i18n.ts.more }}</EmA> <EmA :to="`/notes/${appearNote.id}/reactions`" :class="[$style.reactionOmitted]">{{ i18n.ts.more }}</EmA>
</template> </template>
@ -94,12 +94,9 @@ SPDX-License-Identifier: AGPL-3.0-only
<a :href="`/notes/${appearNote.id}`" target="_blank" rel="noopener" :class="[$style.footerButton, $style.footerButtonLink]" class="_button"> <a :href="`/notes/${appearNote.id}`" target="_blank" rel="noopener" :class="[$style.footerButton, $style.footerButtonLink]" class="_button">
<i class="ti ti-arrow-back-up"></i> <i class="ti ti-arrow-back-up"></i>
</a> </a>
<a v-if="canRenote" :href="`/notes/${appearNote.id}`" target="_blank" rel="noopener" :class="[$style.footerButton, $style.footerButtonLink]" class="_button"> <a :href="`/notes/${appearNote.id}`" target="_blank" rel="noopener" :class="[$style.footerButton, $style.footerButtonLink]" class="_button">
<i class="ti ti-repeat"></i> <i class="ti ti-repeat"></i>
</a> </a>
<a v-else :href="`/notes/${appearNote.id}`" target="_blank" rel="noopener" :class="[$style.footerButton, $style.footerButtonLink]" class="_button" disabled>
<i class="ti ti-ban"></i>
</a>
<a :href="`/notes/${appearNote.id}`" target="_blank" rel="noopener" :class="[$style.footerButton, $style.footerButtonLink]" class="_button"> <a :href="`/notes/${appearNote.id}`" target="_blank" rel="noopener" :class="[$style.footerButton, $style.footerButtonLink]" class="_button">
<i v-if="appearNote.reactionAcceptance === 'likeOnly'" class="ti ti-heart"></i> <i v-if="appearNote.reactionAcceptance === 'likeOnly'" class="ti ti-heart"></i>
<i v-else class="ti ti-plus"></i> <i v-else class="ti ti-plus"></i>
@ -124,14 +121,9 @@ import EmReactionsViewer from '@/components/EmReactionsViewer.vue';
import EmMediaList from '@/components/EmMediaList.vue'; import EmMediaList from '@/components/EmMediaList.vue';
import EmCwButton from '@/components/EmCwButton.vue'; import EmCwButton from '@/components/EmCwButton.vue';
import EmPoll from '@/components/EmPoll.vue'; import EmPoll from '@/components/EmPoll.vue';
import { pleaseLogin, type OpenOnRemoteOptions } from '@/scripts/please-login.js';
import { userPage } from '@/utils.js'; import { userPage } from '@/utils.js';
import { extractUrlFromMfm } from '@/scripts/extract-url-from-mfm.js';
import { i18n } from '@/i18n.js'; import { i18n } from '@/i18n.js';
import { deepClone } from '@/scripts/clone.js'; import { shouldCollapsed } from '@/to-be-shared/collapsed.js';
import { getNoteSummary } from '@/scripts/get-note-summary.js';
import { shouldCollapsed } from '@/scripts/collapsed.js';
import { host } from '@/config.js';
import { url } from '@/config.js'; import { url } from '@/config.js';
function getAppearNote(note: Misskey.entities.Note) { function getAppearNote(note: Misskey.entities.Note) {
@ -153,7 +145,7 @@ const inTimeline = inject<boolean>('inTimeline', false);
const inChannel = inject('inChannel', null); const inChannel = inject('inChannel', null);
const currentClip = inject<Ref<Misskey.entities.Clip> | null>('currentClip', null); const currentClip = inject<Ref<Misskey.entities.Clip> | null>('currentClip', null);
const note = ref(deepClone(props.note)); const note = ref((props.note));
const isRenote = Misskey.note.isPureRenote(note.value); const isRenote = Misskey.note.isPureRenote(note.value);
@ -166,23 +158,11 @@ const clipButton = shallowRef<HTMLElement>();
const appearNote = computed(() => getAppearNote(note.value)); const appearNote = computed(() => getAppearNote(note.value));
const showContent = ref(false); const showContent = ref(false);
const parsed = computed(() => appearNote.value.text ? mfm.parse(appearNote.value.text) : null); const parsed = computed(() => appearNote.value.text ? mfm.parse(appearNote.value.text) : null);
const urls = computed(() => parsed.value ? extractUrlFromMfm(parsed.value).filter((url) => appearNote.value.renote?.url !== url && appearNote.value.renote?.uri !== url) : null); const isLong = shouldCollapsed(appearNote.value, []);
const isLong = shouldCollapsed(appearNote.value, urls.value ?? []);
const collapsed = ref(appearNote.value.cw == null && isLong); const collapsed = ref(appearNote.value.cw == null && isLong);
const isDeleted = ref(false); const isDeleted = ref(false);
const translation = ref<Misskey.entities.NotesTranslateResponse | null>(null); const translation = ref<Misskey.entities.NotesTranslateResponse | null>(null);
const translating = ref(false); const translating = ref(false);
const canRenote = computed(() => ['public', 'home'].includes(appearNote.value.visibility) || (appearNote.value.visibility === 'followers' && appearNote.value.userId === $i?.id));
const pleaseLoginContext = computed<OpenOnRemoteOptions>(() => ({
type: 'lookup',
url: `https://${host}/notes/${appearNote.value.id}`,
}));
watch(() => props.note, (to) => {
note.value = deepClone(to);
}, { deep: true });
</script> </script>
<style lang="scss" module> <style lang="scss" module>