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

wip

Browse Source
This commit is contained in:
syuilo
2025-03-17 18:59:22 +09:00
parent 0c81f8a28a
commit 86f2ababd1
4 changed files with 93 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
packages/frontend/src/pages/chat/home.vue
View File

@@ -10,34 +10,34 @@ SPDX-License-Identifier: AGPL-3.0-only
<div class="_gaps">
<MkButton primary :class="$style.start" @click="start"><i class="ti ti-plus"></i> {{ i18n.ts.startChat }}</MkButton>
<div v-if="messages.length > 0" :class="$style.history">
<div v-if="history.length > 0" :class="$style.history">
<MkA
v-for="(message, i) in messages"
:key="message.id"
:class="[$style.message, { [$style.isMe]: message.isMe, [$style.isRead]: message.isRead }]"
v-for="item in history"
:key="item.id"
:class="[$style.message, { [$style.isMe]: item.isMe, [$style.isRead]: item.message.isRead }]"
class="_panel"
:to="message.roomId ? `/chat/room/${message.roomId}` : `/chat/user/${message.otherId}`"
:to="item.message.roomId ? `/chat/room/${item.message.roomId}` : `/chat/user/${item.other.id}`"
>
<div>
<MkAvatar :class="$style.avatar" :user="message.user" indicator link preview/>
<header v-if="message.roomId">
<span class="name">{{ message.room.name }}</span>
<MkTime :time="message.createdAt" class="time"/>
<MkAvatar :class="$style.avatar" :user="item.other" indicator link preview/>
<header v-if="item.message.roomId">
<span class="name">{{ item.message.room.name }}</span>
<MkTime :time="item.message.createdAt" class="time"/>
</header>
<header v-else>
<span class="name"><MkUserName :user="message.other"/></span>
<span class="username">@{{ acct(message.other) }}</span>
<MkTime :time="message.createdAt" class="time"/>
<span class="name"><MkUserName :user="item.other"/></span>
<span class="username">@{{ acct(item.other) }}</span>
<MkTime :time="item.message.createdAt" class="time"/>
</header>
<div class="body">
<p class="text"><span v-if="message.isMe" :class="$style.iSaid">{{ i18n.ts.you }}:</span>{{ message.text }}</p>
<p class="text"><span v-if="item.isMe" :class="$style.iSaid">{{ i18n.ts.you }}:</span>{{ item.message.text }}</p>
</div>
</div>
</MkA>
</div>
<div v-if="!fetching && messages.length == 0" class="_fullinfo">
<div v-if="!fetching && history.length == 0" class="_fullinfo">
<img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/>
<div>{{ $ts.noHistory }}</div>
<div>{{ i18n.ts.noHistory }}</div>
</div>
<MkLoading v-if="fetching"/>
</div>
@@ -46,11 +46,48 @@ SPDX-License-Identifier: AGPL-3.0-only
</template>
<script lang="ts" setup>
import { computed } from 'vue';
import { computed, onMounted, ref } from 'vue';
import * as Misskey from 'misskey-js';
import MkButton from '@/components/MkButton.vue';
import { i18n } from '@/i18n.js';
import { definePage } from '@/page.js';
import { infoImageUrl } from '@/instance.js';
import { misskeyApi } from '@/utility/misskey-api.js';
import { ensureSignin } from '@/i.js';
const $i = ensureSignin();
const fetching = ref(true);
const history = ref<{
id: string;
message: Misskey.entities.ChatMessage;
other: Misskey.entities.ChatMessage['fromUser'] | Misskey.entities.ChatMessage['toUser'] | null;
isMe: boolean;
}[]>([]);
async function fetchHistory() {
fetching.value = true;
const [userMessages, groupMessages] = await Promise.all([
misskeyApi('messaging/history', { group: false }),
misskeyApi('messaging/history', { group: true }),
]);
history.value = [...userMessages, ...groupMessages]
.toSorted((a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime())
.map(m => ({
id: m.id,
message: m,
other: m.room == null ? (m.fromUserId === $i.id ? m.toUser : m.fromUser) : null,
isMe: m.fromUserId === $i.id,
}));
fetching.value = false;
}
onMounted(() => {
fetchHistory();
});
const headerActions = computed(() => []);