enhance(frontend): 대화 페이지를 새로 고치지 않아도 자동으로 갱신함

This commit is contained in:
NoriDev 2024-01-04 17:27:51 +09:00
parent 76cb7eba33
commit 8d4b08aaed
2 changed files with 10 additions and 3 deletions

View file

@ -74,6 +74,7 @@ Misskey의 전체 변경 사항을 확인하려면, [CHANGELOG.md#2023xx](CHANGE
- `<`를 입력하면 ``<b>, ~~, <i>, <small>, <center>, <plain>, `, ```, \(\), \(\\ \)`` 태그를 자동으로 입력할 수 있음 - `<`를 입력하면 ``<b>, ~~, <i>, <small>, <center>, <plain>, `, ```, \(\), \(\\ \)`` 태그를 자동으로 입력할 수 있음
- Enhance: 서버에서 푸시 알림을 사용할 수 있으면 푸시 알림을 활성화 하도록 대화 상자를 표시 - Enhance: 서버에서 푸시 알림을 사용할 수 있으면 푸시 알림을 활성화 하도록 대화 상자를 표시
- Enhance: 리액션 뷰어에서 우클릭하면 리액션을 복사할 수 있음 - Enhance: 리액션 뷰어에서 우클릭하면 리액션을 복사할 수 있음
- Enhance: 대화 페이지를 새로 고치지 않아도 자동으로 갱신함
- Fix: '모달 배경색 제거' 옵션이 이모지 피커에 반영되지 않음 - Fix: '모달 배경색 제거' 옵션이 이모지 피커에 반영되지 않음
- Fix: 열람 주의로 설정된 노트의 리액션이 '더 보기'를 눌러야 표시됨 - Fix: 열람 주의로 설정된 노트의 리액션이 '더 보기'를 눌러야 표시됨
- Fix: 채널 이름이 긴 경우 게시 양식 표시가 깨지는 문제 (misskey-dev/misskey#12524) - Fix: 채널 이름이 긴 경우 게시 양식 표시가 깨지는 문제 (misskey-dev/misskey#12524)

View file

@ -9,12 +9,12 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkSpacer :contentMax="800"> <MkSpacer :contentMax="800">
<div> <div>
<div v-if="tab === 'direct'"> <div v-if="tab === 'direct'">
<MkPagination v-slot="{ items }" :pagination="directPagination"> <MkPagination v-slot="{ items }" ref="pagingComponent" :pagination="directPagination">
<MkChatPreview v-for="message in items" :key="message.id" :message="message"/> <MkChatPreview v-for="message in items" :key="message.id" :message="message"/>
</MkPagination> </MkPagination>
</div> </div>
<div v-else-if="tab === 'groups'"> <div v-else-if="tab === 'groups'">
<MkPagination v-slot="{ items }" :pagination="groupsPagination"> <MkPagination v-slot="{ items }" ref="pagingComponent" :pagination="groupsPagination">
<MkChatPreview v-for="message in items" :key="message.id" :message="message"/> <MkChatPreview v-for="message in items" :key="message.id" :message="message"/>
</MkPagination> </MkPagination>
</div> </div>
@ -24,7 +24,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { computed, markRaw, onMounted, onUnmounted, ref } from 'vue'; import { computed, markRaw, onActivated, onMounted, onUnmounted, ref, shallowRef } from 'vue';
import * as Misskey from 'cherrypick-js'; import * as Misskey from 'cherrypick-js';
import * as os from '@/os.js'; import * as os from '@/os.js';
import { useStream } from '@/stream.js'; import { useStream } from '@/stream.js';
@ -36,6 +36,8 @@ import { globalEvents } from '@/events.js';
import MkChatPreview from '@/components/MkChatPreview.vue'; import MkChatPreview from '@/components/MkChatPreview.vue';
import MkPagination from '@/components/MkPagination.vue'; import MkPagination from '@/components/MkPagination.vue';
const pagingComponent = shallowRef<InstanceType<typeof MkPagination>>();
const router = useRouter(); const router = useRouter();
const tab = ref('direct'); const tab = ref('direct');
@ -146,6 +148,10 @@ onMounted(() => {
}); });
}); });
onActivated(() => {
pagingComponent.value?.reload();
});
onUnmounted(() => { onUnmounted(() => {
if (connection) connection.dispose(); if (connection) connection.dispose();
}); });