sendnrw/misskey
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

クリップタイムラインの埋め込み

Browse Source
This commit is contained in:
kakkokari-gtyih
2024-06-06 19:26:05 +09:00
parent 5edbe3aace
commit ed0389bf60
4 changed files with 227 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
packages/frontend/src/pages/embed/user-timeline.vue
View File

@@ -4,39 +4,43 @@ SPDX-License-Identifier: AGPL-3.0-only
-->
<template>
<div :class="$style.userTimelineRoot">
<div>
<MkLoading v-if="loading"/>
<template v-else-if="user">
<div v-if="normalizedShowHeader" :class="$style.userHeader">
<a :href="`/@${user.username}`" target="_blank" rel="noopener noreferrer" :class="$style.avatarLink">
<MkAvatar :class="$style.avatar" :user="user"/>
</a>
<div :class="$style.headerTitle" @click="top">
<I18n :src="i18n.ts.noteOf" tag="div" class="_nowrap">
<template #user>
<a :href="`/@${user.username}`" target="_blank" rel="noopener noreferrer">
<MkUserName :user="user"/>
</a>
</template>
</I18n>
<div :class="$style.sub">{{ i18n.tsx.fromX({ x: instanceName }) }}</div>
<XEmbedTimelineUI v-else-if="user" :showHeader="normalizedShowHeader">
<template #header>
<div :class="$style.userHeader">
<a :href="`/@${user.username}`" target="_blank" rel="noopener noreferrer" :class="$style.avatarLink">
<MkAvatar :class="$style.avatar" :user="user"/>
</a>
<div :class="$style.headerTitle" @click="top">
<I18n :src="i18n.ts.noteOf" tag="div" class="_nowrap">
<template #user>
<a :href="`/@${user.username}`" target="_blank" rel="noopener noreferrer">
<MkUserName :user="user"/>
</a>
</template>
</I18n>
<div :class="$style.sub">{{ i18n.tsx.fromX({ x: instanceName }) }}</div>
</div>
<a :href="url" :class="$style.instanceIconLink" target="_blank" rel="noopener noreferrer">
<img
:class="$style.instanceIcon"
:src="instance.iconUrl || '/favicon.ico'"
/>
</a>
</div>
<a :href="url" :class="$style.instanceIconLink" target="_blank" rel="noopener noreferrer">
<img
:class="$style.instanceIcon"
:src="instance.iconUrl || '/favicon.ico'"
/>
</a>
</div>
<MkNotes
ref="notesEl"
:class="$style.userTimelineNotes"
:pagination="pagination"
:disableAutoLoad="!normalizedEnableAutoLoad"
:noGap="true"
:ad="false"
/>
</template>
</template>
<template #body>
<MkNotes
ref="notesEl"
:class="$style.userTimelineNotes"
:pagination="pagination"
:disableAutoLoad="!normalizedEnableAutoLoad"
:noGap="true"
:ad="false"
/>
</template>
</XEmbedTimelineUI>
<XNotFound v-else/>
</div>
</template>
@@ -46,6 +50,7 @@ import { ref, computed, shallowRef } from 'vue';
import * as Misskey from 'misskey-js';
import MkNotes from '@/components/MkNotes.vue';
import XNotFound from '@/pages/not-found.vue';
import XEmbedTimelineUI from '@/pages/embed/_timeline_ui_.vue';
import type { Paging } from '@/components/MkPagination.vue';
import { misskeyApi } from '@/scripts/misskey-api.js';
import { i18n } from '@/i18n.js';
@@ -98,22 +103,12 @@ misskeyApi('users/show', {
</script>
<style lang="scss" module>
.userTimelineRoot {
background-color: var(--panel);
height: 100%;
max-height: var(--embedMaxHeight, none);
display: flex;
flex-direction: column;
}
.userHeader {
flex-shrink: 0;
padding: 8px 16px;
display: flex;
min-width: 0;
align-items: center;
gap: var(--margin);
border-bottom: 1px solid var(--divider);
overflow: hidden;
.avatarLink {
@@ -151,9 +146,4 @@ misskeyApi('users/show', {
border-radius: 4px;
}
}
.userTimelineNotes {
flex: 1;
overflow-y: auto;
}
</style>