From 8b5768f8482573a4b1d709214dc762f7e9a7de97 Mon Sep 17 00:00:00 2001
From: Hazelnoot <acomputerdog@gmail.com>
Date: Tue, 1 Apr 2025 12:49:53 -0400
Subject: [PATCH] add DynamicNoteSimple.vue

---
 CONTRIBUTING.md                               |  1 +
 .../src/components/DynamicNoteSimple.vue      | 48 +++++++++++++++++++
 .../frontend/src/components/MkNoteSimple.vue  |  2 +-
 .../frontend/src/components/MkUrlPreview.vue  | 12 +----
 4 files changed, 52 insertions(+), 11 deletions(-)
 create mode 100644 packages/frontend/src/components/DynamicNoteSimple.vue

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 6bf9a4803b..5815ec44fd 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -671,6 +671,7 @@ seems to do a decent job)
     * from MK note components to Dynamic note components (if the public signature changed)
         * from `packages/frontend/src/components/MkNote.vue` to `packages/frontend/src/components/DynamicNote.vue`
 				* from `packages/frontend/src/components/MkNoteDetailed.vue` to `packages/frontend/src/components/DynamicNoteDetailed.vue`
+				* from `packages/frontend/src/components/MkNoteSimple.vue` to `packages/frontend/src/components/DynamicNoteSimple.vue`
     * from the global timeline to the bubble timeline
         * `packages/backend/src/server/api/stream/channels/global-timeline.ts`
         * `packages/backend/src/server/api/stream/channels/bubble-timeline.ts`
diff --git a/packages/frontend/src/components/DynamicNoteSimple.vue b/packages/frontend/src/components/DynamicNoteSimple.vue
new file mode 100644
index 0000000000..a7713afad1
--- /dev/null
+++ b/packages/frontend/src/components/DynamicNoteSimple.vue
@@ -0,0 +1,48 @@
+<!--
+SPDX-FileCopyrightText: hazelnoot and other Sharkey contributors
+SPDX-License-Identifier: AGPL-3.0-only
+-->
+
+<template>
+<XNoteSimple
+	ref="rootEl"
+	:note="note"
+	:expandAllCws="expandAllCws"
+	:hideFiles="hideFiles"
+	@editScheduledNote="() => emit('editScheduleNote')"
+/>
+</template>
+
+<script setup lang="ts">
+import * as Misskey from 'misskey-js';
+import { computed, defineAsyncComponent, shallowRef } from 'vue';
+import type { ComponentExposed } from 'vue-component-type-helpers';
+import type MkNoteSimple from '@/components/MkNoteSimple.vue';
+import type SkNoteSimple from '@/components/SkNoteSimple.vue';
+import { prefer } from '@/preferences';
+
+const XNoteSimple = computed(() =>
+	defineAsyncComponent<typeof MkNoteSimple | typeof SkNoteSimple>(() =>
+		prefer.r.noteDesign.value === 'misskey'
+			? import('@/components/MkNoteSimple.vue')
+			: import('@/components/SkNoteSimple.vue'),
+	),
+);
+
+const rootEl = shallowRef<ComponentExposed<typeof MkNoteSimple | typeof SkNoteSimple>>();
+
+defineExpose({ rootEl });
+
+defineProps<{
+	note: Misskey.entities.Note & {
+		isSchedule?: boolean,
+		scheduledNoteId?: string
+	};
+	expandAllCws?: boolean;
+	hideFiles?: boolean;
+}>();
+
+const emit = defineEmits<{
+	(ev: 'editScheduleNote'): void;
+}>();
+</script>
diff --git a/packages/frontend/src/components/MkNoteSimple.vue b/packages/frontend/src/components/MkNoteSimple.vue
index 4df6b1d75c..154efd7917 100644
--- a/packages/frontend/src/components/MkNoteSimple.vue
+++ b/packages/frontend/src/components/MkNoteSimple.vue
@@ -39,7 +39,7 @@ import { prefer } from '@/preferences.js';
 
 const props = defineProps<{
 	note: Misskey.entities.Note & {
-		isSchedule? : boolean,
+		isSchedule?: boolean,
 		scheduledNoteId?: string
 	};
 	expandAllCws?: boolean;
diff --git a/packages/frontend/src/components/MkUrlPreview.vue b/packages/frontend/src/components/MkUrlPreview.vue
index 1e7c5cdf40..6cd57bcc33 100644
--- a/packages/frontend/src/components/MkUrlPreview.vue
+++ b/packages/frontend/src/components/MkUrlPreview.vue
@@ -43,7 +43,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 		</MkButton>
 	</div>
 </template>
-<div v-else-if="theNote" :class="[$style.link, { [$style.compact]: compact }]"><XNoteSimple :note="theNote" :class="$style.body"/></div>
+<div v-else-if="theNote" :class="[$style.link, { [$style.compact]: compact }]"><DynamicNoteSimple :note="theNote" :class="$style.body"/></div>
 <div v-else-if="!hidePreview">
 	<component :is="self ? 'MkA' : 'a'" :class="[$style.link, { [$style.compact]: compact }]" :[attr]="self ? url.substring(local.length) : url" rel="nofollow noopener" :target="target" :title="url" @click.prevent="self ? true : warningExternalWebsite(url)" @click.stop>
 		<div v-if="thumbnail && !sensitive" :class="$style.thumbnail" :style="prefer.s.dataSaver.urlPreview ? '' : `background-image: url('${thumbnail}')`">
@@ -94,8 +94,6 @@ import { url as local } from '@@/js/config.js';
 import { versatileLang } from '@@/js/intl-const.js';
 import * as Misskey from 'misskey-js';
 import type { summaly } from '@misskey-dev/summaly';
-import type MkNoteSimple from '@/components/MkNoteSimple.vue';
-import type SkNoteSimple from '@/components/SkNoteSimple.vue';
 import { i18n } from '@/i18n.js';
 import * as os from '@/os.js';
 import { deviceKind } from '@/utility/device-kind.js';
@@ -105,13 +103,7 @@ import { store } from '@/store.js';
 import { prefer } from '@/preferences.js';
 import { misskeyApi } from '@/utility/misskey-api.js';
 import { warningExternalWebsite } from '@/utility/warning-external-website.js';
-
-// TODO DynamicNoteSimple
-const XNoteSimple = defineAsyncComponent<typeof MkNoteSimple | typeof SkNoteSimple>(() =>
-	prefer.s.noteDesign === 'misskey'
-		? import('@/components/MkNoteSimple.vue')
-		: import('@/components/SkNoteSimple.vue'),
-);
+import DynamicNoteSimple from '@/components/DynamicNoteSimple.vue';
 
 type SummalyResult = Awaited<ReturnType<typeof summaly>>;