copy changes to SkNoteHeader.vue

This commit is contained in:
Hazelnoot 2025-04-01 11:28:53 -04:00
parent 577facfb2e
commit d44ccdda59

View file

@ -52,9 +52,9 @@ SPDX-License-Identifier: AGPL-3.0-only
<div v-if="note.user.isBot" :class="$style.isBot">bot</div> <div v-if="note.user.isBot" :class="$style.isBot">bot</div>
<div :class="$style.classicUsername"><MkAcct :user="note.user"/></div> <div :class="$style.classicUsername"><MkAcct :user="note.user"/></div>
<div v-if="note.user.badgeRoles" :class="$style.badgeRoles"> <div v-if="note.user.badgeRoles" :class="$style.badgeRoles">
<img v-for="role in note.user.badgeRoles" :key="role.id" v-tooltip="role.name" :class="$style.badgeRole" :src="role.iconUrl"/> <img v-for="(role, i) in note.user.badgeRoles" :key="i" v-tooltip="role.name" :class="$style.badgeRole" :src="role.iconUrl ?? ''"/>
</div> </div>
<SkInstanceTicker v-if="showTicker && !isMobile && prefer.s.showTickerOnReplies" style="cursor: pointer; max-height: 5px; top: 3px; position: relative; margin-top: 0px !important;" :instance="note.user.instance" :host="note.user.host" @click.stop="showOnRemote()"/> <SkInstanceTicker v-if="showTicker && !isMobile && prefer.s.showTickerOnReplies" style="cursor: pointer; max-height: 5px; top: 3px; position: relative; margin-top: 0 !important;" :instance="note.user.instance" :host="note.user.host" @click.stop="showOnRemote()"/>
<div :class="$style.classicInfo"> <div :class="$style.classicInfo">
<div v-if="mock"> <div v-if="mock">
<MkTime :time="note.createdAt" colored/> <MkTime :time="note.createdAt" colored/>
@ -75,36 +75,34 @@ SPDX-License-Identifier: AGPL-3.0-only
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { inject, shallowRef, ref } from 'vue'; import { inject, ref, shallowRef, useTemplateRef } from 'vue';
import * as Misskey from 'misskey-js'; import * as Misskey from 'misskey-js';
import { i18n } from '@/i18n.js'; import { i18n } from '@/i18n.js';
import { notePage } from '@/filters/note.js'; import { notePage } from '@/filters/note.js';
import { userPage } from '@/filters/user.js'; import { userPage } from '@/filters/user.js';
import { getNoteVersionsMenu } from '@/utility/get-note-versions-menu.js'; import { getNoteVersionsMenu } from '@/utility/get-note-versions-menu.js';
import SkInstanceTicker from '@/components/SkInstanceTicker.vue';
import { popupMenu } from '@/os.js'; import { popupMenu } from '@/os.js';
import { defaultStore } from '@/store.js'; import { DI } from '@/di.js';
import { useRouter } from '@/router/supplier.js'; import { prefer } from '@/preferences';
import { deviceKind } from '@/utility/device-kind.js'; import { useRouter } from '@/router';
import MkInstanceTicker from '@/components/MkInstanceTicker.vue'; import { deviceKind } from '@/utility/device-kind';
import SkInstanceTicker from '@/components/SkInstanceTicker.vue';
const props = defineProps<{ const props = defineProps<{
note: Misskey.entities.Note; note: Misskey.entities.Note;
classic?: boolean; classic?: boolean;
}>(); }>();
const menuVersionsButton = shallowRef<HTMLElement>(); const menuVersionsButton = useTemplateRef('menuVersionsButton');
const router = useRouter(); const router = useRouter();
const showTicker = (prefer.s.instanceTicker === 'always') || (prefer.s.instanceTicker === 'remote' && props.note.user.instance); const showTicker = (prefer.s.instanceTicker === 'always') || (prefer.s.instanceTicker === 'remote' && props.note.user.instance);
const MOBILE_THRESHOLD = 500; const MOBILE_THRESHOLD = 500;
const isMobile = ref(deviceKind === 'smartphone' || window.innerWidth <= MOBILE_THRESHOLD); const isMobile = ref(deviceKind === 'smartphone' || window.innerWidth <= MOBILE_THRESHOLD);
async function menuVersions(viaKeyboard = false): Promise<void> { async function menuVersions(): Promise<void> {
const { menu, cleanup } = await getNoteVersionsMenu({ note: props.note, menuVersionsButton }); const { menu, cleanup } = await getNoteVersionsMenu({ note: props.note, menuButton: menuVersionsButton });
popupMenu(menu, menuVersionsButton.value, { popupMenu(menu, menuVersionsButton.value).then(focus).finally(cleanup);
viaKeyboard,
}).then(focus).finally(cleanup);
} }
function showOnRemote() { function showOnRemote() {
@ -112,7 +110,7 @@ function showOnRemote() {
else window.open(props.note.url ?? props.note.uri); else window.open(props.note.url ?? props.note.uri);
} }
const mock = inject<boolean>('mock', false); const mock = inject(DI.mock, false);
</script> </script>
<style lang="scss" module> <style lang="scss" module>