From 97575064d54ee170bb1d75488136392bcbe2025e Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Wed, 31 Aug 2022 00:24:33 +0900
Subject: [PATCH 1/6] refactor(client): align filename to component name

---
 packages/client/src/account.ts                |  4 +-
 .../{abuse-report.vue => MkAbuseReport.vue}   |  2 +-
 ...ort-window.vue => MkAbuseReportWindow.vue} |  0
 .../{analog-clock.vue => MkAnalogClock.vue}   |  0
 .../{autocomplete.vue => MkAutocomplete.vue}  |  0
 .../components/{avatars.vue => MkAvatars.vue} |  0
 .../components/{captcha.vue => MkCaptcha.vue} |  0
 ...w-button.vue => MkChannelFollowButton.vue} |  0
 ...annel-preview.vue => MkChannelPreview.vue} |  0
 .../src/components/{chart.vue => MkChart.vue} |  0
 .../{chart-tooltip.vue => MkChartTooltip.vue} |  0
 .../{code-core.vue => MkCode.core.vue}        |  0
 .../src/components/{code.vue => MkCode.vue}   |  2 +-
 ...cropper-dialog.vue => MkCropperDialog.vue} |  0
 .../{cw-button.vue => MkCwButton.vue}         |  0
 ...rated-list.vue => MkDateSeparatedList.vue} | 40 +++++++++----------
 .../components/{dialog.vue => MkDialog.vue}   |  0
 .../{digital-clock.vue => MkDigitalClock.vue} |  0
 .../{drive.file.vue => MkDrive.file.vue}      | 31 +++++++-------
 .../{drive.folder.vue => MkDrive.folder.vue}  | 27 +++++++------
 ...e.nav-folder.vue => MkDrive.navFolder.vue} |  0
 .../src/components/{drive.vue => MkDrive.vue} |  6 +--
 ...thumbnail.vue => MkDriveFileThumbnail.vue} |  2 +-
 ...ect-dialog.vue => MkDriveSelectDialog.vue} |  5 ++-
 .../{drive-window.vue => MkDriveWindow.vue}   |  5 ++-
 ....section.vue => MkEmojiPicker.section.vue} |  0
 .../{emoji-picker.vue => MkEmojiPicker.vue}   |  4 +-
 ...ker-dialog.vue => MkEmojiPickerDialog.vue} |  2 +-
 ...ker-window.vue => MkEmojiPickerWindow.vue} |  2 +-
 ...atured-photos.vue => MkFeaturedPhotos.vue} |  0
 ...t-for-admin.vue => MkFileListForAdmin.vue} |  2 +-
 ...{file-type-icon.vue => MkFileTypeIcon.vue} |  0
 .../{follow-button.vue => MkFollowButton.vue} |  0
 ...rgot-password.vue => MkForgotPassword.vue} |  0
 .../{form-dialog.vue => MkFormDialog.vue}     |  0
 .../components/{formula.vue => MkFormula.vue} | 12 +++---
 .../{formula-core.vue => MkFormulaCore.vue}   |  0
 ...t-preview.vue => MkGalleryPostPreview.vue} | 10 ++---
 .../components/{google.vue => MkGoogle.vue}   |  0
 .../{image-viewer.vue => MkImageViewer.vue}   |  0
 ...ith-blurhash.vue => MkImgWithBlurhash.vue} |  0
 ...e-card-mini.vue => MkInstanceCardMini.vue} |  2 +-
 ...instance-stats.vue => MkInstanceStats.vue} |  2 +-
 ...stance-ticker.vue => MkInstanceTicker.vue} |  0
 .../{key-value.vue => MkKeyValue.vue}         |  0
 .../{launch-pad.vue => MkLaunchPad.vue}       |  0
 .../src/components/{link.vue => MkLink.vue}   |  2 +-
 .../components/{marquee.vue => MkMarquee.vue} |  0
 .../{media-banner.vue => MkMediaBanner.vue}   |  0
 .../{media-caption.vue => MkMediaCaption.vue} |  0
 .../{media-image.vue => MkMediaImage.vue}     |  2 +-
 .../{media-list.vue => MkMediaList.vue}       |  6 +--
 .../{media-video.vue => MkMediaVideo.vue}     |  0
 .../components/{mention.vue => MkMention.vue} |  0
 .../{mini-chart.vue => MkMiniChart.vue}       |  0
 ...-page-window.vue => MkModalPageWindow.vue} |  0
 .../src/components/{note.vue => MkNote.vue}   | 22 +++++-----
 .../{note-detailed.vue => MkNoteDetailed.vue} | 20 +++++-----
 .../{note-header.vue => MkNoteHeader.vue}     |  2 +-
 .../{note-preview.vue => MkNotePreview.vue}   |  0
 .../{note-simple.vue => MkNoteSimple.vue}     |  8 ++--
 packages/client/src/components/MkNoteSub.vue  |  8 ++--
 .../src/components/{notes.vue => MkNotes.vue} |  4 +-
 .../{notification.vue => MkNotification.vue}  |  6 +--
 ...ow.vue => MkNotificationSettingWindow.vue} |  0
 ...tion-toast.vue => MkNotificationToast.vue} |  2 +-
 ...{notifications.vue => MkNotifications.vue} |  6 +--
 .../{number-diff.vue => MkNumberDiff.vue}     |  0
 ...-view.value.vue => MkObjectView.value.vue} |  0
 .../{object-view.vue => MkObjectView.vue}     |  2 +-
 .../{page-preview.vue => MkPagePreview.vue}   |  0
 .../{page-window.vue => MkPageWindow.vue}     |  2 +-
 .../src/components/{poll.vue => MkPoll.vue}   |  0
 .../{poll-editor.vue => MkPollEditor.vue}     |  0
 .../{post-form.vue => MkPostForm.vue}         | 10 ++---
 ...rm-attaches.vue => MkPostFormAttaches.vue} |  4 +-
 ...t-form-dialog.vue => MkPostFormDialog.vue} |  2 +-
 .../{reaction-icon.vue => MkReactionIcon.vue} |  0
 ...tion-tooltip.vue => MkReactionTooltip.vue} |  2 +-
 ...ails.vue => MkReactionsViewer.details.vue} |  2 +-
 ...ion.vue => MkReactionsViewer.reaction.vue} |  4 +-
 ...tions-viewer.vue => MkReactionsViewer.vue} |  2 +-
 ...remote-caution.vue => MkRemoteCaution.vue} |  0
 .../{renote-button.vue => MkRenoteButton.vue} |  2 +-
 .../components/{ripple.vue => MkRipple.vue}   |  0
 .../components/{sample.vue => MkSample.vue}   |  0
 .../components/{signin.vue => MkSignin.vue}   |  2 +-
 .../{signin-dialog.vue => MkSigninDialog.vue} |  2 +-
 .../components/{signup.vue => MkSignup.vue}   |  2 +-
 .../{signup-dialog.vue => MkSignupDialog.vue} |  2 +-
 .../components/{sparkle.vue => MkSparkle.vue} |  0
 ...-note-content.vue => MkSubNoteContent.vue} |  4 +-
 .../src/components/{tab.vue => MkTab.vue}     |  0
 .../{tag-cloud.vue => MkTagCloud.vue}         |  0
 .../{timeline.vue => MkTimeline.vue}          | 16 ++++----
 .../src/components/{toast.vue => MkToast.vue} |  0
 ...e-window.vue => MkTokenGenerateWindow.vue} |  0
 .../components/{updated.vue => MkUpdated.vue} |  2 +-
 .../{url-preview.vue => MkUrlPreview.vue}     |  0
 ...review-popup.vue => MkUrlPreviewPopup.vue} | 10 ++---
 ...{user-card-mini.vue => MkUserCardMini.vue} |  2 +-
 .../{user-info.vue => MkUserInfo.vue}         |  2 +-
 .../{user-list.vue => MkUserList.vue}         |  2 +-
 ...ndicator.vue => MkUserOnlineIndicator.vue} |  0
 .../{user-preview.vue => MkUserPreview.vue}   | 16 ++++----
 ...lect-dialog.vue => MkUserSelectDialog.vue} |  0
 .../{users-tooltip.vue => MkUsersTooltip.vue} |  0
 .../{visibility.vue => MkVisibility.vue}      |  2 +-
 ...lity-picker.vue => MkVisibilityPicker.vue} |  0
 ...waiting-dialog.vue => MkWaitingDialog.vue} |  0
 .../components/{widgets.vue => MkWidgets.vue} |  0
 .../client/src/components/form/checkbox.vue   |  2 +-
 .../src/components/global/{a.vue => MkA.vue}  |  0
 .../global/{acct.vue => MkAcct.vue}           |  0
 .../components/global/{ad.vue => MkAd.vue}    |  0
 .../global/{avatar.vue => MkAvatar.vue}       |  2 +-
 .../global/{ellipsis.vue => MkEllipsis.vue}   |  0
 .../global/{emoji.vue => MkEmoji.vue}         |  0
 .../global/{error.vue => MkError.vue}         |  0
 .../global/{loading.vue => MkLoading.vue}     |  0
 ...down.vue => MkMisskeyFlavoredMarkdown.vue} |  0
 .../{page-header.vue => MkPageHeader.vue}     |  0
 .../global/{spacer.vue => MkSpacer.vue}       |  0
 ...ky-container.vue => MkStickyContainer.vue} |  0
 .../global/{time.vue => MkTime.vue}           |  0
 .../components/global/{url.vue => MkUrl.vue}  |  2 +-
 .../global/{user-name.vue => MkUserName.vue}  |  0
 .../{router-view.vue => RouterView.vue}       |  0
 packages/client/src/components/index.ts       | 32 +++++++--------
 packages/client/src/components/mfm.ts         | 18 ++++-----
 .../client/src/components/page/page.image.vue |  2 +-
 .../client/src/components/page/page.note.vue  |  4 +-
 .../client/src/components/page/page.text.vue  |  2 +-
 packages/client/src/directives/ripple.ts      |  2 +-
 .../client/src/directives/user-preview.ts     |  2 +-
 packages/client/src/init.ts                   |  2 +-
 packages/client/src/os.ts                     | 40 +++++++++----------
 packages/client/src/pages/about-misskey.vue   |  2 +-
 packages/client/src/pages/about.emojis.vue    |  2 +-
 .../client/src/pages/about.federation.vue     |  2 +-
 packages/client/src/pages/about.vue           |  4 +-
 packages/client/src/pages/admin-file.vue      |  8 ++--
 packages/client/src/pages/admin/abuses.vue    |  2 +-
 .../client/src/pages/admin/bot-protection.vue |  2 +-
 packages/client/src/pages/admin/database.vue  |  2 +-
 packages/client/src/pages/admin/emojis.vue    |  2 +-
 packages/client/src/pages/admin/files.vue     |  2 +-
 .../src/pages/admin/overview.federation.vue   |  2 +-
 .../client/src/pages/admin/overview.user.vue  |  2 +-
 packages/client/src/pages/admin/overview.vue  |  6 +--
 .../client/src/pages/admin/proxy-account.vue  |  2 +-
 packages/client/src/pages/admin/users.vue     |  2 +-
 .../client/src/pages/antenna-timeline.vue     |  2 +-
 packages/client/src/pages/auth.vue            |  2 +-
 packages/client/src/pages/channel.vue         |  6 +--
 packages/client/src/pages/channels.vue        |  2 +-
 packages/client/src/pages/clip.vue            |  2 +-
 packages/client/src/pages/drive.vue           |  2 +-
 .../client/src/pages/explore.featured.vue     |  4 +-
 packages/client/src/pages/explore.users.vue   |  4 +-
 packages/client/src/pages/explore.vue         |  2 +-
 packages/client/src/pages/favorites.vue       |  4 +-
 packages/client/src/pages/gallery/index.vue   |  6 +--
 packages/client/src/pages/gallery/post.vue    |  6 +--
 packages/client/src/pages/instance-info.vue   | 10 ++---
 .../messaging/messaging-room.message.vue      |  2 +-
 .../src/pages/messaging/messaging-room.vue    |  2 +-
 packages/client/src/pages/miauth.vue          |  2 +-
 packages/client/src/pages/my-lists/index.vue  |  2 +-
 packages/client/src/pages/note.vue            |  8 ++--
 packages/client/src/pages/notifications.vue   |  4 +-
 .../page-editor/els/page-editor.el.image.vue  |  2 +-
 .../page-editor/els/page-editor.el.note.vue   |  4 +-
 packages/client/src/pages/page.vue            |  4 +-
 packages/client/src/pages/pages.vue           |  2 +-
 packages/client/src/pages/preview.vue         |  2 +-
 packages/client/src/pages/registry.keys.vue   |  2 +-
 packages/client/src/pages/registry.value.vue  |  2 +-
 packages/client/src/pages/reset-password.vue  |  2 +-
 packages/client/src/pages/search.vue          |  2 +-
 .../src/pages/settings/account-info.vue       |  2 +-
 .../client/src/pages/settings/accounts.vue    |  4 +-
 packages/client/src/pages/settings/api.vue    |  2 +-
 packages/client/src/pages/settings/drive.vue  |  4 +-
 .../client/src/pages/settings/general.vue     |  2 +-
 .../client/src/pages/settings/mute-block.vue  |  2 +-
 .../src/pages/settings/notifications.vue      |  2 +-
 .../src/pages/settings/plugin.install.vue     |  2 +-
 packages/client/src/pages/settings/plugin.vue |  2 +-
 .../client/src/pages/settings/reaction.vue    |  2 +-
 .../client/src/pages/settings/word-mute.vue   |  4 +-
 packages/client/src/pages/share.vue           |  2 +-
 packages/client/src/pages/tag.vue             |  2 +-
 packages/client/src/pages/timeline.vue        |  4 +-
 packages/client/src/pages/user-info.vue       |  8 ++--
 .../client/src/pages/user-list-timeline.vue   |  2 +-
 .../client/src/pages/user/follow-list.vue     |  2 +-
 packages/client/src/pages/user/gallery.vue    |  2 +-
 packages/client/src/pages/user/home.vue       |  8 ++--
 .../client/src/pages/user/index.activity.vue  |  2 +-
 .../client/src/pages/user/index.photos.vue    |  2 +-
 .../client/src/pages/user/index.timeline.vue  |  4 +-
 packages/client/src/pages/user/pages.vue      |  2 +-
 packages/client/src/pages/user/reactions.vue  |  4 +-
 .../client/src/pages/welcome.entrance.a.vue   | 10 ++---
 .../client/src/pages/welcome.entrance.b.vue   |  8 ++--
 .../client/src/pages/welcome.entrance.c.vue   |  8 ++--
 .../client/src/pages/welcome.timeline.vue     |  6 +--
 packages/client/src/scripts/autocomplete.ts   |  2 +-
 packages/client/src/scripts/get-note-menu.ts  |  2 +-
 packages/client/src/scripts/get-user-menu.ts  |  2 +-
 packages/client/src/scripts/please-login.ts   |  2 +-
 .../client/src/scripts/reaction-picker.ts     |  2 +-
 .../client/src/scripts/use-chart-tooltip.ts   |  2 +-
 packages/client/src/ui/_common_/common.vue    |  2 +-
 .../src/ui/_common_/navbar-for-mobile.vue     |  2 +-
 packages/client/src/ui/_common_/navbar.vue    |  2 +-
 .../src/ui/_common_/statusbar-federation.vue  |  2 +-
 .../client/src/ui/_common_/statusbar-rss.vue  |  2 +-
 .../src/ui/_common_/statusbar-user-list.vue   |  2 +-
 packages/client/src/ui/classic.header.vue     |  2 +-
 packages/client/src/ui/classic.sidebar.vue    |  2 +-
 packages/client/src/ui/classic.widgets.vue    |  2 +-
 .../client/src/ui/deck/antenna-column.vue     |  2 +-
 packages/client/src/ui/deck/direct-column.vue |  2 +-
 packages/client/src/ui/deck/list-column.vue   |  2 +-
 .../client/src/ui/deck/mentions-column.vue    |  2 +-
 .../src/ui/deck/notifications-column.vue      |  4 +-
 packages/client/src/ui/deck/tl-column.vue     |  2 +-
 .../client/src/ui/deck/widgets-column.vue     |  2 +-
 packages/client/src/ui/universal.widgets.vue  |  2 +-
 packages/client/src/ui/visitor/b.vue          |  4 +-
 packages/client/src/ui/visitor/header.vue     |  4 +-
 packages/client/src/ui/visitor/kanban.vue     |  4 +-
 packages/client/src/widgets/clock.vue         |  4 +-
 packages/client/src/widgets/digital-clock.vue |  2 +-
 packages/client/src/widgets/federation.vue    |  2 +-
 .../client/src/widgets/instance-cloud.vue     |  2 +-
 packages/client/src/widgets/notifications.vue |  4 +-
 packages/client/src/widgets/post-form.vue     |  2 +-
 packages/client/src/widgets/rss-ticker.vue    |  2 +-
 packages/client/src/widgets/timeline.vue      |  2 +-
 packages/client/src/widgets/trends.vue        |  2 +-
 243 files changed, 390 insertions(+), 386 deletions(-)
 rename packages/client/src/components/{abuse-report.vue => MkAbuseReport.vue} (98%)
 rename packages/client/src/components/{abuse-report-window.vue => MkAbuseReportWindow.vue} (100%)
 rename packages/client/src/components/{analog-clock.vue => MkAnalogClock.vue} (100%)
 rename packages/client/src/components/{autocomplete.vue => MkAutocomplete.vue} (100%)
 rename packages/client/src/components/{avatars.vue => MkAvatars.vue} (100%)
 rename packages/client/src/components/{captcha.vue => MkCaptcha.vue} (100%)
 rename packages/client/src/components/{channel-follow-button.vue => MkChannelFollowButton.vue} (100%)
 rename packages/client/src/components/{channel-preview.vue => MkChannelPreview.vue} (100%)
 rename packages/client/src/components/{chart.vue => MkChart.vue} (100%)
 rename packages/client/src/components/{chart-tooltip.vue => MkChartTooltip.vue} (100%)
 rename packages/client/src/components/{code-core.vue => MkCode.core.vue} (100%)
 rename packages/client/src/components/{code.vue => MkCode.vue} (73%)
 rename packages/client/src/components/{cropper-dialog.vue => MkCropperDialog.vue} (100%)
 rename packages/client/src/components/{cw-button.vue => MkCwButton.vue} (100%)
 rename packages/client/src/components/{date-separated-list.vue => MkDateSeparatedList.vue} (86%)
 rename packages/client/src/components/{dialog.vue => MkDialog.vue} (100%)
 rename packages/client/src/components/{digital-clock.vue => MkDigitalClock.vue} (100%)
 rename packages/client/src/components/{drive.file.vue => MkDrive.file.vue} (92%)
 rename packages/client/src/components/{drive.folder.vue => MkDrive.folder.vue} (93%)
 rename packages/client/src/components/{drive.nav-folder.vue => MkDrive.navFolder.vue} (100%)
 rename packages/client/src/components/{drive.vue => MkDrive.vue} (99%)
 rename packages/client/src/components/{drive-file-thumbnail.vue => MkDriveFileThumbnail.vue} (97%)
 rename packages/client/src/components/{drive-select-dialog.vue => MkDriveSelectDialog.vue} (95%)
 rename packages/client/src/components/{drive-window.vue => MkDriveWindow.vue} (88%)
 rename packages/client/src/components/{emoji-picker.section.vue => MkEmojiPicker.section.vue} (100%)
 rename packages/client/src/components/{emoji-picker.vue => MkEmojiPicker.vue} (99%)
 rename packages/client/src/components/{emoji-picker-dialog.vue => MkEmojiPickerDialog.vue} (96%)
 rename packages/client/src/components/{emoji-picker-window.vue => MkEmojiPickerWindow.vue} (97%)
 rename packages/client/src/components/{featured-photos.vue => MkFeaturedPhotos.vue} (100%)
 rename packages/client/src/components/{file-list-for-admin.vue => MkFileListForAdmin.vue} (97%)
 rename packages/client/src/components/{file-type-icon.vue => MkFileTypeIcon.vue} (100%)
 rename packages/client/src/components/{follow-button.vue => MkFollowButton.vue} (100%)
 rename packages/client/src/components/{forgot-password.vue => MkForgotPassword.vue} (100%)
 rename packages/client/src/components/{form-dialog.vue => MkFormDialog.vue} (100%)
 rename packages/client/src/components/{formula.vue => MkFormula.vue} (60%)
 rename packages/client/src/components/{formula-core.vue => MkFormulaCore.vue} (100%)
 rename packages/client/src/components/{gallery-post-preview.vue => MkGalleryPostPreview.vue} (94%)
 rename packages/client/src/components/{google.vue => MkGoogle.vue} (100%)
 rename packages/client/src/components/{image-viewer.vue => MkImageViewer.vue} (100%)
 rename packages/client/src/components/{img-with-blurhash.vue => MkImgWithBlurhash.vue} (100%)
 rename packages/client/src/components/{instance-card-mini.vue => MkInstanceCardMini.vue} (98%)
 rename packages/client/src/components/{instance-stats.vue => MkInstanceStats.vue} (99%)
 rename packages/client/src/components/{instance-ticker.vue => MkInstanceTicker.vue} (100%)
 rename packages/client/src/components/{key-value.vue => MkKeyValue.vue} (100%)
 rename packages/client/src/components/{launch-pad.vue => MkLaunchPad.vue} (100%)
 rename packages/client/src/components/{link.vue => MkLink.vue} (91%)
 rename packages/client/src/components/{marquee.vue => MkMarquee.vue} (100%)
 rename packages/client/src/components/{media-banner.vue => MkMediaBanner.vue} (100%)
 rename packages/client/src/components/{media-caption.vue => MkMediaCaption.vue} (100%)
 rename packages/client/src/components/{media-image.vue => MkMediaImage.vue} (97%)
 rename packages/client/src/components/{media-list.vue => MkMediaList.vue} (96%)
 rename packages/client/src/components/{media-video.vue => MkMediaVideo.vue} (100%)
 rename packages/client/src/components/{mention.vue => MkMention.vue} (100%)
 rename packages/client/src/components/{mini-chart.vue => MkMiniChart.vue} (100%)
 rename packages/client/src/components/{modal-page-window.vue => MkModalPageWindow.vue} (100%)
 rename packages/client/src/components/{note.vue => MkNote.vue} (96%)
 rename packages/client/src/components/{note-detailed.vue => MkNoteDetailed.vue} (96%)
 rename packages/client/src/components/{note-header.vue => MkNoteHeader.vue} (96%)
 rename packages/client/src/components/{note-preview.vue => MkNotePreview.vue} (100%)
 rename packages/client/src/components/{note-simple.vue => MkNoteSimple.vue} (87%)
 rename packages/client/src/components/{notes.vue => MkNotes.vue} (92%)
 rename packages/client/src/components/{notification.vue => MkNotification.vue} (98%)
 rename packages/client/src/components/{notification-setting-window.vue => MkNotificationSettingWindow.vue} (100%)
 rename packages/client/src/components/{notification-toast.vue => MkNotificationToast.vue} (95%)
 rename packages/client/src/components/{notifications.vue => MkNotifications.vue} (94%)
 rename packages/client/src/components/{number-diff.vue => MkNumberDiff.vue} (100%)
 rename packages/client/src/components/{object-view.value.vue => MkObjectView.value.vue} (100%)
 rename packages/client/src/components/{object-view.vue => MkObjectView.vue} (85%)
 rename packages/client/src/components/{page-preview.vue => MkPagePreview.vue} (100%)
 rename packages/client/src/components/{page-window.vue => MkPageWindow.vue} (98%)
 rename packages/client/src/components/{poll.vue => MkPoll.vue} (100%)
 rename packages/client/src/components/{poll-editor.vue => MkPollEditor.vue} (100%)
 rename packages/client/src/components/{post-form.vue => MkPostForm.vue} (98%)
 rename packages/client/src/components/{post-form-attaches.vue => MkPostFormAttaches.vue} (96%)
 rename packages/client/src/components/{post-form-dialog.vue => MkPostFormDialog.vue} (89%)
 rename packages/client/src/components/{reaction-icon.vue => MkReactionIcon.vue} (100%)
 rename packages/client/src/components/{reaction-tooltip.vue => MkReactionTooltip.vue} (93%)
 rename packages/client/src/components/{reactions-viewer.details.vue => MkReactionsViewer.details.vue} (96%)
 rename packages/client/src/components/{reactions-viewer.reaction.vue => MkReactionsViewer.reaction.vue} (95%)
 rename packages/client/src/components/{reactions-viewer.vue => MkReactionsViewer.vue} (91%)
 rename packages/client/src/components/{remote-caution.vue => MkRemoteCaution.vue} (100%)
 rename packages/client/src/components/{renote-button.vue => MkRenoteButton.vue} (97%)
 rename packages/client/src/components/{ripple.vue => MkRipple.vue} (100%)
 rename packages/client/src/components/{sample.vue => MkSample.vue} (100%)
 rename packages/client/src/components/{signin.vue => MkSignin.vue} (98%)
 rename packages/client/src/components/{signin-dialog.vue => MkSigninDialog.vue} (94%)
 rename packages/client/src/components/{signup.vue => MkSignup.vue} (99%)
 rename packages/client/src/components/{signup-dialog.vue => MkSignupDialog.vue} (94%)
 rename packages/client/src/components/{sparkle.vue => MkSparkle.vue} (100%)
 rename packages/client/src/components/{sub-note-content.vue => MkSubNoteContent.vue} (95%)
 rename packages/client/src/components/{tab.vue => MkTab.vue} (100%)
 rename packages/client/src/components/{tag-cloud.vue => MkTagCloud.vue} (100%)
 rename packages/client/src/components/{timeline.vue => MkTimeline.vue} (93%)
 rename packages/client/src/components/{toast.vue => MkToast.vue} (100%)
 rename packages/client/src/components/{token-generate-window.vue => MkTokenGenerateWindow.vue} (100%)
 rename packages/client/src/components/{updated.vue => MkUpdated.vue} (95%)
 rename packages/client/src/components/{url-preview.vue => MkUrlPreview.vue} (100%)
 rename packages/client/src/components/{url-preview-popup.vue => MkUrlPreviewPopup.vue} (88%)
 rename packages/client/src/components/{user-card-mini.vue => MkUserCardMini.vue} (97%)
 rename packages/client/src/components/{user-info.vue => MkUserInfo.vue} (97%)
 rename packages/client/src/components/{user-list.vue => MkUserList.vue} (94%)
 rename packages/client/src/components/{user-online-indicator.vue => MkUserOnlineIndicator.vue} (100%)
 rename packages/client/src/components/{user-preview.vue => MkUserPreview.vue} (96%)
 rename packages/client/src/components/{user-select-dialog.vue => MkUserSelectDialog.vue} (100%)
 rename packages/client/src/components/{users-tooltip.vue => MkUsersTooltip.vue} (100%)
 rename packages/client/src/components/{visibility.vue => MkVisibility.vue} (95%)
 rename packages/client/src/components/{visibility-picker.vue => MkVisibilityPicker.vue} (100%)
 rename packages/client/src/components/{waiting-dialog.vue => MkWaitingDialog.vue} (100%)
 rename packages/client/src/components/{widgets.vue => MkWidgets.vue} (100%)
 rename packages/client/src/components/global/{a.vue => MkA.vue} (100%)
 rename packages/client/src/components/global/{acct.vue => MkAcct.vue} (100%)
 rename packages/client/src/components/global/{ad.vue => MkAd.vue} (100%)
 rename packages/client/src/components/global/{avatar.vue => MkAvatar.vue} (98%)
 rename packages/client/src/components/global/{ellipsis.vue => MkEllipsis.vue} (100%)
 rename packages/client/src/components/global/{emoji.vue => MkEmoji.vue} (100%)
 rename packages/client/src/components/global/{error.vue => MkError.vue} (100%)
 rename packages/client/src/components/global/{loading.vue => MkLoading.vue} (100%)
 rename packages/client/src/components/global/{misskey-flavored-markdown.vue => MkMisskeyFlavoredMarkdown.vue} (100%)
 rename packages/client/src/components/global/{page-header.vue => MkPageHeader.vue} (100%)
 rename packages/client/src/components/global/{spacer.vue => MkSpacer.vue} (100%)
 rename packages/client/src/components/global/{sticky-container.vue => MkStickyContainer.vue} (100%)
 rename packages/client/src/components/global/{time.vue => MkTime.vue} (100%)
 rename packages/client/src/components/global/{url.vue => MkUrl.vue} (96%)
 rename packages/client/src/components/global/{user-name.vue => MkUserName.vue} (100%)
 rename packages/client/src/components/global/{router-view.vue => RouterView.vue} (100%)

diff --git a/packages/client/src/account.ts b/packages/client/src/account.ts
index 243aea68c..10257b841 100644
--- a/packages/client/src/account.ts
+++ b/packages/client/src/account.ts
@@ -146,7 +146,7 @@ export async function openAccountMenu(opts: {
 	onChoose?: (account: misskey.entities.UserDetailed) => void;
 }, ev: MouseEvent) {
 	function showSigninDialog() {
-		popup(defineAsyncComponent(() => import('@/components/signin-dialog.vue')), {}, {
+		popup(defineAsyncComponent(() => import('@/components/MkSigninDialog.vue')), {}, {
 			done: res => {
 				addAccount(res.id, res.i);
 				success();
@@ -155,7 +155,7 @@ export async function openAccountMenu(opts: {
 	}
 
 	function createAccount() {
-		popup(defineAsyncComponent(() => import('@/components/signup-dialog.vue')), {}, {
+		popup(defineAsyncComponent(() => import('@/components/MkSignupDialog.vue')), {}, {
 			done: res => {
 				addAccount(res.id, res.i);
 				switchAccountWithToken(res.i);
diff --git a/packages/client/src/components/abuse-report.vue b/packages/client/src/components/MkAbuseReport.vue
similarity index 98%
rename from packages/client/src/components/abuse-report.vue
rename to packages/client/src/components/MkAbuseReport.vue
index 8c25df110..42bd1af3f 100644
--- a/packages/client/src/components/abuse-report.vue
+++ b/packages/client/src/components/MkAbuseReport.vue
@@ -38,7 +38,7 @@
 <script lang="ts" setup>
 import MkButton from '@/components/ui/button.vue';
 import MkSwitch from '@/components/form/switch.vue';
-import MkKeyValue from '@/components/key-value.vue';
+import MkKeyValue from '@/components/MkKeyValue.vue';
 import { acct, userPage } from '@/filters/user';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
diff --git a/packages/client/src/components/abuse-report-window.vue b/packages/client/src/components/MkAbuseReportWindow.vue
similarity index 100%
rename from packages/client/src/components/abuse-report-window.vue
rename to packages/client/src/components/MkAbuseReportWindow.vue
diff --git a/packages/client/src/components/analog-clock.vue b/packages/client/src/components/MkAnalogClock.vue
similarity index 100%
rename from packages/client/src/components/analog-clock.vue
rename to packages/client/src/components/MkAnalogClock.vue
diff --git a/packages/client/src/components/autocomplete.vue b/packages/client/src/components/MkAutocomplete.vue
similarity index 100%
rename from packages/client/src/components/autocomplete.vue
rename to packages/client/src/components/MkAutocomplete.vue
diff --git a/packages/client/src/components/avatars.vue b/packages/client/src/components/MkAvatars.vue
similarity index 100%
rename from packages/client/src/components/avatars.vue
rename to packages/client/src/components/MkAvatars.vue
diff --git a/packages/client/src/components/captcha.vue b/packages/client/src/components/MkCaptcha.vue
similarity index 100%
rename from packages/client/src/components/captcha.vue
rename to packages/client/src/components/MkCaptcha.vue
diff --git a/packages/client/src/components/channel-follow-button.vue b/packages/client/src/components/MkChannelFollowButton.vue
similarity index 100%
rename from packages/client/src/components/channel-follow-button.vue
rename to packages/client/src/components/MkChannelFollowButton.vue
diff --git a/packages/client/src/components/channel-preview.vue b/packages/client/src/components/MkChannelPreview.vue
similarity index 100%
rename from packages/client/src/components/channel-preview.vue
rename to packages/client/src/components/MkChannelPreview.vue
diff --git a/packages/client/src/components/chart.vue b/packages/client/src/components/MkChart.vue
similarity index 100%
rename from packages/client/src/components/chart.vue
rename to packages/client/src/components/MkChart.vue
diff --git a/packages/client/src/components/chart-tooltip.vue b/packages/client/src/components/MkChartTooltip.vue
similarity index 100%
rename from packages/client/src/components/chart-tooltip.vue
rename to packages/client/src/components/MkChartTooltip.vue
diff --git a/packages/client/src/components/code-core.vue b/packages/client/src/components/MkCode.core.vue
similarity index 100%
rename from packages/client/src/components/code-core.vue
rename to packages/client/src/components/MkCode.core.vue
diff --git a/packages/client/src/components/code.vue b/packages/client/src/components/MkCode.vue
similarity index 73%
rename from packages/client/src/components/code.vue
rename to packages/client/src/components/MkCode.vue
index d6478fd2f..1640258d5 100644
--- a/packages/client/src/components/code.vue
+++ b/packages/client/src/components/MkCode.vue
@@ -11,5 +11,5 @@ defineProps<{
 	inline?: boolean;
 }>();
 
-const XCode = defineAsyncComponent(() => import('./code-core.vue'));
+const XCode = defineAsyncComponent(() => import('@/components/MkCode.core.vue'));
 </script>
diff --git a/packages/client/src/components/cropper-dialog.vue b/packages/client/src/components/MkCropperDialog.vue
similarity index 100%
rename from packages/client/src/components/cropper-dialog.vue
rename to packages/client/src/components/MkCropperDialog.vue
diff --git a/packages/client/src/components/cw-button.vue b/packages/client/src/components/MkCwButton.vue
similarity index 100%
rename from packages/client/src/components/cw-button.vue
rename to packages/client/src/components/MkCwButton.vue
diff --git a/packages/client/src/components/date-separated-list.vue b/packages/client/src/components/MkDateSeparatedList.vue
similarity index 86%
rename from packages/client/src/components/date-separated-list.vue
rename to packages/client/src/components/MkDateSeparatedList.vue
index 085ef871e..f63d9782b 100644
--- a/packages/client/src/components/date-separated-list.vue
+++ b/packages/client/src/components/MkDateSeparatedList.vue
@@ -1,6 +1,6 @@
 <script lang="ts">
 import { defineComponent, h, PropType, TransitionGroup } from 'vue';
-import MkAd from '@/components/global/ad.vue';
+import MkAd from '@/components/global/MkAd.vue';
 import { i18n } from '@/i18n';
 import { defaultStore } from '@/store';
 
@@ -13,22 +13,22 @@ export default defineComponent({
 		direction: {
 			type: String,
 			required: false,
-			default: 'down'
+			default: 'down',
 		},
 		reversed: {
 			type: Boolean,
 			required: false,
-			default: false
+			default: false,
 		},
 		noGap: {
 			type: Boolean,
 			required: false,
-			default: false
+			default: false,
 		},
 		ad: {
 			type: Boolean,
 			required: false,
-			default: false
+			default: false,
 		},
 	},
 
@@ -38,7 +38,7 @@ export default defineComponent({
 			const month = new Date(time).getMonth() + 1;
 			return i18n.t('monthAndDay', {
 				month: month.toString(),
-				day: date.toString()
+				day: date.toString(),
 			});
 		}
 
@@ -48,7 +48,7 @@ export default defineComponent({
 			if (!slots || !slots.default) return;
 
 			const el = slots.default({
-				item: item
+				item: item,
 			})[0];
 			if (el.key == null && item.id) el.key = item.id;
 
@@ -60,20 +60,20 @@ export default defineComponent({
 					class: 'separator',
 					key: item.id + ':separator',
 				}, h('p', {
-					class: 'date'
+					class: 'date',
 				}, [
 					h('span', [
 						h('i', {
 							class: 'fas fa-angle-up icon',
 						}),
-						getDateText(item.createdAt)
+						getDateText(item.createdAt),
 					]),
 					h('span', [
 						getDateText(props.items[i + 1].createdAt),
 						h('i', {
 							class: 'fas fa-angle-down icon',
-						})
-					])
+						}),
+					]),
 				]));
 
 				return [el, separator];
@@ -93,16 +93,16 @@ export default defineComponent({
 		return () => h(
 			defaultStore.state.animation ? TransitionGroup : 'div',
 			defaultStore.state.animation ? {
-					class: 'sqadhkmv' + (props.noGap ? ' noGap' : ''),
-					name: 'list',
-					tag: 'div',
-					'data-direction': props.direction,
-					'data-reversed': props.reversed ? 'true' : 'false',
-				} : {
-					class: 'sqadhkmv' + (props.noGap ? ' noGap' : ''),
-				},
+				class: 'sqadhkmv' + (props.noGap ? ' noGap' : ''),
+				name: 'list',
+				tag: 'div',
+				'data-direction': props.direction,
+				'data-reversed': props.reversed ? 'true' : 'false',
+			} : {
+				class: 'sqadhkmv' + (props.noGap ? ' noGap' : ''),
+			},
 			{ default: renderChildren });
-	}
+	},
 });
 </script>
 
diff --git a/packages/client/src/components/dialog.vue b/packages/client/src/components/MkDialog.vue
similarity index 100%
rename from packages/client/src/components/dialog.vue
rename to packages/client/src/components/MkDialog.vue
diff --git a/packages/client/src/components/digital-clock.vue b/packages/client/src/components/MkDigitalClock.vue
similarity index 100%
rename from packages/client/src/components/digital-clock.vue
rename to packages/client/src/components/MkDigitalClock.vue
diff --git a/packages/client/src/components/drive.file.vue b/packages/client/src/components/MkDrive.file.vue
similarity index 92%
rename from packages/client/src/components/drive.file.vue
rename to packages/client/src/components/MkDrive.file.vue
index aaf7ca3ca..22916d568 100644
--- a/packages/client/src/components/drive.file.vue
+++ b/packages/client/src/components/MkDrive.file.vue
@@ -1,5 +1,6 @@
 <template>
-<div class="ncvczrfv"
+<div
+	class="ncvczrfv"
 	:class="{ isSelected }"
 	draggable="true"
 	:title="title"
@@ -34,7 +35,7 @@
 import { computed, defineAsyncComponent, ref } from 'vue';
 import * as Misskey from 'misskey-js';
 import copyToClipboard from '@/scripts/copy-to-clipboard';
-import MkDriveFileThumbnail from './drive-file-thumbnail.vue';
+import MkDriveFileThumbnail from '@/components/MkDriveFileThumbnail.vue';
 import bytes from '@/filters/bytes';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
@@ -63,31 +64,31 @@ function getMenu() {
 	return [{
 		text: i18n.ts.rename,
 		icon: 'fas fa-i-cursor',
-		action: rename
+		action: rename,
 	}, {
 		text: props.file.isSensitive ? i18n.ts.unmarkAsSensitive : i18n.ts.markAsSensitive,
 		icon: props.file.isSensitive ? 'fas fa-eye' : 'fas fa-eye-slash',
-		action: toggleSensitive
+		action: toggleSensitive,
 	}, {
 		text: i18n.ts.describeFile,
 		icon: 'fas fa-i-cursor',
-		action: describe
+		action: describe,
 	}, null, {
 		text: i18n.ts.copyUrl,
 		icon: 'fas fa-link',
-		action: copyUrl
+		action: copyUrl,
 	}, {
 		type: 'a',
 		href: props.file.url,
 		target: '_blank',
 		text: i18n.ts.download,
 		icon: 'fas fa-download',
-		download: props.file.name
+		download: props.file.name,
 	}, null, {
 		text: i18n.ts.delete,
 		icon: 'fas fa-trash-alt',
 		danger: true,
-		action: deleteFile
+		action: deleteFile,
 	}];
 }
 
@@ -127,35 +128,35 @@ function rename() {
 		if (canceled) return;
 		os.api('drive/files/update', {
 			fileId: props.file.id,
-			name: name
+			name: name,
 		});
 	});
 }
 
 function describe() {
-	os.popup(defineAsyncComponent(() => import('@/components/media-caption.vue')), {
+	os.popup(defineAsyncComponent(() => import('@/components/MkMediaCaption.vue')), {
 		title: i18n.ts.describeFile,
 		input: {
 			placeholder: i18n.ts.inputNewDescription,
 			default: props.file.comment != null ? props.file.comment : '',
 		},
-		image: props.file
+		image: props.file,
 	}, {
 		done: result => {
 			if (!result || result.canceled) return;
 			let comment = result.result;
 			os.api('drive/files/update', {
 				fileId: props.file.id,
-				comment: comment.length === 0 ? null : comment
+				comment: comment.length === 0 ? null : comment,
 			});
-		}
+		},
 	}, 'closed');
 }
 
 function toggleSensitive() {
 	os.api('drive/files/update', {
 		fileId: props.file.id,
-		isSensitive: !props.file.isSensitive
+		isSensitive: !props.file.isSensitive,
 	});
 }
 
@@ -176,7 +177,7 @@ async function deleteFile() {
 
 	if (canceled) return;
 	os.api('drive/files/delete', {
-		fileId: props.file.id
+		fileId: props.file.id,
 	});
 }
 </script>
diff --git a/packages/client/src/components/drive.folder.vue b/packages/client/src/components/MkDrive.folder.vue
similarity index 93%
rename from packages/client/src/components/drive.folder.vue
rename to packages/client/src/components/MkDrive.folder.vue
index 3ccb5d621..e55fa4f0f 100644
--- a/packages/client/src/components/drive.folder.vue
+++ b/packages/client/src/components/MkDrive.folder.vue
@@ -1,5 +1,6 @@
 <template>
-<div class="rghtznwe"
+<div
+	class="rghtznwe"
 	:class="{ draghover }"
 	draggable="true"
 	:title="title"
@@ -123,7 +124,7 @@ function onDrop(ev: DragEvent) {
 		emit('removeFile', file.id);
 		os.api('drive/files/update', {
 			fileId: file.id,
-			folderId: props.folder.id
+			folderId: props.folder.id,
 		});
 	}
 	//#endregion
@@ -139,7 +140,7 @@ function onDrop(ev: DragEvent) {
 		emit('removeFolder', folder.id);
 		os.api('drive/folders/update', {
 			folderId: folder.id,
-			parentId: props.folder.id
+			parentId: props.folder.id,
 		}).then(() => {
 			// noop
 		}).catch(err => {
@@ -147,13 +148,13 @@ function onDrop(ev: DragEvent) {
 				case 'detected-circular-definition':
 					os.alert({
 						title: i18n.ts.unableToProcess,
-						text: i18n.ts.circularReferenceFolder
+						text: i18n.ts.circularReferenceFolder,
 					});
 					break;
 				default:
 					os.alert({
 						type: 'error',
-						text: i18n.ts.somethingHappened
+						text: i18n.ts.somethingHappened,
 					});
 			}
 		});
@@ -186,19 +187,19 @@ function rename() {
 	os.inputText({
 		title: i18n.ts.renameFolder,
 		placeholder: i18n.ts.inputNewFolderName,
-		default: props.folder.name
+		default: props.folder.name,
 	}).then(({ canceled, result: name }) => {
 		if (canceled) return;
 		os.api('drive/folders/update', {
 			folderId: props.folder.id,
-			name: name
+			name: name,
 		});
 	});
 }
 
 function deleteFolder() {
 	os.api('drive/folders/delete', {
-		folderId: props.folder.id
+		folderId: props.folder.id,
 	}).then(() => {
 		if (defaultStore.state.uploadFolder === props.folder.id) {
 			defaultStore.set('uploadFolder', null);
@@ -209,13 +210,13 @@ function deleteFolder() {
 				os.alert({
 					type: 'error',
 					title: i18n.ts.unableToDelete,
-					text: i18n.ts.hasChildFilesOrFolders
+					text: i18n.ts.hasChildFilesOrFolders,
 				});
 				break;
 			default:
 				os.alert({
 					type: 'error',
-					text: i18n.ts.unableToDelete
+					text: i18n.ts.unableToDelete,
 				});
 		}
 	});
@@ -230,11 +231,11 @@ function onContextmenu(ev: MouseEvent) {
 		text: i18n.ts.openInWindow,
 		icon: 'fas fa-window-restore',
 		action: () => {
-			os.popup(defineAsyncComponent(() => import('./drive-window.vue')), {
-				initialFolder: props.folder
+			os.popup(defineAsyncComponent(() => import('@/components/MkDriveWindow.vue')), {
+				initialFolder: props.folder,
 			}, {
 			}, 'closed');
-		}
+		},
 	}, null, {
 		text: i18n.ts.rename,
 		icon: 'fas fa-i-cursor',
diff --git a/packages/client/src/components/drive.nav-folder.vue b/packages/client/src/components/MkDrive.navFolder.vue
similarity index 100%
rename from packages/client/src/components/drive.nav-folder.vue
rename to packages/client/src/components/MkDrive.navFolder.vue
diff --git a/packages/client/src/components/drive.vue b/packages/client/src/components/MkDrive.vue
similarity index 99%
rename from packages/client/src/components/drive.vue
rename to packages/client/src/components/MkDrive.vue
index 9e2ef1b93..9f0016adc 100644
--- a/packages/client/src/components/drive.vue
+++ b/packages/client/src/components/MkDrive.vue
@@ -90,10 +90,10 @@
 <script lang="ts" setup>
 import { markRaw, nextTick, onActivated, onBeforeUnmount, onMounted, ref, watch } from 'vue';
 import * as Misskey from 'misskey-js';
-import XNavFolder from './drive.nav-folder.vue';
-import XFolder from './drive.folder.vue';
-import XFile from './drive.file.vue';
 import MkButton from './ui/button.vue';
+import XNavFolder from '@/components/MkDrive.navFolder.vue';
+import XFolder from '@/components/MkDrive.folder.vue';
+import XFile from '@/components/MkDrive.file.vue';
 import * as os from '@/os';
 import { stream } from '@/stream';
 import { defaultStore } from '@/store';
diff --git a/packages/client/src/components/drive-file-thumbnail.vue b/packages/client/src/components/MkDriveFileThumbnail.vue
similarity index 97%
rename from packages/client/src/components/drive-file-thumbnail.vue
rename to packages/client/src/components/MkDriveFileThumbnail.vue
index b346585ce..de65d2f25 100644
--- a/packages/client/src/components/drive-file-thumbnail.vue
+++ b/packages/client/src/components/MkDriveFileThumbnail.vue
@@ -17,7 +17,7 @@
 <script lang="ts" setup>
 import { computed } from 'vue';
 import * as Misskey from 'misskey-js';
-import ImgWithBlurhash from '@/components/img-with-blurhash.vue';
+import ImgWithBlurhash from '@/components/MkImgWithBlurhash.vue';
 
 const props = defineProps<{
 	file: Misskey.entities.DriveFile;
diff --git a/packages/client/src/components/drive-select-dialog.vue b/packages/client/src/components/MkDriveSelectDialog.vue
similarity index 95%
rename from packages/client/src/components/drive-select-dialog.vue
rename to packages/client/src/components/MkDriveSelectDialog.vue
index 03974559d..95a9a6fdb 100644
--- a/packages/client/src/components/drive-select-dialog.vue
+++ b/packages/client/src/components/MkDriveSelectDialog.vue
@@ -1,5 +1,6 @@
 <template>
-<XModalWindow ref="dialog"
+<XModalWindow
+	ref="dialog"
 	:width="800"
 	:height="500"
 	:with-ok-button="true"
@@ -20,7 +21,7 @@
 <script lang="ts" setup>
 import { ref } from 'vue';
 import * as Misskey from 'misskey-js';
-import XDrive from './drive.vue';
+import XDrive from '@/components/MkDrive.vue';
 import XModalWindow from '@/components/ui/modal-window.vue';
 import number from '@/filters/number';
 import { i18n } from '@/i18n';
diff --git a/packages/client/src/components/drive-window.vue b/packages/client/src/components/MkDriveWindow.vue
similarity index 88%
rename from packages/client/src/components/drive-window.vue
rename to packages/client/src/components/MkDriveWindow.vue
index 51ea2b501..113aabb9f 100644
--- a/packages/client/src/components/drive-window.vue
+++ b/packages/client/src/components/MkDriveWindow.vue
@@ -1,5 +1,6 @@
 <template>
-<XWindow ref="window"
+<XWindow
+	ref="window"
 	:initial-width="800"
 	:initial-height="500"
 	:can-resize="true"
@@ -15,7 +16,7 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import * as Misskey from 'misskey-js';
-import XDrive from './drive.vue';
+import XDrive from '@/components/MkDrive.vue';
 import XWindow from '@/components/ui/window.vue';
 import { i18n } from '@/i18n';
 
diff --git a/packages/client/src/components/emoji-picker.section.vue b/packages/client/src/components/MkEmojiPicker.section.vue
similarity index 100%
rename from packages/client/src/components/emoji-picker.section.vue
rename to packages/client/src/components/MkEmojiPicker.section.vue
diff --git a/packages/client/src/components/emoji-picker.vue b/packages/client/src/components/MkEmojiPicker.vue
similarity index 99%
rename from packages/client/src/components/emoji-picker.vue
rename to packages/client/src/components/MkEmojiPicker.vue
index 4a46e0ecf..3de0afbf5 100644
--- a/packages/client/src/components/emoji-picker.vue
+++ b/packages/client/src/components/MkEmojiPicker.vue
@@ -80,10 +80,10 @@
 <script lang="ts" setup>
 import { ref, computed, watch, onMounted } from 'vue';
 import * as Misskey from 'misskey-js';
-import XSection from './emoji-picker.section.vue';
+import XSection from '@/components/MkEmojiPicker.section.vue';
 import { emojilist, UnicodeEmojiDef, unicodeEmojiCategories as categories } from '@/scripts/emojilist';
 import { getStaticImageUrl } from '@/scripts/get-static-image-url';
-import Ripple from '@/components/ripple.vue';
+import Ripple from '@/components/MkRipple.vue';
 import * as os from '@/os';
 import { isTouchUsing } from '@/scripts/touch';
 import { deviceKind } from '@/scripts/device-kind';
diff --git a/packages/client/src/components/emoji-picker-dialog.vue b/packages/client/src/components/MkEmojiPickerDialog.vue
similarity index 96%
rename from packages/client/src/components/emoji-picker-dialog.vue
rename to packages/client/src/components/MkEmojiPickerDialog.vue
index 2c0b2e9a8..94e66b971 100644
--- a/packages/client/src/components/emoji-picker-dialog.vue
+++ b/packages/client/src/components/MkEmojiPickerDialog.vue
@@ -28,7 +28,7 @@
 <script lang="ts" setup>
 import { ref } from 'vue';
 import MkModal from '@/components/ui/modal.vue';
-import MkEmojiPicker from '@/components/emoji-picker.vue';
+import MkEmojiPicker from '@/components/MkEmojiPicker.vue';
 import { defaultStore } from '@/store';
 
 withDefaults(defineProps<{
diff --git a/packages/client/src/components/emoji-picker-window.vue b/packages/client/src/components/MkEmojiPickerWindow.vue
similarity index 97%
rename from packages/client/src/components/emoji-picker-window.vue
rename to packages/client/src/components/MkEmojiPickerWindow.vue
index 610690d70..a1a2fd932 100644
--- a/packages/client/src/components/emoji-picker-window.vue
+++ b/packages/client/src/components/MkEmojiPickerWindow.vue
@@ -14,7 +14,7 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import MkWindow from '@/components/ui/window.vue';
-import MkEmojiPicker from '@/components/emoji-picker.vue';
+import MkEmojiPicker from '@/components/MkEmojiPicker.vue';
 
 withDefaults(defineProps<{
 	src?: HTMLElement;
diff --git a/packages/client/src/components/featured-photos.vue b/packages/client/src/components/MkFeaturedPhotos.vue
similarity index 100%
rename from packages/client/src/components/featured-photos.vue
rename to packages/client/src/components/MkFeaturedPhotos.vue
diff --git a/packages/client/src/components/file-list-for-admin.vue b/packages/client/src/components/MkFileListForAdmin.vue
similarity index 97%
rename from packages/client/src/components/file-list-for-admin.vue
rename to packages/client/src/components/MkFileListForAdmin.vue
index 489c017a9..e03b8b94d 100644
--- a/packages/client/src/components/file-list-for-admin.vue
+++ b/packages/client/src/components/MkFileListForAdmin.vue
@@ -36,7 +36,7 @@ import { computed } from 'vue';
 import * as Acct from 'misskey-js/built/acct';
 import MkSwitch from '@/components/ui/switch.vue';
 import MkPagination from '@/components/ui/pagination.vue';
-import MkDriveFileThumbnail from '@/components/drive-file-thumbnail.vue';
+import MkDriveFileThumbnail from '@/components/MkDriveFileThumbnail.vue';
 import bytes from '@/filters/bytes';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
diff --git a/packages/client/src/components/file-type-icon.vue b/packages/client/src/components/MkFileTypeIcon.vue
similarity index 100%
rename from packages/client/src/components/file-type-icon.vue
rename to packages/client/src/components/MkFileTypeIcon.vue
diff --git a/packages/client/src/components/follow-button.vue b/packages/client/src/components/MkFollowButton.vue
similarity index 100%
rename from packages/client/src/components/follow-button.vue
rename to packages/client/src/components/MkFollowButton.vue
diff --git a/packages/client/src/components/forgot-password.vue b/packages/client/src/components/MkForgotPassword.vue
similarity index 100%
rename from packages/client/src/components/forgot-password.vue
rename to packages/client/src/components/MkForgotPassword.vue
diff --git a/packages/client/src/components/form-dialog.vue b/packages/client/src/components/MkFormDialog.vue
similarity index 100%
rename from packages/client/src/components/form-dialog.vue
rename to packages/client/src/components/MkFormDialog.vue
diff --git a/packages/client/src/components/formula.vue b/packages/client/src/components/MkFormula.vue
similarity index 60%
rename from packages/client/src/components/formula.vue
rename to packages/client/src/components/MkFormula.vue
index 431b4e6c3..65a2fee93 100644
--- a/packages/client/src/components/formula.vue
+++ b/packages/client/src/components/MkFormula.vue
@@ -1,5 +1,5 @@
 <template>
-<XFormula :formula="formula" :block="block" />
+<XFormula :formula="formula" :block="block"/>
 </template>
 
 <script lang="ts">
@@ -8,17 +8,17 @@ import * as os from '@/os';
 
 export default defineComponent({
 	components: {
-		XFormula: defineAsyncComponent(() => import('./formula-core.vue'))
+		XFormula: defineAsyncComponent(() => import('@/components/MkFormulaCore.vue')),
 	},
 	props: {
 		formula: {
 			type: String,
-			required: true
+			required: true,
 		},
 		block: {
 			type: Boolean,
-			required: true
-		}
-	}
+			required: true,
+		},
+	},
 });
 </script>
diff --git a/packages/client/src/components/formula-core.vue b/packages/client/src/components/MkFormulaCore.vue
similarity index 100%
rename from packages/client/src/components/formula-core.vue
rename to packages/client/src/components/MkFormulaCore.vue
diff --git a/packages/client/src/components/gallery-post-preview.vue b/packages/client/src/components/MkGalleryPostPreview.vue
similarity index 94%
rename from packages/client/src/components/gallery-post-preview.vue
rename to packages/client/src/components/MkGalleryPostPreview.vue
index 824590297..cef9b2a39 100644
--- a/packages/client/src/components/gallery-post-preview.vue
+++ b/packages/client/src/components/MkGalleryPostPreview.vue
@@ -17,22 +17,22 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
 import { userName } from '@/filters/user';
-import ImgWithBlurhash from '@/components/img-with-blurhash.vue';
+import ImgWithBlurhash from '@/components/MkImgWithBlurhash.vue';
 import * as os from '@/os';
 
 export default defineComponent({
 	components: {
-		ImgWithBlurhash
+		ImgWithBlurhash,
 	},
 	props: {
 		post: {
 			type: Object,
-			required: true
+			required: true,
 		},
 	},
 	methods: {
-		userName
-	}
+		userName,
+	},
 });
 </script>
 
diff --git a/packages/client/src/components/google.vue b/packages/client/src/components/MkGoogle.vue
similarity index 100%
rename from packages/client/src/components/google.vue
rename to packages/client/src/components/MkGoogle.vue
diff --git a/packages/client/src/components/image-viewer.vue b/packages/client/src/components/MkImageViewer.vue
similarity index 100%
rename from packages/client/src/components/image-viewer.vue
rename to packages/client/src/components/MkImageViewer.vue
diff --git a/packages/client/src/components/img-with-blurhash.vue b/packages/client/src/components/MkImgWithBlurhash.vue
similarity index 100%
rename from packages/client/src/components/img-with-blurhash.vue
rename to packages/client/src/components/MkImgWithBlurhash.vue
diff --git a/packages/client/src/components/instance-card-mini.vue b/packages/client/src/components/MkInstanceCardMini.vue
similarity index 98%
rename from packages/client/src/components/instance-card-mini.vue
rename to packages/client/src/components/MkInstanceCardMini.vue
index 88621e72c..f6e2f4eaa 100644
--- a/packages/client/src/components/instance-card-mini.vue
+++ b/packages/client/src/components/MkInstanceCardMini.vue
@@ -11,7 +11,7 @@
 
 <script lang="ts" setup>
 import * as misskey from 'misskey-js';
-import MkMiniChart from '@/components/mini-chart.vue';
+import MkMiniChart from '@/components/MkMiniChart.vue';
 import * as os from '@/os';
 
 const props = defineProps<{
diff --git a/packages/client/src/components/instance-stats.vue b/packages/client/src/components/MkInstanceStats.vue
similarity index 99%
rename from packages/client/src/components/instance-stats.vue
rename to packages/client/src/components/MkInstanceStats.vue
index 65465dd9a..0437e05fa 100644
--- a/packages/client/src/components/instance-stats.vue
+++ b/packages/client/src/components/MkInstanceStats.vue
@@ -68,7 +68,7 @@ import {
 	DoughnutController,
 } from 'chart.js';
 import MkSelect from '@/components/form/select.vue';
-import MkChart from '@/components/chart.vue';
+import MkChart from '@/components/MkChart.vue';
 import { useChartTooltip } from '@/scripts/use-chart-tooltip';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
diff --git a/packages/client/src/components/instance-ticker.vue b/packages/client/src/components/MkInstanceTicker.vue
similarity index 100%
rename from packages/client/src/components/instance-ticker.vue
rename to packages/client/src/components/MkInstanceTicker.vue
diff --git a/packages/client/src/components/key-value.vue b/packages/client/src/components/MkKeyValue.vue
similarity index 100%
rename from packages/client/src/components/key-value.vue
rename to packages/client/src/components/MkKeyValue.vue
diff --git a/packages/client/src/components/launch-pad.vue b/packages/client/src/components/MkLaunchPad.vue
similarity index 100%
rename from packages/client/src/components/launch-pad.vue
rename to packages/client/src/components/MkLaunchPad.vue
diff --git a/packages/client/src/components/link.vue b/packages/client/src/components/MkLink.vue
similarity index 91%
rename from packages/client/src/components/link.vue
rename to packages/client/src/components/MkLink.vue
index 846a9a3a7..649523abc 100644
--- a/packages/client/src/components/link.vue
+++ b/packages/client/src/components/MkLink.vue
@@ -26,7 +26,7 @@ const target = self ? null : '_blank';
 const el = $ref();
 
 useTooltip($$(el), (showing) => {
-	os.popup(defineAsyncComponent(() => import('@/components/url-preview-popup.vue')), {
+	os.popup(defineAsyncComponent(() => import('@/components/MkUrlPreviewPopup.vue')), {
 		showing,
 		url: props.url,
 		source: el,
diff --git a/packages/client/src/components/marquee.vue b/packages/client/src/components/MkMarquee.vue
similarity index 100%
rename from packages/client/src/components/marquee.vue
rename to packages/client/src/components/MkMarquee.vue
diff --git a/packages/client/src/components/media-banner.vue b/packages/client/src/components/MkMediaBanner.vue
similarity index 100%
rename from packages/client/src/components/media-banner.vue
rename to packages/client/src/components/MkMediaBanner.vue
diff --git a/packages/client/src/components/media-caption.vue b/packages/client/src/components/MkMediaCaption.vue
similarity index 100%
rename from packages/client/src/components/media-caption.vue
rename to packages/client/src/components/MkMediaCaption.vue
diff --git a/packages/client/src/components/media-image.vue b/packages/client/src/components/MkMediaImage.vue
similarity index 97%
rename from packages/client/src/components/media-image.vue
rename to packages/client/src/components/MkMediaImage.vue
index 9d417bd99..92f1bd2db 100644
--- a/packages/client/src/components/media-image.vue
+++ b/packages/client/src/components/MkMediaImage.vue
@@ -24,7 +24,7 @@
 import { watch } from 'vue';
 import * as misskey from 'misskey-js';
 import { getStaticImageUrl } from '@/scripts/get-static-image-url';
-import ImgWithBlurhash from '@/components/img-with-blurhash.vue';
+import ImgWithBlurhash from '@/components/MkImgWithBlurhash.vue';
 import { defaultStore } from '@/store';
 
 const props = defineProps<{
diff --git a/packages/client/src/components/media-list.vue b/packages/client/src/components/MkMediaList.vue
similarity index 96%
rename from packages/client/src/components/media-list.vue
rename to packages/client/src/components/MkMediaList.vue
index 7e330575e..c6f861218 100644
--- a/packages/client/src/components/media-list.vue
+++ b/packages/client/src/components/MkMediaList.vue
@@ -18,9 +18,9 @@ import * as misskey from 'misskey-js';
 import PhotoSwipeLightbox from 'photoswipe/lightbox';
 import PhotoSwipe from 'photoswipe';
 import 'photoswipe/style.css';
-import XBanner from './media-banner.vue';
-import XImage from './media-image.vue';
-import XVideo from './media-video.vue';
+import XBanner from '@/components/MkMediaBanner.vue';
+import XImage from '@/components/MkMediaImage.vue';
+import XVideo from '@/components/MkMediaVideo.vue';
 import * as os from '@/os';
 import { FILE_TYPE_BROWSERSAFE } from '@/const';
 import { defaultStore } from '@/store';
diff --git a/packages/client/src/components/media-video.vue b/packages/client/src/components/MkMediaVideo.vue
similarity index 100%
rename from packages/client/src/components/media-video.vue
rename to packages/client/src/components/MkMediaVideo.vue
diff --git a/packages/client/src/components/mention.vue b/packages/client/src/components/MkMention.vue
similarity index 100%
rename from packages/client/src/components/mention.vue
rename to packages/client/src/components/MkMention.vue
diff --git a/packages/client/src/components/mini-chart.vue b/packages/client/src/components/MkMiniChart.vue
similarity index 100%
rename from packages/client/src/components/mini-chart.vue
rename to packages/client/src/components/MkMiniChart.vue
diff --git a/packages/client/src/components/modal-page-window.vue b/packages/client/src/components/MkModalPageWindow.vue
similarity index 100%
rename from packages/client/src/components/modal-page-window.vue
rename to packages/client/src/components/MkModalPageWindow.vue
diff --git a/packages/client/src/components/note.vue b/packages/client/src/components/MkNote.vue
similarity index 96%
rename from packages/client/src/components/note.vue
rename to packages/client/src/components/MkNote.vue
index 0279f014c..efe786ba4 100644
--- a/packages/client/src/components/note.vue
+++ b/packages/client/src/components/MkNote.vue
@@ -106,17 +106,17 @@
 import { computed, inject, onMounted, onUnmounted, reactive, ref, Ref } from 'vue';
 import * as mfm from 'mfm-js';
 import * as misskey from 'misskey-js';
-import MkNoteSub from './MkNoteSub.vue';
-import XNoteHeader from './note-header.vue';
-import XNoteSimple from './note-simple.vue';
-import XReactionsViewer from './reactions-viewer.vue';
-import XMediaList from './media-list.vue';
-import XCwButton from './cw-button.vue';
-import XPoll from './poll.vue';
-import XRenoteButton from './renote-button.vue';
-import MkUrlPreview from '@/components/url-preview.vue';
-import MkInstanceTicker from '@/components/instance-ticker.vue';
-import MkVisibility from '@/components/visibility.vue';
+import MkNoteSub from '@/components/MkNoteSub.vue';
+import XNoteHeader from '@/components/MkNoteHeader.vue';
+import XNoteSimple from '@/components/MkNoteSimple.vue';
+import XReactionsViewer from '@/components/MkReactionsViewer.vue';
+import XMediaList from '@/components/MkMediaList.vue';
+import XCwButton from '@/components/MkCwButton.vue';
+import XPoll from '@/components/MkPoll.vue';
+import XRenoteButton from '@/components/MkRenoteButton.vue';
+import MkUrlPreview from '@/components/MkUrlPreview.vue';
+import MkInstanceTicker from '@/components/MkInstanceTicker.vue';
+import MkVisibility from '@/components/MkVisibility.vue';
 import { pleaseLogin } from '@/scripts/please-login';
 import { focusPrev, focusNext } from '@/scripts/focus';
 import { checkWordMute } from '@/scripts/check-word-mute';
diff --git a/packages/client/src/components/note-detailed.vue b/packages/client/src/components/MkNoteDetailed.vue
similarity index 96%
rename from packages/client/src/components/note-detailed.vue
rename to packages/client/src/components/MkNoteDetailed.vue
index 1e0625b6c..0bf8f330b 100644
--- a/packages/client/src/components/note-detailed.vue
+++ b/packages/client/src/components/MkNoteDetailed.vue
@@ -117,16 +117,16 @@
 import { computed, inject, onMounted, onUnmounted, reactive, ref } from 'vue';
 import * as mfm from 'mfm-js';
 import * as misskey from 'misskey-js';
-import MkNoteSub from './MkNoteSub.vue';
-import XNoteSimple from './note-simple.vue';
-import XReactionsViewer from './reactions-viewer.vue';
-import XMediaList from './media-list.vue';
-import XCwButton from './cw-button.vue';
-import XPoll from './poll.vue';
-import XRenoteButton from './renote-button.vue';
-import MkUrlPreview from '@/components/url-preview.vue';
-import MkInstanceTicker from '@/components/instance-ticker.vue';
-import MkVisibility from '@/components/visibility.vue';
+import MkNoteSub from '@/components/MkNoteSub.vue';
+import XNoteSimple from '@/components/MkNoteSimple.vue';
+import XReactionsViewer from '@/components/MkReactionsViewer.vue';
+import XMediaList from '@/components/MkMediaList.vue';
+import XCwButton from '@/components/MkCwButton.vue';
+import XPoll from '@/components/MkPoll.vue';
+import XRenoteButton from '@/components/MkRenoteButton.vue';
+import MkUrlPreview from '@/components/MkUrlPreview.vue';
+import MkInstanceTicker from '@/components/MkInstanceTicker.vue';
+import MkVisibility from '@/components/MkVisibility.vue';
 import { pleaseLogin } from '@/scripts/please-login';
 import { checkWordMute } from '@/scripts/check-word-mute';
 import { userPage } from '@/filters/user';
diff --git a/packages/client/src/components/note-header.vue b/packages/client/src/components/MkNoteHeader.vue
similarity index 96%
rename from packages/client/src/components/note-header.vue
rename to packages/client/src/components/MkNoteHeader.vue
index 0b0549856..333c3ddbd 100644
--- a/packages/client/src/components/note-header.vue
+++ b/packages/client/src/components/MkNoteHeader.vue
@@ -17,7 +17,7 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import * as misskey from 'misskey-js';
-import MkVisibility from '@/components/visibility.vue';
+import MkVisibility from '@/components/MkVisibility.vue';
 import { notePage } from '@/filters/note';
 import { userPage } from '@/filters/user';
 
diff --git a/packages/client/src/components/note-preview.vue b/packages/client/src/components/MkNotePreview.vue
similarity index 100%
rename from packages/client/src/components/note-preview.vue
rename to packages/client/src/components/MkNotePreview.vue
diff --git a/packages/client/src/components/note-simple.vue b/packages/client/src/components/MkNoteSimple.vue
similarity index 87%
rename from packages/client/src/components/note-simple.vue
rename to packages/client/src/components/MkNoteSimple.vue
index b813b9a2b..1bbbe0e1a 100644
--- a/packages/client/src/components/note-simple.vue
+++ b/packages/client/src/components/MkNoteSimple.vue
@@ -9,7 +9,7 @@
 				<XCwButton v-model="showContent" :note="note"/>
 			</p>
 			<div v-show="note.cw == null || showContent" class="content">
-				<MkNoteSubNoteContent class="text" :note="note"/>
+				<MkSubNoteContent class="text" :note="note"/>
 			</div>
 		</div>
 	</div>
@@ -19,9 +19,9 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import * as misskey from 'misskey-js';
-import XNoteHeader from './note-header.vue';
-import MkNoteSubNoteContent from './sub-note-content.vue';
-import XCwButton from './cw-button.vue';
+import XNoteHeader from '@/components/MkNoteHeader.vue';
+import MkSubNoteContent from '@/components/MkSubNoteContent.vue';
+import XCwButton from '@/components/MkCwButton.vue';
 
 const props = defineProps<{
 	note: misskey.entities.Note;
diff --git a/packages/client/src/components/MkNoteSub.vue b/packages/client/src/components/MkNoteSub.vue
index 9ae773bfb..a69336f8a 100644
--- a/packages/client/src/components/MkNoteSub.vue
+++ b/packages/client/src/components/MkNoteSub.vue
@@ -10,7 +10,7 @@
 					<XCwButton v-model="showContent" :note="note"/>
 				</p>
 				<div v-show="note.cw == null || showContent" class="content">
-					<MkNoteSubNoteContent class="text" :note="note"/>
+					<MkSubNoteContent class="text" :note="note"/>
 				</div>
 			</div>
 		</div>
@@ -27,9 +27,9 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import * as misskey from 'misskey-js';
-import XNoteHeader from './note-header.vue';
-import MkNoteSubNoteContent from './sub-note-content.vue';
-import XCwButton from './cw-button.vue';
+import XNoteHeader from '@/components/MkNoteHeader.vue';
+import MkSubNoteContent from '@/components/MkSubNoteContent.vue';
+import XCwButton from '@/components/MkCwButton.vue';
 import { notePage } from '@/filters/note';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
diff --git a/packages/client/src/components/notes.vue b/packages/client/src/components/MkNotes.vue
similarity index 92%
rename from packages/client/src/components/notes.vue
rename to packages/client/src/components/MkNotes.vue
index e351a76eb..67e894a09 100644
--- a/packages/client/src/components/notes.vue
+++ b/packages/client/src/components/MkNotes.vue
@@ -19,8 +19,8 @@
 
 <script lang="ts" setup>
 import { ref } from 'vue';
-import XNote from '@/components/note.vue';
-import XList from '@/components/date-separated-list.vue';
+import XNote from '@/components/MkNote.vue';
+import XList from '@/components/MkDateSeparatedList.vue';
 import MkPagination, { Paging } from '@/components/ui/pagination.vue';
 import { i18n } from '@/i18n';
 
diff --git a/packages/client/src/components/notification.vue b/packages/client/src/components/MkNotification.vue
similarity index 98%
rename from packages/client/src/components/notification.vue
rename to packages/client/src/components/MkNotification.vue
index 9589970a4..c00e9fbf4 100644
--- a/packages/client/src/components/notification.vue
+++ b/packages/client/src/components/MkNotification.vue
@@ -75,9 +75,9 @@
 <script lang="ts" setup>
 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';
-import XReactionTooltip from './reaction-tooltip.vue';
+import XReactionIcon from '@/components/MkReactionIcon.vue';
+import MkFollowButton from '@/components/MkFollowButton.vue';
+import XReactionTooltip from '@/components/MkReactionTooltip.vue';
 import { getNoteSummary } from '@/scripts/get-note-summary';
 import { notePage } from '@/filters/note';
 import { userPage } from '@/filters/user';
diff --git a/packages/client/src/components/notification-setting-window.vue b/packages/client/src/components/MkNotificationSettingWindow.vue
similarity index 100%
rename from packages/client/src/components/notification-setting-window.vue
rename to packages/client/src/components/MkNotificationSettingWindow.vue
diff --git a/packages/client/src/components/notification-toast.vue b/packages/client/src/components/MkNotificationToast.vue
similarity index 95%
rename from packages/client/src/components/notification-toast.vue
rename to packages/client/src/components/MkNotificationToast.vue
index b808647bb..398f64d54 100644
--- a/packages/client/src/components/notification-toast.vue
+++ b/packages/client/src/components/MkNotificationToast.vue
@@ -8,7 +8,7 @@
 
 <script lang="ts" setup>
 import { onMounted } from 'vue';
-import XNotification from './notification.vue';
+import XNotification from '@/components/MkNotification.vue';
 import * as os from '@/os';
 
 defineProps<{
diff --git a/packages/client/src/components/notifications.vue b/packages/client/src/components/MkNotifications.vue
similarity index 94%
rename from packages/client/src/components/notifications.vue
rename to packages/client/src/components/MkNotifications.vue
index baac2fdca..1ee091a22 100644
--- a/packages/client/src/components/notifications.vue
+++ b/packages/client/src/components/MkNotifications.vue
@@ -20,9 +20,9 @@
 import { defineComponent, markRaw, onUnmounted, onMounted, computed, ref } from 'vue';
 import { notificationTypes } from 'misskey-js';
 import MkPagination, { Paging } from '@/components/ui/pagination.vue';
-import XNotification from '@/components/notification.vue';
-import XList from '@/components/date-separated-list.vue';
-import XNote from '@/components/note.vue';
+import XNotification from '@/components/MkNotification.vue';
+import XList from '@/components/MkDateSeparatedList.vue';
+import XNote from '@/components/MkNote.vue';
 import * as os from '@/os';
 import { stream } from '@/stream';
 import { $i } from '@/account';
diff --git a/packages/client/src/components/number-diff.vue b/packages/client/src/components/MkNumberDiff.vue
similarity index 100%
rename from packages/client/src/components/number-diff.vue
rename to packages/client/src/components/MkNumberDiff.vue
diff --git a/packages/client/src/components/object-view.value.vue b/packages/client/src/components/MkObjectView.value.vue
similarity index 100%
rename from packages/client/src/components/object-view.value.vue
rename to packages/client/src/components/MkObjectView.value.vue
diff --git a/packages/client/src/components/object-view.vue b/packages/client/src/components/MkObjectView.vue
similarity index 85%
rename from packages/client/src/components/object-view.vue
rename to packages/client/src/components/MkObjectView.vue
index db66049fc..55578a37f 100644
--- a/packages/client/src/components/object-view.vue
+++ b/packages/client/src/components/MkObjectView.vue
@@ -6,7 +6,7 @@
 
 <script lang="ts" setup>
 import { } from 'vue';
-import XValue from './object-view.value.vue';
+import XValue from './MkObjectView.value.vue';
 
 const props = defineProps<{
 	value: Record<string, unknown>;
diff --git a/packages/client/src/components/page-preview.vue b/packages/client/src/components/MkPagePreview.vue
similarity index 100%
rename from packages/client/src/components/page-preview.vue
rename to packages/client/src/components/MkPagePreview.vue
diff --git a/packages/client/src/components/page-window.vue b/packages/client/src/components/MkPageWindow.vue
similarity index 98%
rename from packages/client/src/components/page-window.vue
rename to packages/client/src/components/MkPageWindow.vue
index 43d75b0cf..76eb77825 100644
--- a/packages/client/src/components/page-window.vue
+++ b/packages/client/src/components/MkPageWindow.vue
@@ -25,7 +25,7 @@
 
 <script lang="ts" setup>
 import { ComputedRef, inject, provide } from 'vue';
-import RouterView from './global/router-view.vue';
+import RouterView from '@/components/global/RouterView.vue';
 import XWindow from '@/components/ui/window.vue';
 import { popout as _popout } from '@/scripts/popout';
 import copyToClipboard from '@/scripts/copy-to-clipboard';
diff --git a/packages/client/src/components/poll.vue b/packages/client/src/components/MkPoll.vue
similarity index 100%
rename from packages/client/src/components/poll.vue
rename to packages/client/src/components/MkPoll.vue
diff --git a/packages/client/src/components/poll-editor.vue b/packages/client/src/components/MkPollEditor.vue
similarity index 100%
rename from packages/client/src/components/poll-editor.vue
rename to packages/client/src/components/MkPollEditor.vue
diff --git a/packages/client/src/components/post-form.vue b/packages/client/src/components/MkPostForm.vue
similarity index 98%
rename from packages/client/src/components/post-form.vue
rename to packages/client/src/components/MkPostForm.vue
index 6dfb2edcb..a499a62dd 100644
--- a/packages/client/src/components/post-form.vue
+++ b/packages/client/src/components/MkPostForm.vue
@@ -71,10 +71,10 @@ import { length } from 'stringz';
 import { toASCII } from 'punycode/';
 import * as Acct from 'misskey-js/built/acct';
 import { throttle } from 'throttle-debounce';
-import XNoteSimple from './note-simple.vue';
-import XNotePreview from './note-preview.vue';
-import XPostFormAttaches from './post-form-attaches.vue';
-import XPollEditor from './poll-editor.vue';
+import XNoteSimple from '@/components/MkNoteSimple.vue';
+import XNotePreview from '@/components/MkNotePreview.vue';
+import XPostFormAttaches from '@/components/MkPostFormAttaches.vue';
+import XPollEditor from '@/components/MkPollEditor.vue';
 import { host, url } from '@/config';
 import { erase, unique } from '@/scripts/array';
 import { extractMentions } from '@/scripts/extract-mentions';
@@ -384,7 +384,7 @@ function setVisibility() {
 		return;
 	}
 
-	os.popup(defineAsyncComponent(() => import('./visibility-picker.vue')), {
+	os.popup(defineAsyncComponent(() => import('@/components/MkVisibilityPicker.vue')), {
 		currentVisibility: visibility,
 		currentLocalOnly: localOnly,
 		src: visibilityButton,
diff --git a/packages/client/src/components/post-form-attaches.vue b/packages/client/src/components/MkPostFormAttaches.vue
similarity index 96%
rename from packages/client/src/components/post-form-attaches.vue
rename to packages/client/src/components/MkPostFormAttaches.vue
index 98bf2df09..a8ec8c33b 100644
--- a/packages/client/src/components/post-form-attaches.vue
+++ b/packages/client/src/components/MkPostFormAttaches.vue
@@ -16,7 +16,7 @@
 
 <script lang="ts">
 import { defineComponent, defineAsyncComponent } from 'vue';
-import MkDriveFileThumbnail from './drive-file-thumbnail.vue';
+import MkDriveFileThumbnail from '@/components/MkDriveFileThumbnail.vue';
 import * as os from '@/os';
 
 export default defineComponent({
@@ -88,7 +88,7 @@ export default defineComponent({
 		},
 
 		async describe(file) {
-			os.popup(defineAsyncComponent(() => import('@/components/media-caption.vue')), {
+			os.popup(defineAsyncComponent(() => import('@/components/MkMediaCaption.vue')), {
 				title: this.$ts.describeFile,
 				input: {
 					placeholder: this.$ts.inputNewDescription,
diff --git a/packages/client/src/components/post-form-dialog.vue b/packages/client/src/components/MkPostFormDialog.vue
similarity index 89%
rename from packages/client/src/components/post-form-dialog.vue
rename to packages/client/src/components/MkPostFormDialog.vue
index dc4e84205..90b281d2c 100644
--- a/packages/client/src/components/post-form-dialog.vue
+++ b/packages/client/src/components/MkPostFormDialog.vue
@@ -7,7 +7,7 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
 import MkModal from '@/components/ui/modal.vue';
-import MkPostForm from '@/components/post-form.vue';
+import MkPostForm from '@/components/MkPostForm.vue';
 
 export default defineComponent({
 	components: {
diff --git a/packages/client/src/components/reaction-icon.vue b/packages/client/src/components/MkReactionIcon.vue
similarity index 100%
rename from packages/client/src/components/reaction-icon.vue
rename to packages/client/src/components/MkReactionIcon.vue
diff --git a/packages/client/src/components/reaction-tooltip.vue b/packages/client/src/components/MkReactionTooltip.vue
similarity index 93%
rename from packages/client/src/components/reaction-tooltip.vue
rename to packages/client/src/components/MkReactionTooltip.vue
index b53061df4..44f268170 100644
--- a/packages/client/src/components/reaction-tooltip.vue
+++ b/packages/client/src/components/MkReactionTooltip.vue
@@ -10,7 +10,7 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import MkTooltip from './ui/tooltip.vue';
-import XReactionIcon from './reaction-icon.vue';
+import XReactionIcon from '@/components/MkReactionIcon.vue';
 
 const props = defineProps<{
 	reaction: string;
diff --git a/packages/client/src/components/reactions-viewer.details.vue b/packages/client/src/components/MkReactionsViewer.details.vue
similarity index 96%
rename from packages/client/src/components/reactions-viewer.details.vue
rename to packages/client/src/components/MkReactionsViewer.details.vue
index eaebc3541..e886ff502 100644
--- a/packages/client/src/components/reactions-viewer.details.vue
+++ b/packages/client/src/components/MkReactionsViewer.details.vue
@@ -19,7 +19,7 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import MkTooltip from './ui/tooltip.vue';
-import XReactionIcon from './reaction-icon.vue';
+import XReactionIcon from '@/components/MkReactionIcon.vue';
 
 const props = defineProps<{
 	reaction: string;
diff --git a/packages/client/src/components/reactions-viewer.reaction.vue b/packages/client/src/components/MkReactionsViewer.reaction.vue
similarity index 95%
rename from packages/client/src/components/reactions-viewer.reaction.vue
rename to packages/client/src/components/MkReactionsViewer.reaction.vue
index c29bd4640..31342b0b4 100644
--- a/packages/client/src/components/reactions-viewer.reaction.vue
+++ b/packages/client/src/components/MkReactionsViewer.reaction.vue
@@ -15,8 +15,8 @@
 <script lang="ts" setup>
 import { computed, onMounted, ref, watch } from 'vue';
 import * as misskey from 'misskey-js';
-import XDetails from '@/components/reactions-viewer.details.vue';
-import XReactionIcon from '@/components/reaction-icon.vue';
+import XDetails from '@/components/MkReactionsViewer.details.vue';
+import XReactionIcon from '@/components/MkReactionIcon.vue';
 import * as os from '@/os';
 import { useTooltip } from '@/scripts/use-tooltip';
 import { $i } from '@/account';
diff --git a/packages/client/src/components/reactions-viewer.vue b/packages/client/src/components/MkReactionsViewer.vue
similarity index 91%
rename from packages/client/src/components/reactions-viewer.vue
rename to packages/client/src/components/MkReactionsViewer.vue
index a9bf51f65..a88311efa 100644
--- a/packages/client/src/components/reactions-viewer.vue
+++ b/packages/client/src/components/MkReactionsViewer.vue
@@ -8,7 +8,7 @@
 import { computed } from 'vue';
 import * as misskey from 'misskey-js';
 import { $i } from '@/account';
-import XReaction from './reactions-viewer.reaction.vue';
+import XReaction from '@/components/MkReactionsViewer.reaction.vue';
 
 const props = defineProps<{
 	note: misskey.entities.Note;
diff --git a/packages/client/src/components/remote-caution.vue b/packages/client/src/components/MkRemoteCaution.vue
similarity index 100%
rename from packages/client/src/components/remote-caution.vue
rename to packages/client/src/components/MkRemoteCaution.vue
diff --git a/packages/client/src/components/renote-button.vue b/packages/client/src/components/MkRenoteButton.vue
similarity index 97%
rename from packages/client/src/components/renote-button.vue
rename to packages/client/src/components/MkRenoteButton.vue
index d267f3040..413f3406a 100644
--- a/packages/client/src/components/renote-button.vue
+++ b/packages/client/src/components/MkRenoteButton.vue
@@ -16,7 +16,7 @@
 <script lang="ts" setup>
 import { computed, ref } from 'vue';
 import * as misskey from 'misskey-js';
-import XDetails from '@/components/users-tooltip.vue';
+import XDetails from '@/components/MkUsersTooltip.vue';
 import { pleaseLogin } from '@/scripts/please-login';
 import * as os from '@/os';
 import { $i } from '@/account';
diff --git a/packages/client/src/components/ripple.vue b/packages/client/src/components/MkRipple.vue
similarity index 100%
rename from packages/client/src/components/ripple.vue
rename to packages/client/src/components/MkRipple.vue
diff --git a/packages/client/src/components/sample.vue b/packages/client/src/components/MkSample.vue
similarity index 100%
rename from packages/client/src/components/sample.vue
rename to packages/client/src/components/MkSample.vue
diff --git a/packages/client/src/components/signin.vue b/packages/client/src/components/MkSignin.vue
similarity index 98%
rename from packages/client/src/components/signin.vue
rename to packages/client/src/components/MkSignin.vue
index dacc61016..e84163171 100644
--- a/packages/client/src/components/signin.vue
+++ b/packages/client/src/components/MkSignin.vue
@@ -237,7 +237,7 @@ function loginFailed(err) {
 }
 
 function resetPassword() {
-	os.popup(defineAsyncComponent(() => import('@/components/forgot-password.vue')), {}, {
+	os.popup(defineAsyncComponent(() => import('@/components/MkForgotPassword.vue')), {}, {
 	}, 'closed');
 }
 </script>
diff --git a/packages/client/src/components/signin-dialog.vue b/packages/client/src/components/MkSigninDialog.vue
similarity index 94%
rename from packages/client/src/components/signin-dialog.vue
rename to packages/client/src/components/MkSigninDialog.vue
index ec68668a7..19b82b36d 100644
--- a/packages/client/src/components/signin-dialog.vue
+++ b/packages/client/src/components/MkSigninDialog.vue
@@ -14,7 +14,7 @@
 
 <script lang="ts" setup>
 import { } from 'vue';
-import MkSignin from './signin.vue';
+import MkSignin from '@/components/MkSignin.vue';
 import XModalWindow from '@/components/ui/modal-window.vue';
 import { i18n } from '@/i18n';
 
diff --git a/packages/client/src/components/signup.vue b/packages/client/src/components/MkSignup.vue
similarity index 99%
rename from packages/client/src/components/signup.vue
rename to packages/client/src/components/MkSignup.vue
index f8e39985b..dbd332ce6 100644
--- a/packages/client/src/components/signup.vue
+++ b/packages/client/src/components/MkSignup.vue
@@ -68,9 +68,9 @@ import { } from 'vue';
 import getPasswordStrength from 'syuilo-password-strength';
 import { toUnicode } from 'punycode/';
 import MkButton from './ui/button.vue';
-import MkCaptcha from './captcha.vue';
 import MkInput from './form/input.vue';
 import MkSwitch from './form/switch.vue';
+import MkCaptcha from '@/components/MkCaptcha.vue';
 import * as config from '@/config';
 import * as os from '@/os';
 import { login } from '@/account';
diff --git a/packages/client/src/components/signup-dialog.vue b/packages/client/src/components/MkSignupDialog.vue
similarity index 94%
rename from packages/client/src/components/signup-dialog.vue
rename to packages/client/src/components/MkSignupDialog.vue
index c5f933f6b..3e989fcb7 100644
--- a/packages/client/src/components/signup-dialog.vue
+++ b/packages/client/src/components/MkSignupDialog.vue
@@ -18,7 +18,7 @@
 
 <script lang="ts" setup>
 import { } from 'vue';
-import XSignup from './signup.vue';
+import XSignup from '@/components/MkSignup.vue';
 import XModalWindow from '@/components/ui/modal-window.vue';
 import { i18n } from '@/i18n';
 
diff --git a/packages/client/src/components/sparkle.vue b/packages/client/src/components/MkSparkle.vue
similarity index 100%
rename from packages/client/src/components/sparkle.vue
rename to packages/client/src/components/MkSparkle.vue
diff --git a/packages/client/src/components/sub-note-content.vue b/packages/client/src/components/MkSubNoteContent.vue
similarity index 95%
rename from packages/client/src/components/sub-note-content.vue
rename to packages/client/src/components/MkSubNoteContent.vue
index 25ab883f4..237f4cf22 100644
--- a/packages/client/src/components/sub-note-content.vue
+++ b/packages/client/src/components/MkSubNoteContent.vue
@@ -24,8 +24,8 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import * as misskey from 'misskey-js';
-import XPoll from './poll.vue';
-import XMediaList from './media-list.vue';
+import XMediaList from '@/components/MkMediaList.vue';
+import XPoll from '@/components/MkPoll.vue';
 import { i18n } from '@/i18n';
 
 const props = defineProps<{
diff --git a/packages/client/src/components/tab.vue b/packages/client/src/components/MkTab.vue
similarity index 100%
rename from packages/client/src/components/tab.vue
rename to packages/client/src/components/MkTab.vue
diff --git a/packages/client/src/components/tag-cloud.vue b/packages/client/src/components/MkTagCloud.vue
similarity index 100%
rename from packages/client/src/components/tag-cloud.vue
rename to packages/client/src/components/MkTagCloud.vue
diff --git a/packages/client/src/components/timeline.vue b/packages/client/src/components/MkTimeline.vue
similarity index 93%
rename from packages/client/src/components/timeline.vue
rename to packages/client/src/components/MkTimeline.vue
index a3fa27ab7..831a194ce 100644
--- a/packages/client/src/components/timeline.vue
+++ b/packages/client/src/components/MkTimeline.vue
@@ -4,7 +4,7 @@
 
 <script lang="ts" setup>
 import { ref, computed, provide, onUnmounted } from 'vue';
-import XNotes from './notes.vue';
+import XNotes from '@/components/MkNotes.vue';
 import * as os from '@/os';
 import { stream } from '@/stream';
 import * as sound from '@/scripts/sound';
@@ -59,10 +59,10 @@ let connection2;
 if (props.src === 'antenna') {
 	endpoint = 'antennas/notes';
 	query = {
-		antennaId: props.antenna
+		antennaId: props.antenna,
 	};
 	connection = stream.useChannel('antenna', {
-		antennaId: props.antenna
+		antennaId: props.antenna,
 	});
 	connection.on('note', prepend);
 } else if (props.src === 'home') {
@@ -92,7 +92,7 @@ if (props.src === 'antenna') {
 } else if (props.src === 'directs') {
 	endpoint = 'notes/mentions';
 	query = {
-		visibility: 'specified'
+		visibility: 'specified',
 	};
 	const onNote = note => {
 		if (note.visibility === 'specified') {
@@ -104,10 +104,10 @@ if (props.src === 'antenna') {
 } else if (props.src === 'list') {
 	endpoint = 'notes/user-list-timeline';
 	query = {
-		listId: props.list
+		listId: props.list,
 	};
 	connection = stream.useChannel('userList', {
-		listId: props.list
+		listId: props.list,
 	});
 	connection.on('note', prepend);
 	connection.on('userAdded', onUserAdded);
@@ -115,10 +115,10 @@ if (props.src === 'antenna') {
 } else if (props.src === 'channel') {
 	endpoint = 'channels/timeline';
 	query = {
-		channelId: props.channel
+		channelId: props.channel,
 	};
 	connection = stream.useChannel('channel', {
-		channelId: props.channel
+		channelId: props.channel,
 	});
 	connection.on('note', prepend);
 }
diff --git a/packages/client/src/components/toast.vue b/packages/client/src/components/MkToast.vue
similarity index 100%
rename from packages/client/src/components/toast.vue
rename to packages/client/src/components/MkToast.vue
diff --git a/packages/client/src/components/token-generate-window.vue b/packages/client/src/components/MkTokenGenerateWindow.vue
similarity index 100%
rename from packages/client/src/components/token-generate-window.vue
rename to packages/client/src/components/MkTokenGenerateWindow.vue
diff --git a/packages/client/src/components/updated.vue b/packages/client/src/components/MkUpdated.vue
similarity index 95%
rename from packages/client/src/components/updated.vue
rename to packages/client/src/components/MkUpdated.vue
index 1c1e5f4ae..f3ce2731b 100644
--- a/packages/client/src/components/updated.vue
+++ b/packages/client/src/components/MkUpdated.vue
@@ -13,7 +13,7 @@
 import { ref } from 'vue';
 import MkModal from '@/components/ui/modal.vue';
 import MkButton from '@/components/ui/button.vue';
-import MkSparkle from '@/components/sparkle.vue';
+import MkSparkle from '@/components/MkSparkle.vue';
 import { version } from '@/config';
 import { i18n } from '@/i18n';
 
diff --git a/packages/client/src/components/url-preview.vue b/packages/client/src/components/MkUrlPreview.vue
similarity index 100%
rename from packages/client/src/components/url-preview.vue
rename to packages/client/src/components/MkUrlPreview.vue
diff --git a/packages/client/src/components/url-preview-popup.vue b/packages/client/src/components/MkUrlPreviewPopup.vue
similarity index 88%
rename from packages/client/src/components/url-preview-popup.vue
rename to packages/client/src/components/MkUrlPreviewPopup.vue
index 5f3717ab9..2f0ffaa38 100644
--- a/packages/client/src/components/url-preview-popup.vue
+++ b/packages/client/src/components/MkUrlPreviewPopup.vue
@@ -8,25 +8,25 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue';
-import MkUrlPreview from './url-preview.vue';
+import MkUrlPreview from '@/components/MkUrlPreview.vue';
 import * as os from '@/os';
 
 export default defineComponent({
 	components: {
-		MkUrlPreview
+		MkUrlPreview,
 	},
 
 	props: {
 		url: {
 			type: String,
-			required: true
+			required: true,
 		},
 		source: {
-			required: true
+			required: true,
 		},
 		showing: {
 			type: Boolean,
-			required: true
+			required: true,
 		},
 	},
 
diff --git a/packages/client/src/components/user-card-mini.vue b/packages/client/src/components/MkUserCardMini.vue
similarity index 97%
rename from packages/client/src/components/user-card-mini.vue
rename to packages/client/src/components/MkUserCardMini.vue
index 732adf7f5..1a4c49498 100644
--- a/packages/client/src/components/user-card-mini.vue
+++ b/packages/client/src/components/MkUserCardMini.vue
@@ -11,7 +11,7 @@
 
 <script lang="ts" setup>
 import * as misskey from 'misskey-js';
-import MkMiniChart from '@/components/mini-chart.vue';
+import MkMiniChart from '@/components/MkMiniChart.vue';
 import * as os from '@/os';
 import { acct } from '@/filters/user';
 
diff --git a/packages/client/src/components/user-info.vue b/packages/client/src/components/MkUserInfo.vue
similarity index 97%
rename from packages/client/src/components/user-info.vue
rename to packages/client/src/components/MkUserInfo.vue
index 1cd275a6d..4670def56 100644
--- a/packages/client/src/components/user-info.vue
+++ b/packages/client/src/components/MkUserInfo.vue
@@ -29,7 +29,7 @@
 
 <script lang="ts" setup>
 import * as misskey from 'misskey-js';
-import MkFollowButton from './follow-button.vue';
+import MkFollowButton from '@/components/MkFollowButton.vue';
 import { userPage } from '@/filters/user';
 import { i18n } from '@/i18n';
 
diff --git a/packages/client/src/components/user-list.vue b/packages/client/src/components/MkUserList.vue
similarity index 94%
rename from packages/client/src/components/user-list.vue
rename to packages/client/src/components/MkUserList.vue
index fe30d371f..d8e28e17d 100644
--- a/packages/client/src/components/user-list.vue
+++ b/packages/client/src/components/MkUserList.vue
@@ -17,7 +17,7 @@
 
 <script lang="ts" setup>
 import { ref } from 'vue';
-import MkUserInfo from '@/components/user-info.vue';
+import MkUserInfo from '@/components/MkUserInfo.vue';
 import MkPagination, { Paging } from '@/components/ui/pagination.vue';
 import { userPage } from '@/filters/user';
 import { i18n } from '@/i18n';
diff --git a/packages/client/src/components/user-online-indicator.vue b/packages/client/src/components/MkUserOnlineIndicator.vue
similarity index 100%
rename from packages/client/src/components/user-online-indicator.vue
rename to packages/client/src/components/MkUserOnlineIndicator.vue
diff --git a/packages/client/src/components/user-preview.vue b/packages/client/src/components/MkUserPreview.vue
similarity index 96%
rename from packages/client/src/components/user-preview.vue
rename to packages/client/src/components/MkUserPreview.vue
index 523960564..427e46ef1 100644
--- a/packages/client/src/components/user-preview.vue
+++ b/packages/client/src/components/MkUserPreview.vue
@@ -36,27 +36,27 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
 import * as Acct from 'misskey-js/built/acct';
-import MkFollowButton from './follow-button.vue';
+import MkFollowButton from '@/components/MkFollowButton.vue';
 import { userPage } from '@/filters/user';
 import * as os from '@/os';
 
 export default defineComponent({
 	components: {
-		MkFollowButton
+		MkFollowButton,
 	},
 
 	props: {
 		showing: {
 			type: Boolean,
-			required: true
+			required: true,
 		},
 		q: {
 			type: String,
-			required: true
+			required: true,
 		},
 		source: {
-			required: true
-		}
+			required: true,
+		},
 	},
 
 	emits: ['closed', 'mouseover', 'mouseleave'],
@@ -96,8 +96,8 @@ export default defineComponent({
 	},
 
 	methods: {
-		userPage
-	}
+		userPage,
+	},
 });
 </script>
 
diff --git a/packages/client/src/components/user-select-dialog.vue b/packages/client/src/components/MkUserSelectDialog.vue
similarity index 100%
rename from packages/client/src/components/user-select-dialog.vue
rename to packages/client/src/components/MkUserSelectDialog.vue
diff --git a/packages/client/src/components/users-tooltip.vue b/packages/client/src/components/MkUsersTooltip.vue
similarity index 100%
rename from packages/client/src/components/users-tooltip.vue
rename to packages/client/src/components/MkUsersTooltip.vue
diff --git a/packages/client/src/components/visibility.vue b/packages/client/src/components/MkVisibility.vue
similarity index 95%
rename from packages/client/src/components/visibility.vue
rename to packages/client/src/components/MkVisibility.vue
index b41c95033..739720bf9 100644
--- a/packages/client/src/components/visibility.vue
+++ b/packages/client/src/components/MkVisibility.vue
@@ -9,7 +9,7 @@
 
 <script lang="ts" setup>
 import { ref } from 'vue';
-import XDetails from '@/components/users-tooltip.vue';
+import XDetails from '@/components/MkUsersTooltip.vue';
 import * as os from '@/os';
 import { useTooltip } from '@/scripts/use-tooltip';
 
diff --git a/packages/client/src/components/visibility-picker.vue b/packages/client/src/components/MkVisibilityPicker.vue
similarity index 100%
rename from packages/client/src/components/visibility-picker.vue
rename to packages/client/src/components/MkVisibilityPicker.vue
diff --git a/packages/client/src/components/waiting-dialog.vue b/packages/client/src/components/MkWaitingDialog.vue
similarity index 100%
rename from packages/client/src/components/waiting-dialog.vue
rename to packages/client/src/components/MkWaitingDialog.vue
diff --git a/packages/client/src/components/widgets.vue b/packages/client/src/components/MkWidgets.vue
similarity index 100%
rename from packages/client/src/components/widgets.vue
rename to packages/client/src/components/MkWidgets.vue
diff --git a/packages/client/src/components/form/checkbox.vue b/packages/client/src/components/form/checkbox.vue
index fb5c82bb4..bd56c9c7e 100644
--- a/packages/client/src/components/form/checkbox.vue
+++ b/packages/client/src/components/form/checkbox.vue
@@ -23,7 +23,7 @@
 <script lang="ts" setup>
 import { toRefs, Ref } from 'vue';
 import * as os from '@/os';
-import Ripple from '@/components/ripple.vue';
+import Ripple from '@/components/MkRipple.vue';
 import { i18n } from '@/i18n';
 
 const props = defineProps<{
diff --git a/packages/client/src/components/global/a.vue b/packages/client/src/components/global/MkA.vue
similarity index 100%
rename from packages/client/src/components/global/a.vue
rename to packages/client/src/components/global/MkA.vue
diff --git a/packages/client/src/components/global/acct.vue b/packages/client/src/components/global/MkAcct.vue
similarity index 100%
rename from packages/client/src/components/global/acct.vue
rename to packages/client/src/components/global/MkAcct.vue
diff --git a/packages/client/src/components/global/ad.vue b/packages/client/src/components/global/MkAd.vue
similarity index 100%
rename from packages/client/src/components/global/ad.vue
rename to packages/client/src/components/global/MkAd.vue
diff --git a/packages/client/src/components/global/avatar.vue b/packages/client/src/components/global/MkAvatar.vue
similarity index 98%
rename from packages/client/src/components/global/avatar.vue
rename to packages/client/src/components/global/MkAvatar.vue
index 4868896c9..5f3e3c176 100644
--- a/packages/client/src/components/global/avatar.vue
+++ b/packages/client/src/components/global/MkAvatar.vue
@@ -15,7 +15,7 @@ import * as misskey from 'misskey-js';
 import { getStaticImageUrl } from '@/scripts/get-static-image-url';
 import { extractAvgColorFromBlurhash } from '@/scripts/extract-avg-color-from-blurhash';
 import { acct, userPage } from '@/filters/user';
-import MkUserOnlineIndicator from '@/components/user-online-indicator.vue';
+import MkUserOnlineIndicator from '@/components/MkUserOnlineIndicator.vue';
 import { defaultStore } from '@/store';
 
 const props = withDefaults(defineProps<{
diff --git a/packages/client/src/components/global/ellipsis.vue b/packages/client/src/components/global/MkEllipsis.vue
similarity index 100%
rename from packages/client/src/components/global/ellipsis.vue
rename to packages/client/src/components/global/MkEllipsis.vue
diff --git a/packages/client/src/components/global/emoji.vue b/packages/client/src/components/global/MkEmoji.vue
similarity index 100%
rename from packages/client/src/components/global/emoji.vue
rename to packages/client/src/components/global/MkEmoji.vue
diff --git a/packages/client/src/components/global/error.vue b/packages/client/src/components/global/MkError.vue
similarity index 100%
rename from packages/client/src/components/global/error.vue
rename to packages/client/src/components/global/MkError.vue
diff --git a/packages/client/src/components/global/loading.vue b/packages/client/src/components/global/MkLoading.vue
similarity index 100%
rename from packages/client/src/components/global/loading.vue
rename to packages/client/src/components/global/MkLoading.vue
diff --git a/packages/client/src/components/global/misskey-flavored-markdown.vue b/packages/client/src/components/global/MkMisskeyFlavoredMarkdown.vue
similarity index 100%
rename from packages/client/src/components/global/misskey-flavored-markdown.vue
rename to packages/client/src/components/global/MkMisskeyFlavoredMarkdown.vue
diff --git a/packages/client/src/components/global/page-header.vue b/packages/client/src/components/global/MkPageHeader.vue
similarity index 100%
rename from packages/client/src/components/global/page-header.vue
rename to packages/client/src/components/global/MkPageHeader.vue
diff --git a/packages/client/src/components/global/spacer.vue b/packages/client/src/components/global/MkSpacer.vue
similarity index 100%
rename from packages/client/src/components/global/spacer.vue
rename to packages/client/src/components/global/MkSpacer.vue
diff --git a/packages/client/src/components/global/sticky-container.vue b/packages/client/src/components/global/MkStickyContainer.vue
similarity index 100%
rename from packages/client/src/components/global/sticky-container.vue
rename to packages/client/src/components/global/MkStickyContainer.vue
diff --git a/packages/client/src/components/global/time.vue b/packages/client/src/components/global/MkTime.vue
similarity index 100%
rename from packages/client/src/components/global/time.vue
rename to packages/client/src/components/global/MkTime.vue
diff --git a/packages/client/src/components/global/url.vue b/packages/client/src/components/global/MkUrl.vue
similarity index 96%
rename from packages/client/src/components/global/url.vue
rename to packages/client/src/components/global/MkUrl.vue
index dc79a2064..d002727d5 100644
--- a/packages/client/src/components/global/url.vue
+++ b/packages/client/src/components/global/MkUrl.vue
@@ -44,7 +44,7 @@ export default defineComponent({
 		const el = ref();
 		
 		useTooltip(el, (showing) => {
-			os.popup(defineAsyncComponent(() => import('@/components/url-preview-popup.vue')), {
+			os.popup(defineAsyncComponent(() => import('@/components/MkUrlPreviewPopup.vue')), {
 				showing,
 				url: props.url,
 				source: el.value,
diff --git a/packages/client/src/components/global/user-name.vue b/packages/client/src/components/global/MkUserName.vue
similarity index 100%
rename from packages/client/src/components/global/user-name.vue
rename to packages/client/src/components/global/MkUserName.vue
diff --git a/packages/client/src/components/global/router-view.vue b/packages/client/src/components/global/RouterView.vue
similarity index 100%
rename from packages/client/src/components/global/router-view.vue
rename to packages/client/src/components/global/RouterView.vue
diff --git a/packages/client/src/components/index.ts b/packages/client/src/components/index.ts
index aa8a591e5..863925700 100644
--- a/packages/client/src/components/index.ts
+++ b/packages/client/src/components/index.ts
@@ -1,22 +1,22 @@
 import { App } from 'vue';
 
-import Mfm from './global/misskey-flavored-markdown.vue';
-import MkA from './global/a.vue';
-import MkAcct from './global/acct.vue';
-import MkAvatar from './global/avatar.vue';
-import MkEmoji from './global/emoji.vue';
-import MkUserName from './global/user-name.vue';
-import MkEllipsis from './global/ellipsis.vue';
-import MkTime from './global/time.vue';
-import MkUrl from './global/url.vue';
+import Mfm from './global/MkMisskeyFlavoredMarkdown.vue';
+import MkA from './global/MkA.vue';
+import MkAcct from './global/MkAcct.vue';
+import MkAvatar from './global/MkAvatar.vue';
+import MkEmoji from './global/MkEmoji.vue';
+import MkUserName from './global/MkUserName.vue';
+import MkEllipsis from './global/MkEllipsis.vue';
+import MkTime from './global/MkTime.vue';
+import MkUrl from './global/MkUrl.vue';
 import I18n from './global/i18n';
-import RouterView from './global/router-view.vue';
-import MkLoading from './global/loading.vue';
-import MkError from './global/error.vue';
-import MkAd from './global/ad.vue';
-import MkPageHeader from './global/page-header.vue';
-import MkSpacer from './global/spacer.vue';
-import MkStickyContainer from './global/sticky-container.vue';
+import RouterView from './global/RouterView.vue';
+import MkLoading from './global/MkLoading.vue';
+import MkError from './global/MkError.vue';
+import MkAd from './global/MkAd.vue';
+import MkPageHeader from './global/MkPageHeader.vue';
+import MkSpacer from './global/MkSpacer.vue';
+import MkStickyContainer from './global/MkStickyContainer.vue';
 
 export default function(app: App) {
 	app.component('I18n', I18n);
diff --git a/packages/client/src/components/mfm.ts b/packages/client/src/components/mfm.ts
index 16ae45bfe..688857a49 100644
--- a/packages/client/src/components/mfm.ts
+++ b/packages/client/src/components/mfm.ts
@@ -1,15 +1,15 @@
 import { VNode, defineComponent, h } from 'vue';
 import * as mfm from 'mfm-js';
-import MkUrl from '@/components/global/url.vue';
-import MkLink from '@/components/link.vue';
-import MkMention from '@/components/mention.vue';
-import MkEmoji from '@/components/global/emoji.vue';
+import MkUrl from '@/components/global/MkUrl.vue';
+import MkLink from '@/components/MkLink.vue';
+import MkMention from '@/components/MkMention.vue';
+import MkEmoji from '@/components/global/MkEmoji.vue';
 import { concat } from '@/scripts/array';
-import MkFormula from '@/components/formula.vue';
-import MkCode from '@/components/code.vue';
-import MkGoogle from '@/components/google.vue';
-import MkSparkle from '@/components/sparkle.vue';
-import MkA from '@/components/global/a.vue';
+import MkFormula from '@/components/MkFormula.vue';
+import MkCode from '@/components/MkCode.vue';
+import MkGoogle from '@/components/MkGoogle.vue';
+import MkSparkle from '@/components/MkSparkle.vue';
+import MkA from '@/components/global/MkA.vue';
 import { host } from '@/config';
 import { MFM_TAGS } from '@/scripts/mfm-tags';
 
diff --git a/packages/client/src/components/page/page.image.vue b/packages/client/src/components/page/page.image.vue
index 6e38a9f42..8ba70c585 100644
--- a/packages/client/src/components/page/page.image.vue
+++ b/packages/client/src/components/page/page.image.vue
@@ -6,7 +6,7 @@
 
 <script lang="ts" setup>
 import { defineComponent, PropType } from 'vue';
-import ImgWithBlurhash from '@/components/img-with-blurhash.vue';
+import ImgWithBlurhash from '@/components/MkImgWithBlurhash.vue';
 import * as os from '@/os';
 import { ImageBlock } from '@/scripts/hpml/block';
 import { Hpml } from '@/scripts/hpml/evaluator';
diff --git a/packages/client/src/components/page/page.note.vue b/packages/client/src/components/page/page.note.vue
index 3bb338b09..431f0b08d 100644
--- a/packages/client/src/components/page/page.note.vue
+++ b/packages/client/src/components/page/page.note.vue
@@ -7,8 +7,8 @@
 
 <script lang="ts">
 import { defineComponent, onMounted, PropType, Ref, ref } from 'vue';
-import XNote from '@/components/note.vue';
-import XNoteDetailed from '@/components/note-detailed.vue';
+import XNote from '@/components/MkNote.vue';
+import XNoteDetailed from '@/components/MkNoteDetailed.vue';
 import * as os from '@/os';
 import { NoteBlock } from '@/scripts/hpml/block';
 
diff --git a/packages/client/src/components/page/page.text.vue b/packages/client/src/components/page/page.text.vue
index 8d2955466..b4abe8284 100644
--- a/packages/client/src/components/page/page.text.vue
+++ b/packages/client/src/components/page/page.text.vue
@@ -14,7 +14,7 @@ import { extractUrlFromMfm } from '@/scripts/extract-url-from-mfm';
 
 export default defineComponent({
 	components: {
-		MkUrlPreview: defineAsyncComponent(() => import('@/components/url-preview.vue')),
+		MkUrlPreview: defineAsyncComponent(() => import('@/components/MkUrlPreview.vue')),
 	},
 	props: {
 		block: {
diff --git a/packages/client/src/directives/ripple.ts b/packages/client/src/directives/ripple.ts
index f1d41ddb0..5329d021f 100644
--- a/packages/client/src/directives/ripple.ts
+++ b/packages/client/src/directives/ripple.ts
@@ -1,4 +1,4 @@
-import Ripple from '@/components/ripple.vue';
+import Ripple from '@/components/MkRipple.vue';
 import { popup } from '@/os';
 
 export default {
diff --git a/packages/client/src/directives/user-preview.ts b/packages/client/src/directives/user-preview.ts
index 9d18a6987..c46167662 100644
--- a/packages/client/src/directives/user-preview.ts
+++ b/packages/client/src/directives/user-preview.ts
@@ -24,7 +24,7 @@ export class UserPreview {
 
 		const showing = ref(true);
 
-		popup(defineAsyncComponent(() => import('@/components/user-preview.vue')), {
+		popup(defineAsyncComponent(() => import('@/components/MkUserPreview.vue')), {
 			showing,
 			q: this.user,
 			source: this.el
diff --git a/packages/client/src/init.ts b/packages/client/src/init.ts
index a8cc38ba9..737c044e6 100644
--- a/packages/client/src/init.ts
+++ b/packages/client/src/init.ts
@@ -241,7 +241,7 @@ import { getAccountFromId } from '@/scripts/get-account-from-id';
 			if (lastVersion != null && compareVersions(version, lastVersion) === 1) {
 				// ログインしてる場合だけ
 				if ($i) {
-					popup(defineAsyncComponent(() => import('@/components/updated.vue')), {}, {}, 'closed');
+					popup(defineAsyncComponent(() => import('@/components/MkUpdated.vue')), {}, {}, 'closed');
 				}
 			}
 		} catch (err) {
diff --git a/packages/client/src/os.ts b/packages/client/src/os.ts
index 00dae867d..e014eb529 100644
--- a/packages/client/src/os.ts
+++ b/packages/client/src/os.ts
@@ -5,8 +5,8 @@ import { EventEmitter } from 'eventemitter3';
 import insertTextAtCursor from 'insert-text-at-cursor';
 import * as Misskey from 'misskey-js';
 import { apiUrl, url } from '@/config';
-import MkPostFormDialog from '@/components/post-form-dialog.vue';
-import MkWaitingDialog from '@/components/waiting-dialog.vue';
+import MkPostFormDialog from '@/components/MkPostFormDialog.vue';
+import MkWaitingDialog from '@/components/MkWaitingDialog.vue';
 import { MenuItem } from '@/types/menu';
 import { $i } from '@/account';
 
@@ -187,19 +187,19 @@ export async function popup(component: Component, props: Record<string, any>, ev
 }
 
 export function pageWindow(path: string) {
-	popup(defineAsyncComponent(() => import('@/components/page-window.vue')), {
+	popup(defineAsyncComponent(() => import('@/components/MkPageWindow.vue')), {
 		initialPath: path,
 	}, {}, 'closed');
 }
 
 export function modalPageWindow(path: string) {
-	popup(defineAsyncComponent(() => import('@/components/modal-page-window.vue')), {
+	popup(defineAsyncComponent(() => import('@/components/MkModalPageWindow.vue')), {
 		initialPath: path,
 	}, {}, 'closed');
 }
 
 export function toast(message: string) {
-	popup(defineAsyncComponent(() => import('@/components/toast.vue')), {
+	popup(defineAsyncComponent(() => import('@/components/MkToast.vue')), {
 		message,
 	}, {}, 'closed');
 }
@@ -210,7 +210,7 @@ export function alert(props: {
 	text?: string | null;
 }): Promise<void> {
 	return new Promise((resolve, reject) => {
-		popup(defineAsyncComponent(() => import('@/components/dialog.vue')), props, {
+		popup(defineAsyncComponent(() => import('@/components/MkDialog.vue')), props, {
 			done: result => {
 				resolve();
 			},
@@ -224,7 +224,7 @@ export function confirm(props: {
 	text?: string | null;
 }): Promise<{ canceled: boolean }> {
 	return new Promise((resolve, reject) => {
-		popup(defineAsyncComponent(() => import('@/components/dialog.vue')), {
+		popup(defineAsyncComponent(() => import('@/components/MkDialog.vue')), {
 			...props,
 			showCancelButton: true,
 		}, {
@@ -245,7 +245,7 @@ export function inputText(props: {
 	canceled: false; result: string;
 }> {
 	return new Promise((resolve, reject) => {
-		popup(defineAsyncComponent(() => import('@/components/dialog.vue')), {
+		popup(defineAsyncComponent(() => import('@/components/MkDialog.vue')), {
 			title: props.title,
 			text: props.text,
 			input: {
@@ -270,7 +270,7 @@ export function inputNumber(props: {
 	canceled: false; result: number;
 }> {
 	return new Promise((resolve, reject) => {
-		popup(defineAsyncComponent(() => import('@/components/dialog.vue')), {
+		popup(defineAsyncComponent(() => import('@/components/MkDialog.vue')), {
 			title: props.title,
 			text: props.text,
 			input: {
@@ -295,7 +295,7 @@ export function inputDate(props: {
 	canceled: false; result: Date;
 }> {
 	return new Promise((resolve, reject) => {
-		popup(defineAsyncComponent(() => import('@/components/dialog.vue')), {
+		popup(defineAsyncComponent(() => import('@/components/MkDialog.vue')), {
 			title: props.title,
 			text: props.text,
 			input: {
@@ -332,7 +332,7 @@ export function select<C = any>(props: {
 	canceled: false; result: C;
 }> {
 	return new Promise((resolve, reject) => {
-		popup(defineAsyncComponent(() => import('@/components/dialog.vue')), {
+		popup(defineAsyncComponent(() => import('@/components/MkDialog.vue')), {
 			title: props.title,
 			text: props.text,
 			select: {
@@ -354,7 +354,7 @@ export function success() {
 		window.setTimeout(() => {
 			showing.value = false;
 		}, 1000);
-		popup(defineAsyncComponent(() => import('@/components/waiting-dialog.vue')), {
+		popup(defineAsyncComponent(() => import('@/components/MkWaitingDialog.vue')), {
 			success: true,
 			showing: showing,
 		}, {
@@ -366,7 +366,7 @@ export function success() {
 export function waiting() {
 	return new Promise((resolve, reject) => {
 		const showing = ref(true);
-		popup(defineAsyncComponent(() => import('@/components/waiting-dialog.vue')), {
+		popup(defineAsyncComponent(() => import('@/components/MkWaitingDialog.vue')), {
 			success: false,
 			showing: showing,
 		}, {
@@ -377,7 +377,7 @@ export function waiting() {
 
 export function form(title, form) {
 	return new Promise((resolve, reject) => {
-		popup(defineAsyncComponent(() => import('@/components/form-dialog.vue')), { title, form }, {
+		popup(defineAsyncComponent(() => import('@/components/MkFormDialog.vue')), { title, form }, {
 			done: result => {
 				resolve(result);
 			},
@@ -387,7 +387,7 @@ export function form(title, form) {
 
 export async function selectUser() {
 	return new Promise((resolve, reject) => {
-		popup(defineAsyncComponent(() => import('@/components/user-select-dialog.vue')), {}, {
+		popup(defineAsyncComponent(() => import('@/components/MkUserSelectDialog.vue')), {}, {
 			ok: user => {
 				resolve(user);
 			},
@@ -397,7 +397,7 @@ export async function selectUser() {
 
 export async function selectDriveFile(multiple: boolean) {
 	return new Promise((resolve, reject) => {
-		popup(defineAsyncComponent(() => import('@/components/drive-select-dialog.vue')), {
+		popup(defineAsyncComponent(() => import('@/components/MkDriveSelectDialog.vue')), {
 			type: 'file',
 			multiple,
 		}, {
@@ -412,7 +412,7 @@ export async function selectDriveFile(multiple: boolean) {
 
 export async function selectDriveFolder(multiple: boolean) {
 	return new Promise((resolve, reject) => {
-		popup(defineAsyncComponent(() => import('@/components/drive-select-dialog.vue')), {
+		popup(defineAsyncComponent(() => import('@/components/MkDriveSelectDialog.vue')), {
 			type: 'folder',
 			multiple,
 		}, {
@@ -427,7 +427,7 @@ export async function selectDriveFolder(multiple: boolean) {
 
 export async function pickEmoji(src: HTMLElement | null, opts) {
 	return new Promise((resolve, reject) => {
-		popup(defineAsyncComponent(() => import('@/components/emoji-picker-dialog.vue')), {
+		popup(defineAsyncComponent(() => import('@/components/MkEmojiPickerDialog.vue')), {
 			src,
 			...opts,
 		}, {
@@ -442,7 +442,7 @@ export async function cropImage(image: Misskey.entities.DriveFile, options: {
 	aspectRatio: number;
 }): Promise<Misskey.entities.DriveFile> {
 	return new Promise((resolve, reject) => {
-		popup(defineAsyncComponent(() => import('@/components/cropper-dialog.vue')), {
+		popup(defineAsyncComponent(() => import('@/components/MkCropperDialog.vue')), {
 			file: image,
 			aspectRatio: options.aspectRatio,
 		}, {
@@ -492,7 +492,7 @@ export async function openEmojiPicker(src?: HTMLElement, opts, initialTextarea:
 		characterData: false,
 	});
 
-	openingEmojiPicker = await popup(defineAsyncComponent(() => import('@/components/emoji-picker-window.vue')), {
+	openingEmojiPicker = await popup(defineAsyncComponent(() => import('@/components/MkEmojiPickerWindow.vue')), {
 		src,
 		...opts,
 	}, {
diff --git a/packages/client/src/pages/about-misskey.vue b/packages/client/src/pages/about-misskey.vue
index fd7b5f936..06c016116 100644
--- a/packages/client/src/pages/about-misskey.vue
+++ b/packages/client/src/pages/about-misskey.vue
@@ -68,7 +68,7 @@ import { version } from '@/config';
 import FormLink from '@/components/form/link.vue';
 import FormSection from '@/components/form/section.vue';
 import MkButton from '@/components/ui/button.vue';
-import MkLink from '@/components/link.vue';
+import MkLink from '@/components/MkLink.vue';
 import { physics } from '@/scripts/physics';
 import { i18n } from '@/i18n';
 import { defaultStore } from '@/store';
diff --git a/packages/client/src/pages/about.emojis.vue b/packages/client/src/pages/about.emojis.vue
index 6d915c584..8049975da 100644
--- a/packages/client/src/pages/about.emojis.vue
+++ b/packages/client/src/pages/about.emojis.vue
@@ -34,7 +34,7 @@ import MkButton from '@/components/ui/button.vue';
 import MkInput from '@/components/form/input.vue';
 import MkSelect from '@/components/form/select.vue';
 import MkFolder from '@/components/ui/folder.vue';
-import MkTab from '@/components/tab.vue';
+import MkTab from '@/components/MkTab.vue';
 import * as os from '@/os';
 import { emojiCategories, emojiTags } from '@/instance';
 import XEmoji from './emojis.emoji.vue';
diff --git a/packages/client/src/pages/about.federation.vue b/packages/client/src/pages/about.federation.vue
index 8d9390872..51a49ba59 100644
--- a/packages/client/src/pages/about.federation.vue
+++ b/packages/client/src/pages/about.federation.vue
@@ -52,7 +52,7 @@ import MkButton from '@/components/ui/button.vue';
 import MkInput from '@/components/form/input.vue';
 import MkSelect from '@/components/form/select.vue';
 import MkPagination from '@/components/ui/pagination.vue';
-import MkInstanceCardMini from '@/components/instance-card-mini.vue';
+import MkInstanceCardMini from '@/components/MkInstanceCardMini.vue';
 import FormSplit from '@/components/form/split.vue';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
diff --git a/packages/client/src/pages/about.vue b/packages/client/src/pages/about.vue
index ff50ba845..33c55fece 100644
--- a/packages/client/src/pages/about.vue
+++ b/packages/client/src/pages/about.vue
@@ -88,8 +88,8 @@ import FormLink from '@/components/form/link.vue';
 import FormSection from '@/components/form/section.vue';
 import FormSuspense from '@/components/form/suspense.vue';
 import FormSplit from '@/components/form/split.vue';
-import MkKeyValue from '@/components/key-value.vue';
-import MkInstanceStats from '@/components/instance-stats.vue';
+import MkKeyValue from '@/components/MkKeyValue.vue';
+import MkInstanceStats from '@/components/MkInstanceStats.vue';
 import * as os from '@/os';
 import number from '@/filters/number';
 import { i18n } from '@/i18n';
diff --git a/packages/client/src/pages/admin-file.vue b/packages/client/src/pages/admin-file.vue
index f96a41a7e..dfdbb1f0d 100644
--- a/packages/client/src/pages/admin-file.vue
+++ b/packages/client/src/pages/admin-file.vue
@@ -65,11 +65,11 @@
 import { computed } from 'vue';
 import MkButton from '@/components/ui/button.vue';
 import MkSwitch from '@/components/form/switch.vue';
-import MkObjectView from '@/components/object-view.vue';
-import MkDriveFileThumbnail from '@/components/drive-file-thumbnail.vue';
-import MkKeyValue from '@/components/key-value.vue';
+import MkObjectView from '@/components/MkObjectView.vue';
+import MkDriveFileThumbnail from '@/components/MkDriveFileThumbnail.vue';
+import MkKeyValue from '@/components/MkKeyValue.vue';
 import FormSection from '@/components/form/section.vue';
-import MkUserCardMini from '@/components/user-card-mini.vue';
+import MkUserCardMini from '@/components/MkUserCardMini.vue';
 import MkInfo from '@/components/ui/info.vue';
 import bytes from '@/filters/bytes';
 import * as os from '@/os';
diff --git a/packages/client/src/pages/admin/abuses.vue b/packages/client/src/pages/admin/abuses.vue
index 9c718ab9e..25fd8bcb6 100644
--- a/packages/client/src/pages/admin/abuses.vue
+++ b/packages/client/src/pages/admin/abuses.vue
@@ -53,7 +53,7 @@ import XHeader from './_header_.vue';
 import MkInput from '@/components/form/input.vue';
 import MkSelect from '@/components/form/select.vue';
 import MkPagination from '@/components/ui/pagination.vue';
-import XAbuseReport from '@/components/abuse-report.vue';
+import XAbuseReport from '@/components/MkAbuseReport.vue';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
 import { definePageMetadata } from '@/scripts/page-metadata';
diff --git a/packages/client/src/pages/admin/bot-protection.vue b/packages/client/src/pages/admin/bot-protection.vue
index cf2cdea92..2c404380a 100644
--- a/packages/client/src/pages/admin/bot-protection.vue
+++ b/packages/client/src/pages/admin/bot-protection.vue
@@ -54,7 +54,7 @@ import * as os from '@/os';
 import { fetchInstance } from '@/instance';
 import { i18n } from '@/i18n';
 
-const MkCaptcha = defineAsyncComponent(() => import('@/components/captcha.vue'));
+const MkCaptcha = defineAsyncComponent(() => import('@/components/MkCaptcha.vue'));
 
 let provider = $ref(null);
 let hcaptchaSiteKey: string | null = $ref(null);
diff --git a/packages/client/src/pages/admin/database.vue b/packages/client/src/pages/admin/database.vue
index ca8718ef6..1c2656b8f 100644
--- a/packages/client/src/pages/admin/database.vue
+++ b/packages/client/src/pages/admin/database.vue
@@ -13,7 +13,7 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import FormSuspense from '@/components/form/suspense.vue';
-import MkKeyValue from '@/components/key-value.vue';
+import MkKeyValue from '@/components/MkKeyValue.vue';
 import * as os from '@/os';
 import bytes from '@/filters/bytes';
 import number from '@/filters/number';
diff --git a/packages/client/src/pages/admin/emojis.vue b/packages/client/src/pages/admin/emojis.vue
index 51ecd1b79..cb886ee37 100644
--- a/packages/client/src/pages/admin/emojis.vue
+++ b/packages/client/src/pages/admin/emojis.vue
@@ -73,7 +73,7 @@ import XHeader from './_header_.vue';
 import MkButton from '@/components/ui/button.vue';
 import MkInput from '@/components/form/input.vue';
 import MkPagination from '@/components/ui/pagination.vue';
-import MkTab from '@/components/tab.vue';
+import MkTab from '@/components/MkTab.vue';
 import MkSwitch from '@/components/form/switch.vue';
 import FormSplit from '@/components/form/split.vue';
 import { selectFile, selectFiles } from '@/scripts/select-file';
diff --git a/packages/client/src/pages/admin/files.vue b/packages/client/src/pages/admin/files.vue
index 2614a6b8d..f919571ce 100644
--- a/packages/client/src/pages/admin/files.vue
+++ b/packages/client/src/pages/admin/files.vue
@@ -39,7 +39,7 @@ import XHeader from './_header_.vue';
 import MkButton from '@/components/ui/button.vue';
 import MkInput from '@/components/form/input.vue';
 import MkSelect from '@/components/form/select.vue';
-import MkFileListForAdmin from '@/components/file-list-for-admin.vue';
+import MkFileListForAdmin from '@/components/MkFileListForAdmin.vue';
 import bytes from '@/filters/bytes';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
diff --git a/packages/client/src/pages/admin/overview.federation.vue b/packages/client/src/pages/admin/overview.federation.vue
index 6c99cad33..e8cb5867a 100644
--- a/packages/client/src/pages/admin/overview.federation.vue
+++ b/packages/client/src/pages/admin/overview.federation.vue
@@ -16,7 +16,7 @@
 
 <script lang="ts" setup>
 import { onMounted, onUnmounted, ref } from 'vue';
-import MkMiniChart from '@/components/mini-chart.vue';
+import MkMiniChart from '@/components/MkMiniChart.vue';
 import * as os from '@/os';
 import { useInterval } from '@/scripts/use-interval';
 
diff --git a/packages/client/src/pages/admin/overview.user.vue b/packages/client/src/pages/admin/overview.user.vue
index d70336f3c..0dd4a749b 100644
--- a/packages/client/src/pages/admin/overview.user.vue
+++ b/packages/client/src/pages/admin/overview.user.vue
@@ -11,7 +11,7 @@
 
 <script lang="ts" setup>
 import * as misskey from 'misskey-js';
-import MkMiniChart from '@/components/mini-chart.vue';
+import MkMiniChart from '@/components/MkMiniChart.vue';
 import * as os from '@/os';
 import { acct } from '@/filters/user';
 
diff --git a/packages/client/src/pages/admin/overview.vue b/packages/client/src/pages/admin/overview.vue
index c186df15a..e532a908f 100644
--- a/packages/client/src/pages/admin/overview.vue
+++ b/packages/client/src/pages/admin/overview.vue
@@ -165,8 +165,8 @@ import XFederation from './overview.federation.vue';
 import XQueueChart from './overview.queue-chart.vue';
 import XUser from './overview.user.vue';
 import XPie from './overview.pie.vue';
-import MkNumberDiff from '@/components/number-diff.vue';
-import MkTagCloud from '@/components/tag-cloud.vue';
+import MkNumberDiff from '@/components/MkNumberDiff.vue';
+import MkTagCloud from '@/components/MkTagCloud.vue';
 import { version, url } from '@/config';
 import number from '@/filters/number';
 import * as os from '@/os';
@@ -176,7 +176,7 @@ import { definePageMetadata } from '@/scripts/page-metadata';
 import 'chartjs-adapter-date-fns';
 import { defaultStore } from '@/store';
 import { useChartTooltip } from '@/scripts/use-chart-tooltip';
-import MkFileListForAdmin from '@/components/file-list-for-admin.vue';
+import MkFileListForAdmin from '@/components/MkFileListForAdmin.vue';
 
 Chart.register(
 	ArcElement,
diff --git a/packages/client/src/pages/admin/proxy-account.vue b/packages/client/src/pages/admin/proxy-account.vue
index 0951d26c2..71f35bf0f 100644
--- a/packages/client/src/pages/admin/proxy-account.vue
+++ b/packages/client/src/pages/admin/proxy-account.vue
@@ -15,7 +15,7 @@
 
 <script lang="ts" setup>
 import { } from 'vue';
-import MkKeyValue from '@/components/key-value.vue';
+import MkKeyValue from '@/components/MkKeyValue.vue';
 import FormButton from '@/components/ui/button.vue';
 import MkInfo from '@/components/ui/info.vue';
 import FormSuspense from '@/components/form/suspense.vue';
diff --git a/packages/client/src/pages/admin/users.vue b/packages/client/src/pages/admin/users.vue
index 6bc569f24..9cdb6d8be 100644
--- a/packages/client/src/pages/admin/users.vue
+++ b/packages/client/src/pages/admin/users.vue
@@ -62,7 +62,7 @@ import * as os from '@/os';
 import { lookupUser } from '@/scripts/lookup-user';
 import { i18n } from '@/i18n';
 import { definePageMetadata } from '@/scripts/page-metadata';
-import MkUserCardMini from '@/components/user-card-mini.vue';
+import MkUserCardMini from '@/components/MkUserCardMini.vue';
 
 let paginationComponent = $ref<InstanceType<typeof MkPagination>>();
 
diff --git a/packages/client/src/pages/antenna-timeline.vue b/packages/client/src/pages/antenna-timeline.vue
index 1865781a0..500cb3a7c 100644
--- a/packages/client/src/pages/antenna-timeline.vue
+++ b/packages/client/src/pages/antenna-timeline.vue
@@ -19,7 +19,7 @@
 
 <script lang="ts" setup>
 import { computed, inject, watch } from 'vue';
-import XTimeline from '@/components/timeline.vue';
+import XTimeline from '@/components/MkTimeline.vue';
 import { scroll } from '@/scripts/scroll';
 import * as os from '@/os';
 import { useRouter } from '@/router';
diff --git a/packages/client/src/pages/auth.vue b/packages/client/src/pages/auth.vue
index 9457cd6b2..bb55881a2 100644
--- a/packages/client/src/pages/auth.vue
+++ b/packages/client/src/pages/auth.vue
@@ -31,7 +31,7 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
 import XForm from './auth.form.vue';
-import MkSignin from '@/components/signin.vue';
+import MkSignin from '@/components/MkSignin.vue';
 import * as os from '@/os';
 import { login } from '@/account';
 
diff --git a/packages/client/src/pages/channel.vue b/packages/client/src/pages/channel.vue
index 4a3c97cda..04c302f4d 100644
--- a/packages/client/src/pages/channel.vue
+++ b/packages/client/src/pages/channel.vue
@@ -34,9 +34,9 @@
 <script lang="ts" setup>
 import { computed, inject, watch } from 'vue';
 import MkContainer from '@/components/ui/container.vue';
-import XPostForm from '@/components/post-form.vue';
-import XTimeline from '@/components/timeline.vue';
-import XChannelFollowButton from '@/components/channel-follow-button.vue';
+import XPostForm from '@/components/MkPostForm.vue';
+import XTimeline from '@/components/MkTimeline.vue';
+import XChannelFollowButton from '@/components/MkChannelFollowButton.vue';
 import * as os from '@/os';
 import { useRouter } from '@/router';
 import { $i } from '@/account';
diff --git a/packages/client/src/pages/channels.vue b/packages/client/src/pages/channels.vue
index 63612bc57..fbc17b689 100644
--- a/packages/client/src/pages/channels.vue
+++ b/packages/client/src/pages/channels.vue
@@ -24,7 +24,7 @@
 
 <script lang="ts" setup>
 import { computed, defineComponent, inject } from 'vue';
-import MkChannelPreview from '@/components/channel-preview.vue';
+import MkChannelPreview from '@/components/MkChannelPreview.vue';
 import MkPagination from '@/components/ui/pagination.vue';
 import MkButton from '@/components/ui/button.vue';
 import { useRouter } from '@/router';
diff --git a/packages/client/src/pages/clip.vue b/packages/client/src/pages/clip.vue
index 608e4ba7e..5b56651bd 100644
--- a/packages/client/src/pages/clip.vue
+++ b/packages/client/src/pages/clip.vue
@@ -21,7 +21,7 @@
 <script lang="ts" setup>
 import { computed, watch, provide } from 'vue';
 import * as misskey from 'misskey-js';
-import XNotes from '@/components/notes.vue';
+import XNotes from '@/components/MkNotes.vue';
 import { $i } from '@/account';
 import { i18n } from '@/i18n';
 import * as os from '@/os';
diff --git a/packages/client/src/pages/drive.vue b/packages/client/src/pages/drive.vue
index 988a1bf3d..088f0eacd 100644
--- a/packages/client/src/pages/drive.vue
+++ b/packages/client/src/pages/drive.vue
@@ -6,7 +6,7 @@
 
 <script lang="ts" setup>
 import { computed } from 'vue';
-import XDrive from '@/components/drive.vue';
+import XDrive from '@/components/MkDrive.vue';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
 import { definePageMetadata } from '@/scripts/page-metadata';
diff --git a/packages/client/src/pages/explore.featured.vue b/packages/client/src/pages/explore.featured.vue
index 0f32804b7..18a371a08 100644
--- a/packages/client/src/pages/explore.featured.vue
+++ b/packages/client/src/pages/explore.featured.vue
@@ -10,8 +10,8 @@
 </template>
 
 <script lang="ts" setup>
-import XNotes from '@/components/notes.vue';
-import MkTab from '@/components/tab.vue';
+import XNotes from '@/components/MkNotes.vue';
+import MkTab from '@/components/MkTab.vue';
 import { i18n } from '@/i18n';
 
 const paginationForNotes = {
diff --git a/packages/client/src/pages/explore.users.vue b/packages/client/src/pages/explore.users.vue
index ed5ee3b79..f25015620 100644
--- a/packages/client/src/pages/explore.users.vue
+++ b/packages/client/src/pages/explore.users.vue
@@ -59,9 +59,9 @@
 
 <script lang="ts" setup>
 import { computed, watch } from 'vue';
-import XUserList from '@/components/user-list.vue';
+import XUserList from '@/components/MkUserList.vue';
 import MkFolder from '@/components/ui/folder.vue';
-import MkTab from '@/components/tab.vue';
+import MkTab from '@/components/MkTab.vue';
 import number from '@/filters/number';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
diff --git a/packages/client/src/pages/explore.vue b/packages/client/src/pages/explore.vue
index 4725278ab..1fac32c03 100644
--- a/packages/client/src/pages/explore.vue
+++ b/packages/client/src/pages/explore.vue
@@ -41,7 +41,7 @@ import * as os from '@/os';
 import { definePageMetadata } from '@/scripts/page-metadata';
 import { i18n } from '@/i18n';
 import { instance } from '@/instance';
-import XUserList from '@/components/user-list.vue';
+import XUserList from '@/components/MkUserList.vue';
 
 const props = defineProps<{
 	tag?: string;
diff --git a/packages/client/src/pages/favorites.vue b/packages/client/src/pages/favorites.vue
index 203dc4a51..1501484cc 100644
--- a/packages/client/src/pages/favorites.vue
+++ b/packages/client/src/pages/favorites.vue
@@ -23,8 +23,8 @@
 <script lang="ts" setup>
 import { ref } from 'vue';
 import MkPagination from '@/components/ui/pagination.vue';
-import XNote from '@/components/note.vue';
-import XList from '@/components/date-separated-list.vue';
+import XNote from '@/components/MkNote.vue';
+import XList from '@/components/MkDateSeparatedList.vue';
 import { i18n } from '@/i18n';
 import { definePageMetadata } from '@/scripts/page-metadata';
 
diff --git a/packages/client/src/pages/gallery/index.vue b/packages/client/src/pages/gallery/index.vue
index fba8b96bd..1dfedb4a6 100644
--- a/packages/client/src/pages/gallery/index.vue
+++ b/packages/client/src/pages/gallery/index.vue
@@ -43,13 +43,13 @@
 
 <script lang="ts" setup>
 import { computed, defineComponent, watch } from 'vue';
-import XUserList from '@/components/user-list.vue';
+import XUserList from '@/components/MkUserList.vue';
 import MkFolder from '@/components/ui/folder.vue';
 import MkInput from '@/components/form/input.vue';
 import MkButton from '@/components/ui/button.vue';
-import MkTab from '@/components/tab.vue';
+import MkTab from '@/components/MkTab.vue';
 import MkPagination from '@/components/ui/pagination.vue';
-import MkGalleryPostPreview from '@/components/gallery-post-preview.vue';
+import MkGalleryPostPreview from '@/components/MkGalleryPostPreview.vue';
 import number from '@/filters/number';
 import * as os from '@/os';
 import { definePageMetadata } from '@/scripts/page-metadata';
diff --git a/packages/client/src/pages/gallery/post.vue b/packages/client/src/pages/gallery/post.vue
index a3a11d9a6..1e7a99716 100644
--- a/packages/client/src/pages/gallery/post.vue
+++ b/packages/client/src/pages/gallery/post.vue
@@ -59,10 +59,10 @@ import { computed, defineComponent, inject, watch } from 'vue';
 import MkButton from '@/components/ui/button.vue';
 import * as os from '@/os';
 import MkContainer from '@/components/ui/container.vue';
-import ImgWithBlurhash from '@/components/img-with-blurhash.vue';
+import ImgWithBlurhash from '@/components/MkImgWithBlurhash.vue';
 import MkPagination from '@/components/ui/pagination.vue';
-import MkGalleryPostPreview from '@/components/gallery-post-preview.vue';
-import MkFollowButton from '@/components/follow-button.vue';
+import MkGalleryPostPreview from '@/components/MkGalleryPostPreview.vue';
+import MkFollowButton from '@/components/MkFollowButton.vue';
 import { url } from '@/config';
 import { useRouter } from '@/router';
 import { i18n } from '@/i18n';
diff --git a/packages/client/src/pages/instance-info.vue b/packages/client/src/pages/instance-info.vue
index eaa9b2b31..a4d462f82 100644
--- a/packages/client/src/pages/instance-info.vue
+++ b/packages/client/src/pages/instance-info.vue
@@ -117,13 +117,13 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import * as misskey from 'misskey-js';
-import MkChart from '@/components/chart.vue';
-import MkObjectView from '@/components/object-view.vue';
+import MkChart from '@/components/MkChart.vue';
+import MkObjectView from '@/components/MkObjectView.vue';
 import FormLink from '@/components/form/link.vue';
-import MkLink from '@/components/link.vue';
+import MkLink from '@/components/MkLink.vue';
 import MkButton from '@/components/ui/button.vue';
 import FormSection from '@/components/form/section.vue';
-import MkKeyValue from '@/components/key-value.vue';
+import MkKeyValue from '@/components/MkKeyValue.vue';
 import MkSelect from '@/components/form/select.vue';
 import FormSwitch from '@/components/form/switch.vue';
 import * as os from '@/os';
@@ -132,7 +132,7 @@ import bytes from '@/filters/bytes';
 import { iAmModerator } from '@/account';
 import { definePageMetadata } from '@/scripts/page-metadata';
 import { i18n } from '@/i18n';
-import MkUserCardMini from '@/components/user-card-mini.vue';
+import MkUserCardMini from '@/components/MkUserCardMini.vue';
 import MkPagination from '@/components/ui/pagination.vue';
 
 const props = defineProps<{
diff --git a/packages/client/src/pages/messaging/messaging-room.message.vue b/packages/client/src/pages/messaging/messaging-room.message.vue
index 393d2a17b..2b5a9569a 100644
--- a/packages/client/src/pages/messaging/messaging-room.message.vue
+++ b/packages/client/src/pages/messaging/messaging-room.message.vue
@@ -40,7 +40,7 @@ import { } from 'vue';
 import * as mfm from 'mfm-js';
 import * as Misskey from 'misskey-js';
 import { extractUrlFromMfm } from '@/scripts/extract-url-from-mfm';
-import MkUrlPreview from '@/components/url-preview.vue';
+import MkUrlPreview from '@/components/MkUrlPreview.vue';
 import * as os from '@/os';
 import { $i } from '@/account';
 
diff --git a/packages/client/src/pages/messaging/messaging-room.vue b/packages/client/src/pages/messaging/messaging-room.vue
index fe1590b24..b91cba7ec 100644
--- a/packages/client/src/pages/messaging/messaging-room.vue
+++ b/packages/client/src/pages/messaging/messaging-room.vue
@@ -55,7 +55,7 @@ import * as Misskey from 'misskey-js';
 import * as Acct from 'misskey-js/built/acct';
 import XMessage from './messaging-room.message.vue';
 import XForm from './messaging-room.form.vue';
-import XList from '@/components/date-separated-list.vue';
+import XList from '@/components/MkDateSeparatedList.vue';
 import MkPagination, { Paging } from '@/components/ui/pagination.vue';
 import { isBottomVisible, onScrollBottom, scrollToBottom } from '@/scripts/scroll';
 import * as os from '@/os';
diff --git a/packages/client/src/pages/miauth.vue b/packages/client/src/pages/miauth.vue
index cbdf6b283..5a890c7b3 100644
--- a/packages/client/src/pages/miauth.vue
+++ b/packages/client/src/pages/miauth.vue
@@ -40,7 +40,7 @@
 
 <script lang="ts" setup>
 import { } from 'vue';
-import MkSignin from '@/components/signin.vue';
+import MkSignin from '@/components/MkSignin.vue';
 import MkButton from '@/components/ui/button.vue';
 import * as os from '@/os';
 import { $i, login } from '@/account';
diff --git a/packages/client/src/pages/my-lists/index.vue b/packages/client/src/pages/my-lists/index.vue
index 144cba684..7dc5b3e90 100644
--- a/packages/client/src/pages/my-lists/index.vue
+++ b/packages/client/src/pages/my-lists/index.vue
@@ -20,7 +20,7 @@
 import { } from 'vue';
 import MkPagination from '@/components/ui/pagination.vue';
 import MkButton from '@/components/ui/button.vue';
-import MkAvatars from '@/components/avatars.vue';
+import MkAvatars from '@/components/MkAvatars.vue';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
 import { definePageMetadata } from '@/scripts/page-metadata';
diff --git a/packages/client/src/pages/note.vue b/packages/client/src/pages/note.vue
index 240a0d4eb..ba05a7b88 100644
--- a/packages/client/src/pages/note.vue
+++ b/packages/client/src/pages/note.vue
@@ -43,10 +43,10 @@
 <script lang="ts" setup>
 import { computed, defineComponent, watch } from 'vue';
 import * as misskey from 'misskey-js';
-import XNote from '@/components/note.vue';
-import XNoteDetailed from '@/components/note-detailed.vue';
-import XNotes from '@/components/notes.vue';
-import MkRemoteCaution from '@/components/remote-caution.vue';
+import XNote from '@/components/MkNote.vue';
+import XNoteDetailed from '@/components/MkNoteDetailed.vue';
+import XNotes from '@/components/MkNotes.vue';
+import MkRemoteCaution from '@/components/MkRemoteCaution.vue';
 import MkButton from '@/components/ui/button.vue';
 import * as os from '@/os';
 import { definePageMetadata } from '@/scripts/page-metadata';
diff --git a/packages/client/src/pages/notifications.vue b/packages/client/src/pages/notifications.vue
index acf338c2c..dd57060fd 100644
--- a/packages/client/src/pages/notifications.vue
+++ b/packages/client/src/pages/notifications.vue
@@ -18,8 +18,8 @@
 <script lang="ts" setup>
 import { computed } from 'vue';
 import { notificationTypes } from 'misskey-js';
-import XNotifications from '@/components/notifications.vue';
-import XNotes from '@/components/notes.vue';
+import XNotifications from '@/components/MkNotifications.vue';
+import XNotes from '@/components/MkNotes.vue';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
 import { definePageMetadata } from '@/scripts/page-metadata';
diff --git a/packages/client/src/pages/page-editor/els/page-editor.el.image.vue b/packages/client/src/pages/page-editor/els/page-editor.el.image.vue
index b22bf1cb3..4d471e7b9 100644
--- a/packages/client/src/pages/page-editor/els/page-editor.el.image.vue
+++ b/packages/client/src/pages/page-editor/els/page-editor.el.image.vue
@@ -18,7 +18,7 @@
 /* eslint-disable vue/no-mutating-props */
 import { onMounted } from 'vue';
 import XContainer from '../page-editor.container.vue';
-import MkDriveFileThumbnail from '@/components/drive-file-thumbnail.vue';
+import MkDriveFileThumbnail from '@/components/MkDriveFileThumbnail.vue';
 import * as os from '@/os';
 
 const props = withDefaults(defineProps<{
diff --git a/packages/client/src/pages/page-editor/els/page-editor.el.note.vue b/packages/client/src/pages/page-editor/els/page-editor.el.note.vue
index 27f9f961f..5e494ee23 100644
--- a/packages/client/src/pages/page-editor/els/page-editor.el.note.vue
+++ b/packages/client/src/pages/page-editor/els/page-editor.el.note.vue
@@ -22,8 +22,8 @@ import { watch } from 'vue';
 import XContainer from '../page-editor.container.vue';
 import MkInput from '@/components/form/input.vue';
 import MkSwitch from '@/components/form/switch.vue';
-import XNote from '@/components/note.vue';
-import XNoteDetailed from '@/components/note-detailed.vue';
+import XNote from '@/components/MkNote.vue';
+import XNoteDetailed from '@/components/MkNoteDetailed.vue';
 import * as os from '@/os';
 
 const props = withDefaults(defineProps<{
diff --git a/packages/client/src/pages/page.vue b/packages/client/src/pages/page.vue
index 02fd61f58..48d62a954 100644
--- a/packages/client/src/pages/page.vue
+++ b/packages/client/src/pages/page.vue
@@ -68,10 +68,10 @@ import XPage from '@/components/page/page.vue';
 import MkButton from '@/components/ui/button.vue';
 import * as os from '@/os';
 import { url } from '@/config';
-import MkFollowButton from '@/components/follow-button.vue';
+import MkFollowButton from '@/components/MkFollowButton.vue';
 import MkContainer from '@/components/ui/container.vue';
 import MkPagination from '@/components/ui/pagination.vue';
-import MkPagePreview from '@/components/page-preview.vue';
+import MkPagePreview from '@/components/MkPagePreview.vue';
 import { i18n } from '@/i18n';
 import { definePageMetadata } from '@/scripts/page-metadata';
 
diff --git a/packages/client/src/pages/pages.vue b/packages/client/src/pages/pages.vue
index 62c675e41..6e71d9c83 100644
--- a/packages/client/src/pages/pages.vue
+++ b/packages/client/src/pages/pages.vue
@@ -26,7 +26,7 @@
 
 <script lang="ts" setup>
 import { computed, inject } from 'vue';
-import MkPagePreview from '@/components/page-preview.vue';
+import MkPagePreview from '@/components/MkPagePreview.vue';
 import MkPagination from '@/components/ui/pagination.vue';
 import MkButton from '@/components/ui/button.vue';
 import { useRouter } from '@/router';
diff --git a/packages/client/src/pages/preview.vue b/packages/client/src/pages/preview.vue
index 8f211081d..efbe53a52 100644
--- a/packages/client/src/pages/preview.vue
+++ b/packages/client/src/pages/preview.vue
@@ -6,7 +6,7 @@
 
 <script lang="ts" setup>
 import { computed } from 'vue';
-import MkSample from '@/components/sample.vue';
+import MkSample from '@/components/MkSample.vue';
 import { i18n } from '@/i18n';
 import { definePageMetadata } from '@/scripts/page-metadata';
 
diff --git a/packages/client/src/pages/registry.keys.vue b/packages/client/src/pages/registry.keys.vue
index ae500386d..372b5faa4 100644
--- a/packages/client/src/pages/registry.keys.vue
+++ b/packages/client/src/pages/registry.keys.vue
@@ -34,7 +34,7 @@ import { definePageMetadata } from '@/scripts/page-metadata';
 import FormLink from '@/components/form/link.vue';
 import FormSection from '@/components/form/section.vue';
 import MkButton from '@/components/ui/button.vue';
-import MkKeyValue from '@/components/key-value.vue';
+import MkKeyValue from '@/components/MkKeyValue.vue';
 import FormSplit from '@/components/form/split.vue';
 
 const props = defineProps<{
diff --git a/packages/client/src/pages/registry.value.vue b/packages/client/src/pages/registry.value.vue
index 562f9df88..9fac7f990 100644
--- a/packages/client/src/pages/registry.value.vue
+++ b/packages/client/src/pages/registry.value.vue
@@ -46,7 +46,7 @@ import { definePageMetadata } from '@/scripts/page-metadata';
 import FormLink from '@/components/form/link.vue';
 import FormSection from '@/components/form/section.vue';
 import MkButton from '@/components/ui/button.vue';
-import MkKeyValue from '@/components/key-value.vue';
+import MkKeyValue from '@/components/MkKeyValue.vue';
 import FormTextarea from '@/components/form/textarea.vue';
 import FormSplit from '@/components/form/split.vue';
 import FormInfo from '@/components/ui/info.vue';
diff --git a/packages/client/src/pages/reset-password.vue b/packages/client/src/pages/reset-password.vue
index 10c41f2d2..4c4cdb810 100644
--- a/packages/client/src/pages/reset-password.vue
+++ b/packages/client/src/pages/reset-password.vue
@@ -39,7 +39,7 @@ async function save() {
 
 onMounted(() => {
 	if (props.token == null) {
-		os.popup(defineAsyncComponent(() => import('@/components/forgot-password.vue')), {}, {}, 'closed');
+		os.popup(defineAsyncComponent(() => import('@/components/MkForgotPassword.vue')), {}, {}, 'closed');
 		mainRouter.push('/');
 	}
 });
diff --git a/packages/client/src/pages/search.vue b/packages/client/src/pages/search.vue
index 404b9e3db..fdcbb57e4 100644
--- a/packages/client/src/pages/search.vue
+++ b/packages/client/src/pages/search.vue
@@ -9,7 +9,7 @@
 
 <script lang="ts" setup>
 import { computed } from 'vue';
-import XNotes from '@/components/notes.vue';
+import XNotes from '@/components/MkNotes.vue';
 import { i18n } from '@/i18n';
 import { definePageMetadata } from '@/scripts/page-metadata';
 
diff --git a/packages/client/src/pages/settings/account-info.vue b/packages/client/src/pages/settings/account-info.vue
index 65b623369..93e65d55b 100644
--- a/packages/client/src/pages/settings/account-info.vue
+++ b/packages/client/src/pages/settings/account-info.vue
@@ -129,7 +129,7 @@
 <script lang="ts" setup>
 import { onMounted, ref } from 'vue';
 import FormSection from '@/components/form/section.vue';
-import MkKeyValue from '@/components/key-value.vue';
+import MkKeyValue from '@/components/MkKeyValue.vue';
 import * as os from '@/os';
 import number from '@/filters/number';
 import bytes from '@/filters/bytes';
diff --git a/packages/client/src/pages/settings/accounts.vue b/packages/client/src/pages/settings/accounts.vue
index d1e71c454..33a0fcc32 100644
--- a/packages/client/src/pages/settings/accounts.vue
+++ b/packages/client/src/pages/settings/accounts.vue
@@ -75,7 +75,7 @@ function removeAccount(account) {
 }
 
 function addExistingAccount() {
-	os.popup(defineAsyncComponent(() => import('@/components/signin-dialog.vue')), {}, {
+	os.popup(defineAsyncComponent(() => import('@/components/MkSigninDialog.vue')), {}, {
 		done: res => {
 			addAccounts(res.id, res.i);
 			os.success();
@@ -84,7 +84,7 @@ function addExistingAccount() {
 }
 
 function createAccount() {
-	os.popup(defineAsyncComponent(() => import('@/components/signup-dialog.vue')), {}, {
+	os.popup(defineAsyncComponent(() => import('@/components/MkSignupDialog.vue')), {}, {
 		done: res => {
 			addAccounts(res.id, res.i);
 			switchAccountWithToken(res.i);
diff --git a/packages/client/src/pages/settings/api.vue b/packages/client/src/pages/settings/api.vue
index b8a2dedb5..b0a787fc4 100644
--- a/packages/client/src/pages/settings/api.vue
+++ b/packages/client/src/pages/settings/api.vue
@@ -17,7 +17,7 @@ import { definePageMetadata } from '@/scripts/page-metadata';
 const isDesktop = ref(window.innerWidth >= 1100);
 
 function generateToken() {
-	os.popup(defineAsyncComponent(() => import('@/components/token-generate-window.vue')), {}, {
+	os.popup(defineAsyncComponent(() => import('@/components/MkTokenGenerateWindow.vue')), {}, {
 		done: async result => {
 			const { name, permissions } = result;
 			const { token } = await os.api('miauth/gen-token', {
diff --git a/packages/client/src/pages/settings/drive.vue b/packages/client/src/pages/settings/drive.vue
index c8c78f292..a10e2d9f7 100644
--- a/packages/client/src/pages/settings/drive.vue
+++ b/packages/client/src/pages/settings/drive.vue
@@ -49,12 +49,12 @@ import tinycolor from 'tinycolor2';
 import FormLink from '@/components/form/link.vue';
 import FormSwitch from '@/components/form/switch.vue';
 import FormSection from '@/components/form/section.vue';
-import MkKeyValue from '@/components/key-value.vue';
+import MkKeyValue from '@/components/MkKeyValue.vue';
 import FormSplit from '@/components/form/split.vue';
 import * as os from '@/os';
 import bytes from '@/filters/bytes';
 import { defaultStore } from '@/store';
-import MkChart from '@/components/chart.vue';
+import MkChart from '@/components/MkChart.vue';
 import { i18n } from '@/i18n';
 import { definePageMetadata } from '@/scripts/page-metadata';
 import { $i } from '@/account';
diff --git a/packages/client/src/pages/settings/general.vue b/packages/client/src/pages/settings/general.vue
index cd2bcc581..2710a41ec 100644
--- a/packages/client/src/pages/settings/general.vue
+++ b/packages/client/src/pages/settings/general.vue
@@ -100,7 +100,7 @@ import FormRadios from '@/components/form/radios.vue';
 import FormRange from '@/components/form/range.vue';
 import FormSection from '@/components/form/section.vue';
 import FormLink from '@/components/form/link.vue';
-import MkLink from '@/components/link.vue';
+import MkLink from '@/components/MkLink.vue';
 import { langs } from '@/config';
 import { defaultStore } from '@/store';
 import * as os from '@/os';
diff --git a/packages/client/src/pages/settings/mute-block.vue b/packages/client/src/pages/settings/mute-block.vue
index 495d52d4d..28c215a04 100644
--- a/packages/client/src/pages/settings/mute-block.vue
+++ b/packages/client/src/pages/settings/mute-block.vue
@@ -30,7 +30,7 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import MkPagination from '@/components/ui/pagination.vue';
-import MkTab from '@/components/tab.vue';
+import MkTab from '@/components/MkTab.vue';
 import FormInfo from '@/components/ui/info.vue';
 import FormLink from '@/components/form/link.vue';
 import { userPage } from '@/filters/user';
diff --git a/packages/client/src/pages/settings/notifications.vue b/packages/client/src/pages/settings/notifications.vue
index d2a363965..47c51e600 100644
--- a/packages/client/src/pages/settings/notifications.vue
+++ b/packages/client/src/pages/settings/notifications.vue
@@ -34,7 +34,7 @@ async function readAllNotifications() {
 
 function configure() {
 	const includingTypes = notificationTypes.filter(x => !$i!.mutingNotificationTypes.includes(x));
-	os.popup(defineAsyncComponent(() => import('@/components/notification-setting-window.vue')), {
+	os.popup(defineAsyncComponent(() => import('@/components/MkNotificationSettingWindow.vue')), {
 		includingTypes,
 		showGlobalToggle: false,
 	}, {
diff --git a/packages/client/src/pages/settings/plugin.install.vue b/packages/client/src/pages/settings/plugin.install.vue
index a4cab4b7a..4940f3b5f 100644
--- a/packages/client/src/pages/settings/plugin.install.vue
+++ b/packages/client/src/pages/settings/plugin.install.vue
@@ -79,7 +79,7 @@ async function install() {
 	}
 
 	const token = permissions == null || permissions.length === 0 ? null : await new Promise((res, rej) => {
-		os.popup(defineAsyncComponent(() => import('@/components/token-generate-window.vue')), {
+		os.popup(defineAsyncComponent(() => import('@/components/MkTokenGenerateWindow.vue')), {
 			title: i18n.ts.tokenRequested,
 			information: i18n.ts.pluginTokenRequestedDescription,
 			initialName: name,
diff --git a/packages/client/src/pages/settings/plugin.vue b/packages/client/src/pages/settings/plugin.vue
index 8e773b799..b557bd538 100644
--- a/packages/client/src/pages/settings/plugin.vue
+++ b/packages/client/src/pages/settings/plugin.vue
@@ -37,7 +37,7 @@ import FormLink from '@/components/form/link.vue';
 import FormSwitch from '@/components/form/switch.vue';
 import FormSection from '@/components/form/section.vue';
 import MkButton from '@/components/ui/button.vue';
-import MkKeyValue from '@/components/key-value.vue';
+import MkKeyValue from '@/components/MkKeyValue.vue';
 import * as os from '@/os';
 import { ColdDeviceStorage } from '@/store';
 import { unisonReload } from '@/scripts/unison-reload';
diff --git a/packages/client/src/pages/settings/reaction.vue b/packages/client/src/pages/settings/reaction.vue
index 170124eac..eae95c1e9 100644
--- a/packages/client/src/pages/settings/reaction.vue
+++ b/packages/client/src/pages/settings/reaction.vue
@@ -88,7 +88,7 @@ function remove(reaction, ev: MouseEvent) {
 }
 
 function preview(ev: MouseEvent) {
-	os.popup(defineAsyncComponent(() => import('@/components/emoji-picker-dialog.vue')), {
+	os.popup(defineAsyncComponent(() => import('@/components/MkEmojiPickerDialog.vue')), {
 		asReactionPicker: true,
 		src: ev.currentTarget ?? ev.target,
 	}, {}, 'closed');
diff --git a/packages/client/src/pages/settings/word-mute.vue b/packages/client/src/pages/settings/word-mute.vue
index 5fee7cd35..daa2a4804 100644
--- a/packages/client/src/pages/settings/word-mute.vue
+++ b/packages/client/src/pages/settings/word-mute.vue
@@ -31,10 +31,10 @@
 <script lang="ts" setup>
 import { ref, watch } from 'vue';
 import FormTextarea from '@/components/form/textarea.vue';
-import MkKeyValue from '@/components/key-value.vue';
+import MkKeyValue from '@/components/MkKeyValue.vue';
 import MkButton from '@/components/ui/button.vue';
 import MkInfo from '@/components/ui/info.vue';
-import MkTab from '@/components/tab.vue';
+import MkTab from '@/components/MkTab.vue';
 import * as os from '@/os';
 import number from '@/filters/number';
 import { defaultStore } from '@/store';
diff --git a/packages/client/src/pages/share.vue b/packages/client/src/pages/share.vue
index f4b6f66fa..d41a701a7 100644
--- a/packages/client/src/pages/share.vue
+++ b/packages/client/src/pages/share.vue
@@ -29,7 +29,7 @@ import { noteVisibilities } from 'misskey-js';
 import * as Acct from 'misskey-js/built/acct';
 import * as Misskey from 'misskey-js';
 import MkButton from '@/components/ui/button.vue';
-import XPostForm from '@/components/post-form.vue';
+import XPostForm from '@/components/MkPostForm.vue';
 import * as os from '@/os';
 import { mainRouter } from '@/router';
 import { definePageMetadata } from '@/scripts/page-metadata';
diff --git a/packages/client/src/pages/tag.vue b/packages/client/src/pages/tag.vue
index 950d26a72..5498c2999 100644
--- a/packages/client/src/pages/tag.vue
+++ b/packages/client/src/pages/tag.vue
@@ -9,7 +9,7 @@
 
 <script lang="ts" setup>
 import { computed } from 'vue';
-import XNotes from '@/components/notes.vue';
+import XNotes from '@/components/MkNotes.vue';
 import { definePageMetadata } from '@/scripts/page-metadata';
 
 const props = defineProps<{
diff --git a/packages/client/src/pages/timeline.vue b/packages/client/src/pages/timeline.vue
index 1c62964a5..9d4299702 100644
--- a/packages/client/src/pages/timeline.vue
+++ b/packages/client/src/pages/timeline.vue
@@ -23,8 +23,8 @@
 
 <script lang="ts" setup>
 import { defineAsyncComponent, computed, watch } from 'vue';
-import XTimeline from '@/components/timeline.vue';
-import XPostForm from '@/components/post-form.vue';
+import XTimeline from '@/components/MkTimeline.vue';
+import XPostForm from '@/components/MkPostForm.vue';
 import { scroll } from '@/scripts/scroll';
 import * as os from '@/os';
 import { defaultStore } from '@/store';
diff --git a/packages/client/src/pages/user-info.vue b/packages/client/src/pages/user-info.vue
index 9154c7348..316a3975c 100644
--- a/packages/client/src/pages/user-info.vue
+++ b/packages/client/src/pages/user-info.vue
@@ -154,8 +154,8 @@
 <script lang="ts" setup>
 import { computed, watch } from 'vue';
 import * as misskey from 'misskey-js';
-import MkChart from '@/components/chart.vue';
-import MkObjectView from '@/components/object-view.vue';
+import MkChart from '@/components/MkChart.vue';
+import MkObjectView from '@/components/MkObjectView.vue';
 import FormTextarea from '@/components/form/textarea.vue';
 import FormSwitch from '@/components/form/switch.vue';
 import FormLink from '@/components/form/link.vue';
@@ -164,10 +164,10 @@ import FormButton from '@/components/ui/button.vue';
 import FormInput from '@/components/form/input.vue';
 import FormSplit from '@/components/form/split.vue';
 import FormFolder from '@/components/form/folder.vue';
-import MkKeyValue from '@/components/key-value.vue';
+import MkKeyValue from '@/components/MkKeyValue.vue';
 import MkSelect from '@/components/form/select.vue';
 import FormSuspense from '@/components/form/suspense.vue';
-import MkFileListForAdmin from '@/components/file-list-for-admin.vue';
+import MkFileListForAdmin from '@/components/MkFileListForAdmin.vue';
 import MkInfo from '@/components/ui/info.vue';
 import * as os from '@/os';
 import number from '@/filters/number';
diff --git a/packages/client/src/pages/user-list-timeline.vue b/packages/client/src/pages/user-list-timeline.vue
index c1f4569a0..4a534e47b 100644
--- a/packages/client/src/pages/user-list-timeline.vue
+++ b/packages/client/src/pages/user-list-timeline.vue
@@ -19,7 +19,7 @@
 
 <script lang="ts" setup>
 import { computed, watch, inject } from 'vue';
-import XTimeline from '@/components/timeline.vue';
+import XTimeline from '@/components/MkTimeline.vue';
 import { scroll } from '@/scripts/scroll';
 import * as os from '@/os';
 import { useRouter } from '@/router';
diff --git a/packages/client/src/pages/user/follow-list.vue b/packages/client/src/pages/user/follow-list.vue
index e84b7ff57..6ee395f28 100644
--- a/packages/client/src/pages/user/follow-list.vue
+++ b/packages/client/src/pages/user/follow-list.vue
@@ -11,7 +11,7 @@
 <script lang="ts" setup>
 import { computed } from 'vue';
 import * as misskey from 'misskey-js';
-import MkUserInfo from '@/components/user-info.vue';
+import MkUserInfo from '@/components/MkUserInfo.vue';
 import MkPagination from '@/components/ui/pagination.vue';
 
 const props = defineProps<{
diff --git a/packages/client/src/pages/user/gallery.vue b/packages/client/src/pages/user/gallery.vue
index 6af28d455..786268497 100644
--- a/packages/client/src/pages/user/gallery.vue
+++ b/packages/client/src/pages/user/gallery.vue
@@ -11,7 +11,7 @@
 <script lang="ts" setup>
 import { computed } from 'vue';
 import * as misskey from 'misskey-js';
-import MkGalleryPostPreview from '@/components/gallery-post-preview.vue';
+import MkGalleryPostPreview from '@/components/MkGalleryPostPreview.vue';
 import MkPagination from '@/components/ui/pagination.vue';
 
 const props = withDefaults(defineProps<{
diff --git a/packages/client/src/pages/user/home.vue b/packages/client/src/pages/user/home.vue
index fa72a995b..7ab363efe 100644
--- a/packages/client/src/pages/user/home.vue
+++ b/packages/client/src/pages/user/home.vue
@@ -112,12 +112,12 @@ import { defineAsyncComponent, computed, inject, onMounted, onUnmounted, watch }
 import calcAge from 's-age';
 import * as misskey from 'misskey-js';
 import XUserTimeline from './index.timeline.vue';
-import XNote from '@/components/note.vue';
-import MkFollowButton from '@/components/follow-button.vue';
+import XNote from '@/components/MkNote.vue';
+import MkFollowButton from '@/components/MkFollowButton.vue';
 import MkContainer from '@/components/ui/container.vue';
 import MkFolder from '@/components/ui/folder.vue';
-import MkRemoteCaution from '@/components/remote-caution.vue';
-import MkTab from '@/components/tab.vue';
+import MkRemoteCaution from '@/components/MkRemoteCaution.vue';
+import MkTab from '@/components/MkTab.vue';
 import MkInfo from '@/components/ui/info.vue';
 import { getScrollPosition } from '@/scripts/scroll';
 import { getUserMenu } from '@/scripts/get-user-menu';
diff --git a/packages/client/src/pages/user/index.activity.vue b/packages/client/src/pages/user/index.activity.vue
index 8a7a86e0f..30e5a56f3 100644
--- a/packages/client/src/pages/user/index.activity.vue
+++ b/packages/client/src/pages/user/index.activity.vue
@@ -17,7 +17,7 @@
 import { } from 'vue';
 import * as misskey from 'misskey-js';
 import MkContainer from '@/components/ui/container.vue';
-import MkChart from '@/components/chart.vue';
+import MkChart from '@/components/MkChart.vue';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
 
diff --git a/packages/client/src/pages/user/index.photos.vue b/packages/client/src/pages/user/index.photos.vue
index 79dd1726e..2a58b49f6 100644
--- a/packages/client/src/pages/user/index.photos.vue
+++ b/packages/client/src/pages/user/index.photos.vue
@@ -23,7 +23,7 @@ import { getStaticImageUrl } from '@/scripts/get-static-image-url';
 import { notePage } from '@/filters/note';
 import * as os from '@/os';
 import MkContainer from '@/components/ui/container.vue';
-import ImgWithBlurhash from '@/components/img-with-blurhash.vue';
+import ImgWithBlurhash from '@/components/MkImgWithBlurhash.vue';
 
 export default defineComponent({
 	components: {
diff --git a/packages/client/src/pages/user/index.timeline.vue b/packages/client/src/pages/user/index.timeline.vue
index 0345978b8..41983a5ae 100644
--- a/packages/client/src/pages/user/index.timeline.vue
+++ b/packages/client/src/pages/user/index.timeline.vue
@@ -14,8 +14,8 @@
 <script lang="ts" setup>
 import { ref, computed } from 'vue';
 import * as misskey from 'misskey-js';
-import XNotes from '@/components/notes.vue';
-import MkTab from '@/components/tab.vue';
+import XNotes from '@/components/MkNotes.vue';
+import MkTab from '@/components/MkTab.vue';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
 
diff --git a/packages/client/src/pages/user/pages.vue b/packages/client/src/pages/user/pages.vue
index ad101158e..69bf926eb 100644
--- a/packages/client/src/pages/user/pages.vue
+++ b/packages/client/src/pages/user/pages.vue
@@ -9,7 +9,7 @@
 <script lang="ts" setup>
 import { computed } from 'vue';
 import * as misskey from 'misskey-js';
-import MkPagePreview from '@/components/page-preview.vue';
+import MkPagePreview from '@/components/MkPagePreview.vue';
 import MkPagination from '@/components/ui/pagination.vue';
 
 const props = defineProps<{
diff --git a/packages/client/src/pages/user/reactions.vue b/packages/client/src/pages/user/reactions.vue
index d2c1f92eb..f1e8f61b0 100644
--- a/packages/client/src/pages/user/reactions.vue
+++ b/packages/client/src/pages/user/reactions.vue
@@ -17,8 +17,8 @@
 import { computed } from 'vue';
 import * as misskey from 'misskey-js';
 import MkPagination from '@/components/ui/pagination.vue';
-import MkNote from '@/components/note.vue';
-import MkReactionIcon from '@/components/reaction-icon.vue';
+import MkNote from '@/components/MkNote.vue';
+import MkReactionIcon from '@/components/MkReactionIcon.vue';
 
 const props = defineProps<{
 	user: misskey.entities.User;
diff --git a/packages/client/src/pages/welcome.entrance.a.vue b/packages/client/src/pages/welcome.entrance.a.vue
index 240177c9d..6452280f5 100644
--- a/packages/client/src/pages/welcome.entrance.a.vue
+++ b/packages/client/src/pages/welcome.entrance.a.vue
@@ -49,12 +49,12 @@
 import { } from 'vue';
 import { toUnicode } from 'punycode/';
 import XTimeline from './welcome.timeline.vue';
-import MarqueeText from '@/components/marquee.vue';
-import XSigninDialog from '@/components/signin-dialog.vue';
-import XSignupDialog from '@/components/signup-dialog.vue';
+import MarqueeText from '@/components/MkMarquee.vue';
+import XSigninDialog from '@/components/MkSigninDialog.vue';
+import XSignupDialog from '@/components/MkSignupDialog.vue';
 import MkButton from '@/components/ui/button.vue';
-import XNote from '@/components/note.vue';
-import MkFeaturedPhotos from '@/components/featured-photos.vue';
+import XNote from '@/components/MkNote.vue';
+import MkFeaturedPhotos from '@/components/MkFeaturedPhotos.vue';
 import { host, instanceName } from '@/config';
 import * as os from '@/os';
 import number from '@/filters/number';
diff --git a/packages/client/src/pages/welcome.entrance.b.vue b/packages/client/src/pages/welcome.entrance.b.vue
index 344dc9aed..46cf8c228 100644
--- a/packages/client/src/pages/welcome.entrance.b.vue
+++ b/packages/client/src/pages/welcome.entrance.b.vue
@@ -38,11 +38,11 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
 import { toUnicode } from 'punycode/';
-import XSigninDialog from '@/components/signin-dialog.vue';
-import XSignupDialog from '@/components/signup-dialog.vue';
+import XSigninDialog from '@/components/MkSigninDialog.vue';
+import XSignupDialog from '@/components/MkSignupDialog.vue';
 import MkButton from '@/components/ui/button.vue';
-import XNote from '@/components/note.vue';
-import MkFeaturedPhotos from '@/components/featured-photos.vue';
+import XNote from '@/components/MkNote.vue';
+import MkFeaturedPhotos from '@/components/MkFeaturedPhotos.vue';
 import XTimeline from './welcome.timeline.vue';
 import { host, instanceName } from '@/config';
 import * as os from '@/os';
diff --git a/packages/client/src/pages/welcome.entrance.c.vue b/packages/client/src/pages/welcome.entrance.c.vue
index d583c5df3..6422d2923 100644
--- a/packages/client/src/pages/welcome.entrance.c.vue
+++ b/packages/client/src/pages/welcome.entrance.c.vue
@@ -58,11 +58,11 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
 import { toUnicode } from 'punycode/';
-import XSigninDialog from '@/components/signin-dialog.vue';
-import XSignupDialog from '@/components/signup-dialog.vue';
+import XSigninDialog from '@/components/MkSigninDialog.vue';
+import XSignupDialog from '@/components/MkSignupDialog.vue';
 import MkButton from '@/components/ui/button.vue';
-import XNote from '@/components/note.vue';
-import MkFeaturedPhotos from '@/components/featured-photos.vue';
+import XNote from '@/components/MkNote.vue';
+import MkFeaturedPhotos from '@/components/MkFeaturedPhotos.vue';
 import XTimeline from './welcome.timeline.vue';
 import { host, instanceName } from '@/config';
 import * as os from '@/os';
diff --git a/packages/client/src/pages/welcome.timeline.vue b/packages/client/src/pages/welcome.timeline.vue
index bec9481ff..e19ebac3e 100644
--- a/packages/client/src/pages/welcome.timeline.vue
+++ b/packages/client/src/pages/welcome.timeline.vue
@@ -23,9 +23,9 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue';
-import XReactionsViewer from '@/components/reactions-viewer.vue';
-import XMediaList from '@/components/media-list.vue';
-import XPoll from '@/components/poll.vue';
+import XReactionsViewer from '@/components/MkReactionsViewer.vue';
+import XMediaList from '@/components/MkMediaList.vue';
+import XPoll from '@/components/MkPoll.vue';
 import * as os from '@/os';
 
 export default defineComponent({
diff --git a/packages/client/src/scripts/autocomplete.ts b/packages/client/src/scripts/autocomplete.ts
index 3ef622417..206724de9 100644
--- a/packages/client/src/scripts/autocomplete.ts
+++ b/packages/client/src/scripts/autocomplete.ts
@@ -157,7 +157,7 @@ export class Autocomplete {
 			const _y = ref(y);
 			const _q = ref(q);
 
-			const { dispose } = await popup(defineAsyncComponent(() => import('@/components/autocomplete.vue')), {
+			const { dispose } = await popup(defineAsyncComponent(() => import('@/components/MkAutocomplete.vue')), {
 				textarea: this.textarea,
 				close: this.close,
 				type: type,
diff --git a/packages/client/src/scripts/get-note-menu.ts b/packages/client/src/scripts/get-note-menu.ts
index 632143f51..a5cf98206 100644
--- a/packages/client/src/scripts/get-note-menu.ts
+++ b/packages/client/src/scripts/get-note-menu.ts
@@ -289,7 +289,7 @@ export function getNoteMenu(props: {
 					text: i18n.ts.reportAbuse,
 					action: () => {
 						const u = appearNote.url || appearNote.uri || `${url}/notes/${appearNote.id}`;
-						os.popup(defineAsyncComponent(() => import('@/components/abuse-report-window.vue')), {
+						os.popup(defineAsyncComponent(() => import('@/components/MkAbuseReportWindow.vue')), {
 							user: appearNote.user,
 							initialComment: `Note: ${u}\n-----\n`,
 						}, {}, 'closed');
diff --git a/packages/client/src/scripts/get-user-menu.ts b/packages/client/src/scripts/get-user-menu.ts
index c609fddd5..4a5a2d42f 100644
--- a/packages/client/src/scripts/get-user-menu.ts
+++ b/packages/client/src/scripts/get-user-menu.ts
@@ -129,7 +129,7 @@ export function getUserMenu(user, router: Router = mainRouter) {
 	}
 
 	function reportAbuse() {
-		os.popup(defineAsyncComponent(() => import('@/components/abuse-report-window.vue')), {
+		os.popup(defineAsyncComponent(() => import('@/components/MkAbuseReportWindow.vue')), {
 			user: user,
 		}, {}, 'closed');
 	}
diff --git a/packages/client/src/scripts/please-login.ts b/packages/client/src/scripts/please-login.ts
index 1f3806184..3323968f7 100644
--- a/packages/client/src/scripts/please-login.ts
+++ b/packages/client/src/scripts/please-login.ts
@@ -6,7 +6,7 @@ import { popup } from '@/os';
 export function pleaseLogin(path?: string) {
 	if ($i) return;
 
-	popup(defineAsyncComponent(() => import('@/components/signin-dialog.vue')), {
+	popup(defineAsyncComponent(() => import('@/components/MkSigninDialog.vue')), {
 		autoSet: true,
 		message: i18n.ts.signinRequired
 	}, {
diff --git a/packages/client/src/scripts/reaction-picker.ts b/packages/client/src/scripts/reaction-picker.ts
index b7699cae4..a6d0940a4 100644
--- a/packages/client/src/scripts/reaction-picker.ts
+++ b/packages/client/src/scripts/reaction-picker.ts
@@ -12,7 +12,7 @@ class ReactionPicker {
 	}
 
 	public async init() {
-		await popup(defineAsyncComponent(() => import('@/components/emoji-picker-dialog.vue')), {
+		await popup(defineAsyncComponent(() => import('@/components/MkEmojiPickerDialog.vue')), {
 			src: this.src,
 			asReactionPicker: true,
 			manualShowing: this.manualShowing
diff --git a/packages/client/src/scripts/use-chart-tooltip.ts b/packages/client/src/scripts/use-chart-tooltip.ts
index ab5716569..91c27585f 100644
--- a/packages/client/src/scripts/use-chart-tooltip.ts
+++ b/packages/client/src/scripts/use-chart-tooltip.ts
@@ -1,6 +1,6 @@
 import { onUnmounted, ref } from 'vue';
 import * as os from '@/os';
-import MkChartTooltip from '@/components/chart-tooltip.vue';
+import MkChartTooltip from '@/components/MkChartTooltip.vue';
 
 export function useChartTooltip() {
 	const tooltipShowing = ref(false);
diff --git a/packages/client/src/ui/_common_/common.vue b/packages/client/src/ui/_common_/common.vue
index f32cd3fe0..1ea59dd26 100644
--- a/packages/client/src/ui/_common_/common.vue
+++ b/packages/client/src/ui/_common_/common.vue
@@ -38,7 +38,7 @@ const onNotification = notification => {
 			id: notification.id,
 		});
 
-		popup(defineAsyncComponent(() => import('@/components/notification-toast.vue')), {
+		popup(defineAsyncComponent(() => import('@/components/MkNotificationToast.vue')), {
 			notification,
 		}, {}, 'closed');
 	}
diff --git a/packages/client/src/ui/_common_/navbar-for-mobile.vue b/packages/client/src/ui/_common_/navbar-for-mobile.vue
index 2bac239d4..de000447a 100644
--- a/packages/client/src/ui/_common_/navbar-for-mobile.vue
+++ b/packages/client/src/ui/_common_/navbar-for-mobile.vue
@@ -123,7 +123,7 @@ function openInstanceMenu(ev: MouseEvent) {
 }
 
 function more() {
-	os.popup(defineAsyncComponent(() => import('@/components/launch-pad.vue')), {}, {
+	os.popup(defineAsyncComponent(() => import('@/components/MkLaunchPad.vue')), {}, {
 	}, 'closed');
 }
 </script>
diff --git a/packages/client/src/ui/_common_/navbar.vue b/packages/client/src/ui/_common_/navbar.vue
index 30837ed28..0c46e8941 100644
--- a/packages/client/src/ui/_common_/navbar.vue
+++ b/packages/client/src/ui/_common_/navbar.vue
@@ -146,7 +146,7 @@ function openInstanceMenu(ev: MouseEvent) {
 }
 
 function more(ev: MouseEvent) {
-	os.popup(defineAsyncComponent(() => import('@/components/launch-pad.vue')), {
+	os.popup(defineAsyncComponent(() => import('@/components/MkLaunchPad.vue')), {
 		src: ev.currentTarget ?? ev.target,
 	}, {
 	}, 'closed');
diff --git a/packages/client/src/ui/_common_/statusbar-federation.vue b/packages/client/src/ui/_common_/statusbar-federation.vue
index 7cf6b1f97..7d4f0d616 100644
--- a/packages/client/src/ui/_common_/statusbar-federation.vue
+++ b/packages/client/src/ui/_common_/statusbar-federation.vue
@@ -22,7 +22,7 @@
 <script lang="ts" setup>
 import { computed, defineAsyncComponent, ref, toRef, watch } from 'vue';
 import * as misskey from 'misskey-js';
-import MarqueeText from '@/components/marquee.vue';
+import MarqueeText from '@/components/MkMarquee.vue';
 import * as os from '@/os';
 import { useInterval } from '@/scripts/use-interval';
 import { getNoteSummary } from '@/scripts/get-note-summary';
diff --git a/packages/client/src/ui/_common_/statusbar-rss.vue b/packages/client/src/ui/_common_/statusbar-rss.vue
index 635b875ca..e75e13bb4 100644
--- a/packages/client/src/ui/_common_/statusbar-rss.vue
+++ b/packages/client/src/ui/_common_/statusbar-rss.vue
@@ -17,7 +17,7 @@
 
 <script lang="ts" setup>
 import { computed, defineAsyncComponent, ref, toRef, watch } from 'vue';
-import MarqueeText from '@/components/marquee.vue';
+import MarqueeText from '@/components/MkMarquee.vue';
 import * as os from '@/os';
 import { useInterval } from '@/scripts/use-interval';
 import { shuffle } from '@/scripts/shuffle';
diff --git a/packages/client/src/ui/_common_/statusbar-user-list.vue b/packages/client/src/ui/_common_/statusbar-user-list.vue
index 490c8a096..f4d989c38 100644
--- a/packages/client/src/ui/_common_/statusbar-user-list.vue
+++ b/packages/client/src/ui/_common_/statusbar-user-list.vue
@@ -22,7 +22,7 @@
 <script lang="ts" setup>
 import { computed, defineAsyncComponent, ref, toRef, watch } from 'vue';
 import * as misskey from 'misskey-js';
-import MarqueeText from '@/components/marquee.vue';
+import MarqueeText from '@/components/MkMarquee.vue';
 import * as os from '@/os';
 import { useInterval } from '@/scripts/use-interval';
 import { getNoteSummary } from '@/scripts/get-note-summary';
diff --git a/packages/client/src/ui/classic.header.vue b/packages/client/src/ui/classic.header.vue
index 131767c0e..34248486c 100644
--- a/packages/client/src/ui/classic.header.vue
+++ b/packages/client/src/ui/classic.header.vue
@@ -101,7 +101,7 @@ export default defineComponent({
 		},
 
 		more(ev) {
-			os.popup(defineAsyncComponent(() => import('@/components/launch-pad.vue')), {
+			os.popup(defineAsyncComponent(() => import('@/components/MkLaunchPad.vue')), {
 				src: ev.currentTarget ?? ev.target,
 				anchor: { x: 'center', y: 'bottom' },
 			}, {
diff --git a/packages/client/src/ui/classic.sidebar.vue b/packages/client/src/ui/classic.sidebar.vue
index 172401f42..3d15f5fcb 100644
--- a/packages/client/src/ui/classic.sidebar.vue
+++ b/packages/client/src/ui/classic.sidebar.vue
@@ -121,7 +121,7 @@ export default defineComponent({
 		},
 
 		more(ev) {
-			os.popup(defineAsyncComponent(() => import('@/components/launch-pad.vue')), {
+			os.popup(defineAsyncComponent(() => import('@/components/MkLaunchPad.vue')), {
 				src: ev.currentTarget ?? ev.target,
 			}, {}, 'closed');
 		},
diff --git a/packages/client/src/ui/classic.widgets.vue b/packages/client/src/ui/classic.widgets.vue
index 6f9d18bde..ca8e3f4db 100644
--- a/packages/client/src/ui/classic.widgets.vue
+++ b/packages/client/src/ui/classic.widgets.vue
@@ -10,7 +10,7 @@
 
 <script lang="ts">
 import { defineComponent, defineAsyncComponent } from 'vue';
-import XWidgets from '@/components/widgets.vue';
+import XWidgets from '@/components/MkWidgets.vue';
 
 export default defineComponent({
 	components: {
diff --git a/packages/client/src/ui/deck/antenna-column.vue b/packages/client/src/ui/deck/antenna-column.vue
index 6268c357e..df9539617 100644
--- a/packages/client/src/ui/deck/antenna-column.vue
+++ b/packages/client/src/ui/deck/antenna-column.vue
@@ -12,7 +12,7 @@
 import { onMounted } from 'vue';
 import XColumn from './column.vue';
 import { updateColumn, Column } from './deck-store';
-import XTimeline from '@/components/timeline.vue';
+import XTimeline from '@/components/MkTimeline.vue';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
 
diff --git a/packages/client/src/ui/deck/direct-column.vue b/packages/client/src/ui/deck/direct-column.vue
index 4837c0ce3..104f781b3 100644
--- a/packages/client/src/ui/deck/direct-column.vue
+++ b/packages/client/src/ui/deck/direct-column.vue
@@ -9,7 +9,7 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import XColumn from './column.vue';
-import XNotes from '@/components/notes.vue';
+import XNotes from '@/components/MkNotes.vue';
 import { Column } from './deck-store';
 
 defineProps<{
diff --git a/packages/client/src/ui/deck/list-column.vue b/packages/client/src/ui/deck/list-column.vue
index 6fbb9f0e6..9a1fb5b44 100644
--- a/packages/client/src/ui/deck/list-column.vue
+++ b/packages/client/src/ui/deck/list-column.vue
@@ -12,7 +12,7 @@
 import { } from 'vue';
 import XColumn from './column.vue';
 import { updateColumn, Column } from './deck-store';
-import XTimeline from '@/components/timeline.vue';
+import XTimeline from '@/components/MkTimeline.vue';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
 
diff --git a/packages/client/src/ui/deck/mentions-column.vue b/packages/client/src/ui/deck/mentions-column.vue
index 0b6ca3a23..18055215d 100644
--- a/packages/client/src/ui/deck/mentions-column.vue
+++ b/packages/client/src/ui/deck/mentions-column.vue
@@ -9,7 +9,7 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import XColumn from './column.vue';
-import XNotes from '@/components/notes.vue';
+import XNotes from '@/components/MkNotes.vue';
 import { Column } from './deck-store';
 
 defineProps<{
diff --git a/packages/client/src/ui/deck/notifications-column.vue b/packages/client/src/ui/deck/notifications-column.vue
index 34132f2e9..b02118ee5 100644
--- a/packages/client/src/ui/deck/notifications-column.vue
+++ b/packages/client/src/ui/deck/notifications-column.vue
@@ -10,7 +10,7 @@
 import { defineAsyncComponent } from 'vue';
 import XColumn from './column.vue';
 import { updateColumn , Column } from './deck-store';
-import XNotifications from '@/components/notifications.vue';
+import XNotifications from '@/components/MkNotifications.vue';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
 
@@ -24,7 +24,7 @@ const emit = defineEmits<{
 }>();
 
 function func() {
-	os.popup(defineAsyncComponent(() => import('@/components/notification-setting-window.vue')), {
+	os.popup(defineAsyncComponent(() => import('@/components/MkNotificationSettingWindow.vue')), {
 		includingTypes: props.column.includingTypes,
 	}, {
 		done: async (res) => {
diff --git a/packages/client/src/ui/deck/tl-column.vue b/packages/client/src/ui/deck/tl-column.vue
index 6ea8e1a8a..a6e4ec5d5 100644
--- a/packages/client/src/ui/deck/tl-column.vue
+++ b/packages/client/src/ui/deck/tl-column.vue
@@ -23,7 +23,7 @@
 import { onMounted } from 'vue';
 import XColumn from './column.vue';
 import { removeColumn, updateColumn, Column } from './deck-store';
-import XTimeline from '@/components/timeline.vue';
+import XTimeline from '@/components/MkTimeline.vue';
 import * as os from '@/os';
 import { $i } from '@/account';
 import { instance } from '@/instance';
diff --git a/packages/client/src/ui/deck/widgets-column.vue b/packages/client/src/ui/deck/widgets-column.vue
index 3661dda59..2c97009b3 100644
--- a/packages/client/src/ui/deck/widgets-column.vue
+++ b/packages/client/src/ui/deck/widgets-column.vue
@@ -13,7 +13,7 @@
 import { } from 'vue';
 import XColumn from './column.vue';
 import { addColumnWidget, Column, removeColumnWidget, setColumnWidgets, updateColumnWidget } from './deck-store';
-import XWidgets from '@/components/widgets.vue';
+import XWidgets from '@/components/MkWidgets.vue';
 import { i18n } from '@/i18n';
 
 const props = defineProps<{
diff --git a/packages/client/src/ui/universal.widgets.vue b/packages/client/src/ui/universal.widgets.vue
index 7aed08388..179f8a6ba 100644
--- a/packages/client/src/ui/universal.widgets.vue
+++ b/packages/client/src/ui/universal.widgets.vue
@@ -9,7 +9,7 @@
 
 <script lang="ts" setup>
 import { onMounted } from 'vue';
-import XWidgets from '@/components/widgets.vue';
+import XWidgets from '@/components/MkWidgets.vue';
 import { i18n } from '@/i18n';
 import { defaultStore } from '@/store';
 
diff --git a/packages/client/src/ui/visitor/b.vue b/packages/client/src/ui/visitor/b.vue
index 09be12d68..07f105374 100644
--- a/packages/client/src/ui/visitor/b.vue
+++ b/packages/client/src/ui/visitor/b.vue
@@ -53,8 +53,8 @@ import { host, instanceName } from '@/config';
 import { search } from '@/scripts/search';
 import * as os from '@/os';
 import MkPagination from '@/components/ui/pagination.vue';
-import XSigninDialog from '@/components/signin-dialog.vue';
-import XSignupDialog from '@/components/signup-dialog.vue';
+import XSigninDialog from '@/components/MkSigninDialog.vue';
+import XSignupDialog from '@/components/MkSignupDialog.vue';
 import MkButton from '@/components/ui/button.vue';
 import { ColdDeviceStorage, defaultStore } from '@/store';
 import { mainRouter } from '@/router';
diff --git a/packages/client/src/ui/visitor/header.vue b/packages/client/src/ui/visitor/header.vue
index c39dc6577..e2b903485 100644
--- a/packages/client/src/ui/visitor/header.vue
+++ b/packages/client/src/ui/visitor/header.vue
@@ -41,8 +41,8 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue';
-import XSigninDialog from '@/components/signin-dialog.vue';
-import XSignupDialog from '@/components/signup-dialog.vue';
+import XSigninDialog from '@/components/MkSigninDialog.vue';
+import XSignupDialog from '@/components/MkSignupDialog.vue';
 import * as os from '@/os';
 import { search } from '@/scripts/search';
 
diff --git a/packages/client/src/ui/visitor/kanban.vue b/packages/client/src/ui/visitor/kanban.vue
index 44b555725..30c2fbc6c 100644
--- a/packages/client/src/ui/visitor/kanban.vue
+++ b/packages/client/src/ui/visitor/kanban.vue
@@ -42,8 +42,8 @@ import { defineComponent, defineAsyncComponent } from 'vue';
 import { host, instanceName } from '@/config';
 import * as os from '@/os';
 import MkPagination from '@/components/ui/pagination.vue';
-import XSigninDialog from '@/components/signin-dialog.vue';
-import XSignupDialog from '@/components/signup-dialog.vue';
+import XSigninDialog from '@/components/MkSigninDialog.vue';
+import XSignupDialog from '@/components/MkSignupDialog.vue';
 import MkButton from '@/components/ui/button.vue';
 
 export default defineComponent({
diff --git a/packages/client/src/widgets/clock.vue b/packages/client/src/widgets/clock.vue
index 7d78b05f8..660a1f0ec 100644
--- a/packages/client/src/widgets/clock.vue
+++ b/packages/client/src/widgets/clock.vue
@@ -21,8 +21,8 @@ import { } from 'vue';
 import { useWidgetPropsManager, Widget, WidgetComponentEmits, WidgetComponentExpose, WidgetComponentProps } from './widget';
 import { GetFormResultType } from '@/scripts/form';
 import MkContainer from '@/components/ui/container.vue';
-import MkAnalogClock from '@/components/analog-clock.vue';
-import MkDigitalClock from '@/components/digital-clock.vue';
+import MkAnalogClock from '@/components/MkAnalogClock.vue';
+import MkDigitalClock from '@/components/MkDigitalClock.vue';
 import { timezones } from '@/scripts/timezones';
 import { i18n } from '@/i18n';
 
diff --git a/packages/client/src/widgets/digital-clock.vue b/packages/client/src/widgets/digital-clock.vue
index 387fad9b6..d2bfd523f 100644
--- a/packages/client/src/widgets/digital-clock.vue
+++ b/packages/client/src/widgets/digital-clock.vue
@@ -13,7 +13,7 @@ import { onUnmounted, ref, watch } from 'vue';
 import { useWidgetPropsManager, Widget, WidgetComponentEmits, WidgetComponentExpose, WidgetComponentProps } from './widget';
 import { GetFormResultType } from '@/scripts/form';
 import { timezones } from '@/scripts/timezones';
-import MkDigitalClock from '@/components/digital-clock.vue';
+import MkDigitalClock from '@/components/MkDigitalClock.vue';
 
 const name = 'digitalClock';
 
diff --git a/packages/client/src/widgets/federation.vue b/packages/client/src/widgets/federation.vue
index 9619aa53e..ec46a0ccb 100644
--- a/packages/client/src/widgets/federation.vue
+++ b/packages/client/src/widgets/federation.vue
@@ -23,7 +23,7 @@ import { onMounted, onUnmounted, ref } from 'vue';
 import { useWidgetPropsManager, Widget, WidgetComponentEmits, WidgetComponentExpose, WidgetComponentProps } from './widget';
 import { GetFormResultType } from '@/scripts/form';
 import MkContainer from '@/components/ui/container.vue';
-import MkMiniChart from '@/components/mini-chart.vue';
+import MkMiniChart from '@/components/MkMiniChart.vue';
 import * as os from '@/os';
 import { useInterval } from '@/scripts/use-interval';
 import { i18n } from '@/i18n';
diff --git a/packages/client/src/widgets/instance-cloud.vue b/packages/client/src/widgets/instance-cloud.vue
index 597ce0e82..03fda4c74 100644
--- a/packages/client/src/widgets/instance-cloud.vue
+++ b/packages/client/src/widgets/instance-cloud.vue
@@ -17,7 +17,7 @@ import { } from 'vue';
 import { useWidgetPropsManager, Widget, WidgetComponentEmits, WidgetComponentExpose, WidgetComponentProps } from './widget';
 import { GetFormResultType } from '@/scripts/form';
 import MkContainer from '@/components/ui/container.vue';
-import MkTagCloud from '@/components/tag-cloud.vue';
+import MkTagCloud from '@/components/MkTagCloud.vue';
 import * as os from '@/os';
 import { useInterval } from '@/scripts/use-interval';
 
diff --git a/packages/client/src/widgets/notifications.vue b/packages/client/src/widgets/notifications.vue
index 05b24e5cb..a46b7e739 100644
--- a/packages/client/src/widgets/notifications.vue
+++ b/packages/client/src/widgets/notifications.vue
@@ -14,7 +14,7 @@ import { defineAsyncComponent } from 'vue';
 import { useWidgetPropsManager, Widget, WidgetComponentEmits, WidgetComponentExpose, WidgetComponentProps } from './widget';
 import { GetFormResultType } from '@/scripts/form';
 import MkContainer from '@/components/ui/container.vue';
-import XNotifications from '@/components/notifications.vue';
+import XNotifications from '@/components/MkNotifications.vue';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
 
@@ -51,7 +51,7 @@ const { widgetProps, configure, save } = useWidgetPropsManager(name,
 );
 
 const configureNotification = () => {
-	os.popup(defineAsyncComponent(() => import('@/components/notification-setting-window.vue')), {
+	os.popup(defineAsyncComponent(() => import('@/components/MkNotificationSettingWindow.vue')), {
 		includingTypes: widgetProps.includingTypes,
 	}, {
 		done: async (res) => {
diff --git a/packages/client/src/widgets/post-form.vue b/packages/client/src/widgets/post-form.vue
index b54291335..f1708775b 100644
--- a/packages/client/src/widgets/post-form.vue
+++ b/packages/client/src/widgets/post-form.vue
@@ -6,7 +6,7 @@
 import { } from 'vue';
 import { GetFormResultType } from '@/scripts/form';
 import { useWidgetPropsManager, Widget, WidgetComponentEmits, WidgetComponentExpose, WidgetComponentProps } from './widget';
-import XPostForm from '@/components/post-form.vue';
+import XPostForm from '@/components/MkPostForm.vue';
 
 const name = 'postForm';
 
diff --git a/packages/client/src/widgets/rss-ticker.vue b/packages/client/src/widgets/rss-ticker.vue
index c692c0c4f..6e5924b6b 100644
--- a/packages/client/src/widgets/rss-ticker.vue
+++ b/packages/client/src/widgets/rss-ticker.vue
@@ -21,7 +21,7 @@
 <script lang="ts" setup>
 import { onMounted, onUnmounted, ref, watch } from 'vue';
 import { useWidgetPropsManager, Widget, WidgetComponentEmits, WidgetComponentExpose, WidgetComponentProps } from './widget';
-import MarqueeText from '@/components/marquee.vue';
+import MarqueeText from '@/components/MkMarquee.vue';
 import { GetFormResultType } from '@/scripts/form';
 import * as os from '@/os';
 import MkContainer from '@/components/ui/container.vue';
diff --git a/packages/client/src/widgets/timeline.vue b/packages/client/src/widgets/timeline.vue
index 3bcad1ae2..5042632cf 100644
--- a/packages/client/src/widgets/timeline.vue
+++ b/packages/client/src/widgets/timeline.vue
@@ -25,7 +25,7 @@ import { GetFormResultType } from '@/scripts/form';
 import { useWidgetPropsManager, Widget, WidgetComponentEmits, WidgetComponentExpose, WidgetComponentProps } from './widget';
 import * as os from '@/os';
 import MkContainer from '@/components/ui/container.vue';
-import XTimeline from '@/components/timeline.vue';
+import XTimeline from '@/components/MkTimeline.vue';
 import { $i } from '@/account';
 import { i18n } from '@/i18n';
 
diff --git a/packages/client/src/widgets/trends.vue b/packages/client/src/widgets/trends.vue
index 8d11b69cb..53ae4019d 100644
--- a/packages/client/src/widgets/trends.vue
+++ b/packages/client/src/widgets/trends.vue
@@ -22,7 +22,7 @@ import { onMounted, onUnmounted, ref } from 'vue';
 import { useWidgetPropsManager, Widget, WidgetComponentEmits, WidgetComponentExpose, WidgetComponentProps } from './widget';
 import { GetFormResultType } from '@/scripts/form';
 import MkContainer from '@/components/ui/container.vue';
-import MkMiniChart from '@/components/mini-chart.vue';
+import MkMiniChart from '@/components/MkMiniChart.vue';
 import * as os from '@/os';
 import { useInterval } from '@/scripts/use-interval';
 import { i18n } from '@/i18n';

From 268597fca97f51dc4a29ae0828126236b4afdb17 Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Wed, 31 Aug 2022 02:19:25 +0900
Subject: [PATCH 2/6] enhance(client): improve analog-clock

---
 packages/client/src/components/MkAnalogClock.vue | 12 +++++++++---
 packages/client/src/widgets/clock.vue            | 12 ++++++++++++
 2 files changed, 21 insertions(+), 3 deletions(-)

diff --git a/packages/client/src/components/MkAnalogClock.vue b/packages/client/src/components/MkAnalogClock.vue
index b709a2254..40ef626ae 100644
--- a/packages/client/src/components/MkAnalogClock.vue
+++ b/packages/client/src/components/MkAnalogClock.vue
@@ -40,7 +40,7 @@
 
 	<line
 		class="s"
-		:class="{ animate: !disableSAnimate }"
+		:class="{ animate: !disableSAnimate && sAnimation !== 'none', elastic: sAnimation === 'elastic', easeOut: sAnimation === 'easeOut' }"
 		:x1="5 - (0 * (sHandLengthRatio * handsTailLength))"
 		:y1="5 + (1 * (sHandLengthRatio * handsTailLength))"
 		:x2="5 + (0 * ((sHandLengthRatio * 5) - handsPadding))"
@@ -99,6 +99,7 @@ const props = withDefaults(defineProps<{
 	twentyfour?: boolean;
 	graduations?: 'none' | 'dots' | 'numbers';
 	fadeGraduations?: boolean;
+	sAnimation?: 'none' | 'elastic' | 'easeOut';
 }>(), {
 	numbers: false,
 	thickness: 0.1,
@@ -106,6 +107,7 @@ const props = withDefaults(defineProps<{
 	twentyfour: false,
 	graduations: 'dots',
 	fadeGraduations: true,
+	sAnimation: 'elastic',
 });
 
 const graduationsMajor = computed(() => {
@@ -161,7 +163,7 @@ function tick() {
 					disableSAnimate = false;
 				}, 100);
 			}, 100);
-		}, 500);
+		}, 700);
 	} else {
 		sAngle = Math.PI * s / 30;
 	}
@@ -211,9 +213,13 @@ onBeforeUnmount(() => {
 		will-change: transform;
 		transform-origin: 50% 50%;
 
-		&.animate {
+		&.animate.elastic {
 			transition: transform .2s cubic-bezier(.4,2.08,.55,.44);
 		}
+
+		&.animate.easeOut {
+			transition: transform .7s cubic-bezier(0,.7,.3,1);
+		}
 	}
 }
 </style>
diff --git a/packages/client/src/widgets/clock.vue b/packages/client/src/widgets/clock.vue
index 660a1f0ec..51d48b30a 100644
--- a/packages/client/src/widgets/clock.vue
+++ b/packages/client/src/widgets/clock.vue
@@ -9,6 +9,7 @@
 			:graduations="widgetProps.graduations"
 			:fade-graduations="widgetProps.fadeGraduations"
 			:twentyfour="widgetProps.twentyFour"
+			:s-animation="widgetProps.sAnimation"
 		/>
 		<MkDigitalClock v-if="widgetProps.label === 'time' || widgetProps.label === 'timeAndTz'" class="_monospace label c time" :show-s="false" :offset="tzOffset"/>
 		<div v-if="widgetProps.label === 'tz' || widgetProps.label === 'timeAndTz'" class="_monospace label d offset">{{ tzOffsetLabel }}</div>
@@ -70,6 +71,17 @@ const widgetPropsDef = {
 		type: 'boolean' as const,
 		default: true,
 	},
+	sAnimation: {
+		type: 'radio' as const,
+		default: 'elastic',
+		options: [{
+			value: 'none', label: 'None',
+		}, {
+			value: 'elastic', label: 'Elastic',
+		}, {
+			value: 'easeOut', label: 'Ease out',
+		}],
+	},
 	twentyFour: {
 		type: 'boolean' as const,
 		default: false,

From 9439c91ad2e178db5e64065a60fa55ef586ff35b Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Wed, 31 Aug 2022 18:24:39 +0900
Subject: [PATCH 3/6] Update .gitignore

---
 .gitignore | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/.gitignore b/.gitignore
index 9928d93aa..189f36370 100644
--- a/.gitignore
+++ b/.gitignore
@@ -13,6 +13,9 @@ report.*.json
 cypress/screenshots
 cypress/videos
 
+# Coverage
+coverage
+
 # config
 /.config/*
 !/.config/example.yml

From 5af31338924650e75da30a26bba52ee7edaa85f6 Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Wed, 31 Aug 2022 23:12:22 +0900
Subject: [PATCH 4/6] refactor(client): use setup syntax

---
 .../src/components/MkGalleryPostPreview.vue   |  21 +--
 .../client/src/components/global/MkAd.vue     | 154 ++++++++----------
 .../client/src/components/global/MkUrl.vue    |  65 +++-----
 packages/client/src/components/ui/hr.vue      |  17 --
 packages/client/src/pages/user/clips.vue      |  44 ++---
 5 files changed, 110 insertions(+), 191 deletions(-)
 delete mode 100644 packages/client/src/components/ui/hr.vue

diff --git a/packages/client/src/components/MkGalleryPostPreview.vue b/packages/client/src/components/MkGalleryPostPreview.vue
index cef9b2a39..a133f6431 100644
--- a/packages/client/src/components/MkGalleryPostPreview.vue
+++ b/packages/client/src/components/MkGalleryPostPreview.vue
@@ -14,26 +14,15 @@
 </MkA>
 </template>
 
-<script lang="ts">
-import { defineComponent } from 'vue';
+<script lang="ts" setup>
+import { } from 'vue';
 import { userName } from '@/filters/user';
 import ImgWithBlurhash from '@/components/MkImgWithBlurhash.vue';
 import * as os from '@/os';
 
-export default defineComponent({
-	components: {
-		ImgWithBlurhash,
-	},
-	props: {
-		post: {
-			type: Object,
-			required: true,
-		},
-	},
-	methods: {
-		userName,
-	},
-});
+const props = defineProps<{
+	post: any;
+}>();
 </script>
 
 <style lang="scss" scoped>
diff --git a/packages/client/src/components/global/MkAd.vue b/packages/client/src/components/global/MkAd.vue
index 7725f776a..e1b7ae6af 100644
--- a/packages/client/src/components/global/MkAd.vue
+++ b/packages/client/src/components/global/MkAd.vue
@@ -1,8 +1,8 @@
 <template>
-<div v-if="ad" class="qiivuoyo">
-	<div v-if="!showMenu" class="main" :class="ad.place">
-		<a :href="ad.url" target="_blank">
-			<img :src="ad.imageUrl">
+<div v-if="chosen" class="qiivuoyo">
+	<div v-if="!showMenu" class="main" :class="chosen.place">
+		<a :href="chosen.url" target="_blank">
+			<img :src="chosen.imageUrl">
 			<button class="_button menu" @click.prevent.stop="toggleMenu"><span class="fas fa-info-circle info-circle"></span></button>
 		</a>
 	</div>
@@ -10,7 +10,7 @@
 		<div class="body">
 			<div>Ads by {{ host }}</div>
 			<!--<MkButton class="button" primary>{{ $ts._ad.like }}</MkButton>-->
-			<MkButton v-if="ad.ratio !== 0" class="button" @click="reduceFrequency">{{ $ts._ad.reduceFrequencyOfThisAd }}</MkButton>
+			<MkButton v-if="chosen.ratio !== 0" class="button" @click="reduceFrequency">{{ $ts._ad.reduceFrequencyOfThisAd }}</MkButton>
 			<button class="_textButton" @click="toggleMenu">{{ $ts._ad.back }}</button>
 		</div>
 	</div>
@@ -18,98 +18,78 @@
 <div v-else></div>
 </template>
 
-<script lang="ts">
-import { defineComponent, ref } from 'vue';
+<script lang="ts" setup>
+import { ref } from 'vue';
 import { instance } from '@/instance';
 import { host } from '@/config';
 import MkButton from '@/components/ui/button.vue';
 import { defaultStore } from '@/store';
 import * as os from '@/os';
 
-export default defineComponent({
-	components: {
-		MkButton
-	},
+type Ad = (typeof instance)['ads'][number];
 
-	props: {
-		prefer: {
-			type: Array,
-			required: true
-		},
-		specify: {
-			type: Object,
-			required: false
-		},
-	},
+const props = defineProps<{
+	prefer: string[];
+	specify?: Ad;
+}>();
 
-	setup(props) {
-		const showMenu = ref(false);
-		const toggleMenu = () => {
-			showMenu.value = !showMenu.value;
-		};
+const showMenu = ref(false);
+const toggleMenu = (): void => {
+	showMenu.value = !showMenu.value;
+};
 
-		const choseAd = (): (typeof instance)['ads'][number] | null => {
-			if (props.specify) {
-				return props.specify as (typeof instance)['ads'][number];
-			}
-
-			const allAds = instance.ads.map(ad => defaultStore.state.mutedAds.includes(ad.id) ? {
-				...ad,
-				ratio: 0
-			} : ad);
-
-			let ads = allAds.filter(ad => props.prefer.includes(ad.place));
-
-			if (ads.length === 0) {
-				ads = allAds.filter(ad => ad.place === 'square');
-			}
-
-			const lowPriorityAds = ads.filter(ad => ad.ratio === 0);
-			ads = ads.filter(ad => ad.ratio !== 0);
-
-			if (ads.length === 0) {
-				if (lowPriorityAds.length !== 0) {
-					return lowPriorityAds[Math.floor(Math.random() * lowPriorityAds.length)];
-				} else {
-					return null;
-				}
-			}
-
-			const totalFactor = ads.reduce((a, b) => a + b.ratio, 0);
-			const r = Math.random() * totalFactor;
-
-			let stackedFactor = 0;
-			for (const ad of ads) {
-				if (r >= stackedFactor && r <= stackedFactor + ad.ratio) {
-					return ad;
-				} else {
-					stackedFactor += ad.ratio;
-				}
-			}
-
-			return null;
-		};
-
-		const chosen = ref(choseAd());
-
-		const reduceFrequency = () => {
-			if (chosen.value == null) return;
-			if (defaultStore.state.mutedAds.includes(chosen.value.id)) return;
-			defaultStore.push('mutedAds', chosen.value.id);
-			os.success();
-			chosen.value = choseAd();
-			showMenu.value = false;
-		};
-
-		return {
-			ad: chosen,
-			showMenu,
-			toggleMenu,
-			host,
-			reduceFrequency,
-		};
+const choseAd = (): Ad | null => {
+	if (props.specify) {
+		return props.specify;
 	}
-});
+
+	const allAds = instance.ads.map(ad => defaultStore.state.mutedAds.includes(ad.id) ? {
+		...ad,
+		ratio: 0,
+	} : ad);
+
+	let ads = allAds.filter(ad => props.prefer.includes(ad.place));
+
+	if (ads.length === 0) {
+		ads = allAds.filter(ad => ad.place === 'square');
+	}
+
+	const lowPriorityAds = ads.filter(ad => ad.ratio === 0);
+	ads = ads.filter(ad => ad.ratio !== 0);
+
+	if (ads.length === 0) {
+		if (lowPriorityAds.length !== 0) {
+			return lowPriorityAds[Math.floor(Math.random() * lowPriorityAds.length)];
+		} else {
+			return null;
+		}
+	}
+
+	const totalFactor = ads.reduce((a, b) => a + b.ratio, 0);
+	const r = Math.random() * totalFactor;
+
+	let stackedFactor = 0;
+	for (const ad of ads) {
+		if (r >= stackedFactor && r <= stackedFactor + ad.ratio) {
+			return ad;
+		} else {
+			stackedFactor += ad.ratio;
+		}
+	}
+
+	return null;
+};
+
+const chosen = ref(choseAd());
+
+function reduceFrequency(): void {
+	if (chosen.value == null) return;
+	if (defaultStore.state.mutedAds.includes(chosen.value.id)) return;
+	defaultStore.push('mutedAds', chosen.value.id);
+	os.success();
+	chosen.value = choseAd();
+	showMenu.value = false;
+}
 </script>
 
 <style lang="scss" scoped>
diff --git a/packages/client/src/components/global/MkUrl.vue b/packages/client/src/components/global/MkUrl.vue
index d002727d5..37c0212ea 100644
--- a/packages/client/src/components/global/MkUrl.vue
+++ b/packages/client/src/components/global/MkUrl.vue
@@ -18,54 +18,39 @@
 </component>
 </template>
 
-<script lang="ts">
-import { defineAsyncComponent, defineComponent, ref } from 'vue';
+<script lang="ts" setup>
+import { defineAsyncComponent, ref } from 'vue';
 import { toUnicode as decodePunycode } from 'punycode/';
 import { url as local } from '@/config';
 import * as os from '@/os';
 import { useTooltip } from '@/scripts/use-tooltip';
 import { safeURIDecode } from '@/scripts/safe-uri-decode';
 
-export default defineComponent({
-	props: {
-		url: {
-			type: String,
-			required: true,
-		},
-		rel: {
-			type: String,
-			required: false,
-			default: null,
-		},
-	},
-	setup(props) {
-		const self = props.url.startsWith(local);
-		const url = new URL(props.url);
-		const el = ref();
-		
-		useTooltip(el, (showing) => {
-			os.popup(defineAsyncComponent(() => import('@/components/MkUrlPreviewPopup.vue')), {
-				showing,
-				url: props.url,
-				source: el.value,
-			}, {}, 'closed');
-		});
+const props = defineProps<{
+	url: string;
+	rel?: string;
+}>();
 
-		return {
-			local,
-			schema: url.protocol,
-			hostname: decodePunycode(url.hostname),
-			port: url.port,
-			pathname: safeURIDecode(url.pathname),
-			query: safeURIDecode(url.search),
-			hash: safeURIDecode(url.hash),
-			self: self,
-			attr: self ? 'to' : 'href',
-			target: self ? null : '_blank',
-			el,
-		};
-	},
+const self = props.url.startsWith(local);
+const url = new URL(props.url);
+const el = ref();
+
+useTooltip(el, (showing) => {
+	os.popup(defineAsyncComponent(() => import('@/components/MkUrlPreviewPopup.vue')), {
+		showing,
+		url: props.url,
+		source: el.value,
+	}, {}, 'closed');
 });
+
+const schema = url.protocol;
+const hostname = decodePunycode(url.hostname);
+const port = url.port;
+const pathname = safeURIDecode(url.pathname);
+const query = safeURIDecode(url.search);
+const hash = safeURIDecode(url.hash);
+const attr = self ? 'to' : 'href';
+const target = self ? null : '_blank';
 </script>
 
 <style lang="scss" scoped>
diff --git a/packages/client/src/components/ui/hr.vue b/packages/client/src/components/ui/hr.vue
deleted file mode 100644
index 0cb5b4887..000000000
--- a/packages/client/src/components/ui/hr.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<template>
-<div class="evrzpitu"></div>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue';
-import * as os from '@/os';
-
-export default defineComponent({});
-</script>
-
-<style lang="scss" scoped>
-.evrzpitu
-	margin 16px 0
-	border-bottom solid var(--lineWidth) var(--faceDivider)
-
-</style>
diff --git a/packages/client/src/pages/user/clips.vue b/packages/client/src/pages/user/clips.vue
index 870e6f717..f3fafc693 100644
--- a/packages/client/src/pages/user/clips.vue
+++ b/packages/client/src/pages/user/clips.vue
@@ -9,40 +9,22 @@
 </div>
 </template>
 
-<script lang="ts">
-import { defineComponent } from 'vue';
+<script lang="ts" setup>
+import { computed } from 'vue';
+import * as misskey from 'misskey-js';
 import MkPagination from '@/components/ui/pagination.vue';
 
-export default defineComponent({
-	components: {
-		MkPagination,
-	},
+const props = defineProps<{
+	user: misskey.entities.User;
+}>();
 
-	props: {
-		user: {
-			type: Object,
-			required: true
-		},
-	},
-
-	data() {
-		return {
-			pagination: {
-				endpoint: 'users/clips' as const,
-				limit: 20,
-				params: {
-					userId: this.user.id,
-				}
-			},
-		};
-	},
-
-	watch: {
-		user() {
-			this.$refs.list.reload();
-		}
-	},
-});
+const pagination = {
+	endpoint: 'users/clips' as const,
+	limit: 20,
+	params: computed(() => ({
+		userId: props.user.id,
+	})),
+};
 </script>
 
 <style lang="scss" scoped>

From be526e7424919d76dbaa637a02eb138096fb366c Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Fri, 2 Sep 2022 00:22:31 +0900
Subject: [PATCH 5/6] refactor(client): use setup syntax

---
 packages/client/src/components/MkRipple.vue | 99 ++++++++++-----------
 packages/client/src/pages/follow.vue        | 93 +++++++++----------
 packages/client/src/ui/deck/tl-column.vue   | 16 ----
 3 files changed, 90 insertions(+), 118 deletions(-)

diff --git a/packages/client/src/components/MkRipple.vue b/packages/client/src/components/MkRipple.vue
index 401e78e30..9d93211d5 100644
--- a/packages/client/src/components/MkRipple.vue
+++ b/packages/client/src/components/MkRipple.vue
@@ -1,8 +1,9 @@
 <template>
-<div class="vswabwbm" :style="{ zIndex, top: `${y - 64}px`, left: `${x - 64}px` }" :class="{ active }">
+<div class="vswabwbm" :style="{ zIndex, top: `${y - 64}px`, left: `${x - 64}px` }">
 	<svg width="128" height="128" viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
 		<circle fill="none" cx="64" cy="64">
-			<animate attributeName="r"
+			<animate
+				attributeName="r"
 				begin="0s" dur="0.5s"
 				values="4; 32"
 				calcMode="spline"
@@ -10,7 +11,8 @@
 				keySplines="0.165, 0.84, 0.44, 1"
 				repeatCount="1"
 			/>
-			<animate attributeName="stroke-width"
+			<animate
+				attributeName="stroke-width"
 				begin="0s" dur="0.5s"
 				values="16; 0"
 				calcMode="spline"
@@ -21,7 +23,8 @@
 		</circle>
 		<g fill="none" fill-rule="evenodd">
 			<circle v-for="(particle, i) in particles" :key="i" :fill="particle.color">
-				<animate attributeName="r"
+				<animate
+					attributeName="r"
 					begin="0s" dur="0.8s"
 					:values="`${particle.size}; 0`"
 					calcMode="spline"
@@ -29,7 +32,8 @@
 					keySplines="0.165, 0.84, 0.44, 1"
 					repeatCount="1"
 				/>
-				<animate attributeName="cx"
+				<animate
+					attributeName="cx"
 					begin="0s" dur="0.8s"
 					:values="`${particle.xA}; ${particle.xB}`"
 					calcMode="spline"
@@ -37,7 +41,8 @@
 					keySplines="0.3, 0.61, 0.355, 1"
 					repeatCount="1"
 				/>
-				<animate attributeName="cy"
+				<animate
+					attributeName="cy"
 					begin="0s" dur="0.8s"
 					:values="`${particle.yA}; ${particle.yB}`"
 					calcMode="spline"
@@ -51,59 +56,47 @@
 </div>
 </template>
 
-<script lang="ts">
-import { defineComponent, onMounted } from 'vue';
+<script lang="ts" setup>
+import { onMounted } from 'vue';
 import * as os from '@/os';
 
-export default defineComponent({
-	props: {
-		x: {
-			type: Number,
-			required: true
-		},
-		y: {
-			type: Number,
-			required: true
-		},
-		particle: {
-			type: Boolean,
-			required: false,
-			default: true,
-		}
-	},
-	emits: ['end'],
-	setup(props, context) {
-		const particles = [];
-		const origin = 64;
-		const colors = ['#FF1493', '#00FFFF', '#FFE202'];
+const props = withDefaults(defineProps<{
+	x: number;
+	y: number;
+	particle?: boolean;
+}>(), {
+	particle: true,
+});
 
-		if (props.particle) {
-			for (let i = 0; i < 12; i++) {
-				const angle = Math.random() * (Math.PI * 2);
-				const pos = Math.random() * 16;
-				const velocity = 16 + (Math.random() * 48);
-				particles.push({
-					size: 4 + (Math.random() * 8),
-					xA: origin + (Math.sin(angle) * pos),
-					yA: origin + (Math.cos(angle) * pos),
-					xB: origin + (Math.sin(angle) * (pos + velocity)),
-					yB: origin + (Math.cos(angle) * (pos + velocity)),
-					color: colors[Math.floor(Math.random() * colors.length)]
-				});
-			}
-		}
+const emit = defineEmits<{
+	(ev: 'end'): void;
+}>();
 
-		onMounted(() => {
-			window.setTimeout(() => {
-				context.emit('end');
-			}, 1100);
+const particles = [];
+const origin = 64;
+const colors = ['#FF1493', '#00FFFF', '#FFE202'];
+const zIndex = os.claimZIndex('high');
+
+if (props.particle) {
+	for (let i = 0; i < 12; i++) {
+		const angle = Math.random() * (Math.PI * 2);
+		const pos = Math.random() * 16;
+		const velocity = 16 + (Math.random() * 48);
+		particles.push({
+			size: 4 + (Math.random() * 8),
+			xA: origin + (Math.sin(angle) * pos),
+			yA: origin + (Math.cos(angle) * pos),
+			xB: origin + (Math.sin(angle) * (pos + velocity)),
+			yB: origin + (Math.cos(angle) * (pos + velocity)),
+			color: colors[Math.floor(Math.random() * colors.length)],
 		});
+	}
+}
 
-		return {
-			particles,
-			zIndex: os.claimZIndex('high'),
-		};
-	},
+onMounted(() => {
+	window.setTimeout(() => {
+		emit('end');
+	}, 1100);
 });
 </script>
 
diff --git a/packages/client/src/pages/follow.vue b/packages/client/src/pages/follow.vue
index 0c1cb7733..f44d355aa 100644
--- a/packages/client/src/pages/follow.vue
+++ b/packages/client/src/pages/follow.vue
@@ -3,63 +3,58 @@
 </div>
 </template>
 
-<script lang="ts">
-import { defineComponent } from 'vue';
+<script lang="ts" setup>
+import { } from 'vue';
 import * as Acct from 'misskey-js/built/acct';
 import * as os from '@/os';
 import { mainRouter } from '@/router';
+import { i18n } from '@/i18n';
 
-export default defineComponent({
-	created() {
-		const acct = new URL(location.href).searchParams.get('acct');
-		if (acct == null) return;
+async function follow(user): Promise<void> {
+	const { canceled } = await os.confirm({
+		type: 'question',
+		text: i18n.t('followConfirm', { name: user.name || user.username }),
+	});
 
-		let promise;
+	if (canceled) {
+		window.close();
+		return;
+	}
+	
+	os.apiWithDialog('following/create', {
+		userId: user.id,
+	});
+}
 
-		if (acct.startsWith('https://')) {
-			promise = os.api('ap/show', {
-				uri: acct,
-			});
-			promise.then(res => {
-				if (res.type === 'User') {
-					this.follow(res.object);
-				} else if (res.type === 'Note') {
-					mainRouter.push(`/notes/${res.object.id}`);
-				} else {
-					os.alert({
-						type: 'error',
-						text: 'Not a user',
-					}).then(() => {
-						window.close();
-					});
-				}
-			});
+const acct = new URL(location.href).searchParams.get('acct');
+if (acct == null) return;
+
+let promise;
+
+if (acct.startsWith('https://')) {
+	promise = os.api('ap/show', {
+		uri: acct,
+	});
+	promise.then(res => {
+		if (res.type === 'User') {
+			follow(res.object);
+		} else if (res.type === 'Note') {
+			mainRouter.push(`/notes/${res.object.id}`);
 		} else {
-			promise = os.api('users/show', Acct.parse(acct));
-			promise.then(user => {
-				this.follow(user);
+			os.alert({
+				type: 'error',
+				text: 'Not a user',
+			}).then(() => {
+				window.close();
 			});
 		}
+	});
+} else {
+	promise = os.api('users/show', Acct.parse(acct));
+	promise.then(user => {
+		follow(user);
+	});
+}
 
-		os.promiseDialog(promise, null, null, this.$ts.fetchingAsApObject);
-	},
-
-	methods: {
-		async follow(user) {
-			const { canceled } = await os.confirm({
-				type: 'question',
-				text: this.$t('followConfirm', { name: user.name || user.username }),
-			});
-
-			if (canceled) {
-				window.close();
-				return;
-			}
-			
-			os.apiWithDialog('following/create', {
-				userId: user.id,
-			});
-		},
-	},
-});
+os.promiseDialog(promise, null, null, i18n.ts.fetchingAsApObject);
 </script>
diff --git a/packages/client/src/ui/deck/tl-column.vue b/packages/client/src/ui/deck/tl-column.vue
index a6e4ec5d5..e64ed852b 100644
--- a/packages/client/src/ui/deck/tl-column.vue
+++ b/packages/client/src/ui/deck/tl-column.vue
@@ -102,22 +102,6 @@ const menu = [{
 	text: i18n.ts.timeline,
 	action: setType,
 }];
-
-/*
-export default defineComponent({
-	watch: {
-		mediaOnly() {
-			(this.$refs.timeline as any).reload();
-		}
-	},
-
-	methods: {
-		focus() {
-			(this.$refs.timeline as any).focus();
-		}
-	}
-});
-*/
 </script>
 
 <style lang="scss" scoped>

From 4aa2257fed7de63f7e3d50d87c0edd62ffad0b01 Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Sat, 3 Sep 2022 16:16:00 +0900
Subject: [PATCH 6/6] fix(client): fix syntax error of pages/follow.vue

---
 packages/client/src/pages/follow.vue | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/client/src/pages/follow.vue b/packages/client/src/pages/follow.vue
index f44d355aa..828246d67 100644
--- a/packages/client/src/pages/follow.vue
+++ b/packages/client/src/pages/follow.vue
@@ -27,7 +27,9 @@ async function follow(user): Promise<void> {
 }
 
 const acct = new URL(location.href).searchParams.get('acct');
-if (acct == null) return;
+if (acct == null) {
+	throw new Error('acct required');
+}
 
 let promise;