refactor(client): use setup syntax

packages/client/src/components/notification.vue

@@ -72,8 +72,8 @@
 </div>
 </template>
 
-<script lang="ts">
+<script lang="ts" setup>
-import { defineComponent, ref, onMounted, onUnmounted, watch } from 'vue';
+import { ref, onMounted, onUnmounted, watch } from 'vue';
 import * as misskey from 'misskey-js';
 import XReactionIcon from './reaction-icon.vue';
 import MkFollowButton from './follow-button.vue';
@@ -86,29 +86,15 @@ import * as os from '@/os';
 import { stream } from '@/stream';
 import { useTooltip } from '@/scripts/use-tooltip';
 
-export default defineComponent({
+const props = withDefaults(defineProps<{
-	components: {
+	notification: misskey.entities.Notification;
-		XReactionIcon, MkFollowButton,
+	withTime?: boolean;
-	},
+	full?: boolean;
+}>(), {
+	withTime: false,
+	full: false,
+});
 
-	props: {
-		notification: {
-			type: Object,
-			required: true,
-		},
-		withTime: {
-			type: Boolean,
-			required: false,
-			default: false,
-		},
-		full: {
-			type: Boolean,
-			required: false,
-			default: false,
-		},
-	},
-
-	setup(props) {
 const elRef = ref<HTMLElement>(null);
 const reactionRef = ref(null);
 
@@ -172,23 +158,6 @@ export default defineComponent({
 		targetElement: reactionRef.value.$el,
 	}, {}, 'closed');
 });
-
-		return {
-			getNoteSummary: (note: misskey.entities.Note) => getNoteSummary(note),
-			followRequestDone,
-			groupInviteDone,
-			notePage,
-			userPage,
-			acceptFollowRequest,
-			rejectFollowRequest,
-			acceptGroupInvitation,
-			rejectGroupInvitation,
-			elRef,
-			reactionRef,
-			i18n,
-		};
-	},
-});
 </script>
 
 <style lang="scss" scoped>