diff --git a/src/boot/after_store.js b/src/boot/after_store.js index a3d8701e5..8e008aef2 100644 --- a/src/boot/after_store.js +++ b/src/boot/after_store.js @@ -6,6 +6,10 @@ import { createRouter, createWebHistory } from 'vue-router' import VueVirtualScroller from 'vue-virtual-scroller' import 'vue-virtual-scroller/dist/vue-virtual-scroller.css' +import Status from 'src/components/status/status.vue' +import RichContent from 'src/components/rich_content/rich_content.jsx' +import StillImage from 'src/components/still-image/still-image.vue' + import { config } from '@fortawesome/fontawesome-svg-core' import { FontAwesomeIcon, @@ -611,6 +615,9 @@ const afterStoreSetup = async ({ pinia, store, storageError, i18n }) => { app.component('FAIcon', FontAwesomeIcon) app.component('FALayers', FontAwesomeLayers) + app.component('Status', Status) + app.component('RichContent', RichContent) + app.component('StillImage', StillImage) // remove after vue 3.3 app.config.unwrapInjectedRef = true diff --git a/src/components/announcement/announcement.js b/src/components/announcement/announcement.js index 13d55c159..b6621264c 100644 --- a/src/components/announcement/announcement.js +++ b/src/components/announcement/announcement.js @@ -2,14 +2,14 @@ import { mapState } from 'vuex' import localeService from '../../services/locale/locale.service.js' import AnnouncementEditor from '../announcement_editor/announcement_editor.vue' -import RichContent from '../rich_content/rich_content.jsx' + import { useAnnouncementsStore } from 'src/stores/announcements.js' const Announcement = { components: { AnnouncementEditor, - RichContent, + }, data() { return { diff --git a/src/components/attachment/attachment.js b/src/components/attachment/attachment.js index 1aaee85a1..da776bf33 100644 --- a/src/components/attachment/attachment.js +++ b/src/components/attachment/attachment.js @@ -3,7 +3,7 @@ import { defineAsyncComponent } from 'vue' import nsfwImage from '../../assets/nsfw.png' import Popover from '../popover/popover.vue' -import StillImage from '../still-image/still-image.vue' + import VideoAttachment from '../video_attachment/video_attachment.vue' import { useInstanceStore } from 'src/stores/instance.js' @@ -69,10 +69,12 @@ const Attachment = { } }, components: { - Flash: defineAsyncComponent(() => import('src/components/flash/flash.vue')), - StillImage, + Flash: defineAsyncComponent( + () => import( 'src/components/flash/flash.vue'), + ), + VideoAttachment: defineAsyncComponent( - () => import('src/components/video_attachment/video_attachment.vue'), + () => import( 'src/components/video_attachment/video_attachment.vue'), ), Popover, }, diff --git a/src/components/basic_user_card/basic_user_card.js b/src/components/basic_user_card/basic_user_card.js index 722d459f3..964c60c56 100644 --- a/src/components/basic_user_card/basic_user_card.js +++ b/src/components/basic_user_card/basic_user_card.js @@ -1,4 +1,4 @@ -import RichContent from 'src/components/rich_content/rich_content.jsx' + import UserAvatar from '../user_avatar/user_avatar.vue' import UserLink from '../user_link/user_link.vue' import UserPopover from '../user_popover/user_popover.vue' @@ -13,7 +13,7 @@ const BasicUserCard = { components: { UserPopover, UserAvatar, - RichContent, + UserLink, }, methods: { diff --git a/src/components/chat_message/chat_message.js b/src/components/chat_message/chat_message.js index c6cff649a..12a147803 100644 --- a/src/components/chat_message/chat_message.js +++ b/src/components/chat_message/chat_message.js @@ -9,6 +9,7 @@ import Popover from 'src/components/popover/popover.vue' import StatusContent from 'src/components/status_content/status_content.vue' import UserAvatar from 'src/components/user_avatar/user_avatar.vue' import UserPopover from 'src/components/user_popover/user_popover.vue' +import Gallery from 'src/components/gallery/gallery.vue' import { useInstanceStore } from 'src/stores/instance.js' import { useInterfaceStore } from 'src/stores/interface' @@ -34,9 +35,7 @@ const ChatMessage = { Attachment, StatusContent, UserAvatar, - Gallery: defineAsyncComponent( - () => import( 'src/components/gallery/gallery.vue'), - ), + Gallery, LinkPreview, ChatMessageDate, UserPopover, diff --git a/src/components/chat_title/chat_title.js b/src/components/chat_title/chat_title.js index b1d4d8b76..5a2b5d775 100644 --- a/src/components/chat_title/chat_title.js +++ b/src/components/chat_title/chat_title.js @@ -1,6 +1,6 @@ import { defineAsyncComponent } from 'vue' -import RichContent from 'src/components/rich_content/rich_content.jsx' + import UserAvatar from 'src/components/user_avatar/user_avatar.vue' import UserPopover from 'src/components/user_popover/user_popover.vue' @@ -10,7 +10,7 @@ export default { name: 'ChatTitle', components: { UserAvatar, - RichContent, + UserPopover, }, props: ['user', 'withAvatar'], diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js index b0d3a304c..7ca166dbd 100644 --- a/src/components/conversation/conversation.js +++ b/src/components/conversation/conversation.js @@ -5,7 +5,7 @@ import { mapState } from 'vuex' import { WSConnectionStatus } from '../../services/api/api.service.js' import QuickFilterSettings from '../quick_filter_settings/quick_filter_settings.vue' import QuickViewSettings from '../quick_view_settings/quick_view_settings.vue' -import Status from '../status/status.vue' + import ThreadTree from '../thread_tree/thread_tree.vue' import { useInterfaceStore } from 'src/stores/interface' @@ -402,7 +402,6 @@ const conversation = { }), }, components: { - Status, ThreadTree, QuickFilterSettings, QuickViewSettings, diff --git a/src/components/draft/draft.js b/src/components/draft/draft.js index 412a72d08..bfafd052f 100644 --- a/src/components/draft/draft.js +++ b/src/components/draft/draft.js @@ -3,6 +3,7 @@ import { defineAsyncComponent } from 'vue' import StatusContent from 'src/components/status_content/status_content.vue' import PostStatusForm from 'src/components/post_status_form/post_status_form.vue' +import Gallery from 'src/components/gallery/gallery.vue' import { useMergedConfigStore } from 'src/stores/merged_config.js' @@ -21,9 +22,7 @@ const Draft = { () => import('src/components/confirm_modal/confirm_modal.vue'), ), StatusContent, - Gallery: defineAsyncComponent( - () => import( 'src/components/gallery/gallery.vue') - ), + Gallery, }, props: { draft: { diff --git a/src/components/emoji_picker/emoji_picker.js b/src/components/emoji_picker/emoji_picker.js index 0ba717c0b..3f52b175f 100644 --- a/src/components/emoji_picker/emoji_picker.js +++ b/src/components/emoji_picker/emoji_picker.js @@ -4,7 +4,7 @@ import { defineAsyncComponent } from 'vue' import Popover from 'src/components/popover/popover.vue' import { ensureFinalFallback } from '../../i18n/languages.js' import Checkbox from '../checkbox/checkbox.vue' -import StillImage from '../still-image/still-image.vue' + import { useEmojiStore } from 'src/stores/emoji.js' import { useInstanceStore } from 'src/stores/instance.js' @@ -142,7 +142,7 @@ const EmojiPicker = { () => import('src/components/sticker_picker/sticker_picker.vue'), ), Checkbox, - StillImage, + Popover, }, methods: { diff --git a/src/components/emoji_reactions/emoji_reactions.js b/src/components/emoji_reactions/emoji_reactions.js index e22336138..8d1045f51 100644 --- a/src/components/emoji_reactions/emoji_reactions.js +++ b/src/components/emoji_reactions/emoji_reactions.js @@ -1,4 +1,4 @@ -import StillImage from 'src/components/still-image/still-image.vue' + import UserAvatar from '../user_avatar/user_avatar.vue' import UserListPopover from '../user_list_popover/user_list_popover.vue' @@ -17,7 +17,7 @@ const EmojiReactions = { components: { UserAvatar, UserListPopover, - StillImage, + }, props: ['status'], data: () => ({ diff --git a/src/components/media_modal/media_modal.js b/src/components/media_modal/media_modal.js index 2994cb531..d649b6425 100644 --- a/src/components/media_modal/media_modal.js +++ b/src/components/media_modal/media_modal.js @@ -1,10 +1,10 @@ +import GestureService from '../../services/gesture_service/gesture_service' + +import { useMediaViewerStore } from 'src/stores/media_viewer.js' import { defineAsyncComponent } from 'vue' import Modal from 'src/components/modal/modal.vue' import StillImage from 'src/components/still-image/still-image.vue' -import GestureService from '../../services/gesture_service/gesture_service' - -import { useMediaViewerStore } from 'src/stores/media_viewer.js' import { library } from '@fortawesome/fontawesome-svg-core' import { @@ -18,18 +18,20 @@ library.add(faChevronLeft, faChevronRight, faCircleNotch, faTimes) const MediaModal = { components: { - StillImage, + VideoAttachment: defineAsyncComponent( - () => import('src/components/video_attachment/video_attachment.vue'), + () => import( 'src/components/video_attachment/video_attachment.vue'), ), PinchZoom: defineAsyncComponent( - () => import('src/components/pinch_zoom/pinch_zoom.vue'), + () => import( 'src/components/pinch_zoom/pinch_zoom.vue'), ), SwipeClick: defineAsyncComponent( - () => import('src/components/swipe_click/swipe_click.vue'), + () => import( 'src/components/swipe_click/swipe_click.vue'), ), Modal, - Flash: defineAsyncComponent(() => import('src/components/flash/flash.vue')), + Flash: defineAsyncComponent( + () => import( 'src/components/flash/flash.vue'), + ), }, data() { return { diff --git a/src/components/navigation/navigation_pins.js b/src/components/navigation/navigation_pins.js index 85f6fafee..120bcfa7b 100644 --- a/src/components/navigation/navigation_pins.js +++ b/src/components/navigation/navigation_pins.js @@ -11,7 +11,7 @@ import { routeTo, TIMELINES, } from 'src/components/navigation/navigation.js' -import StillImage from 'src/components/still-image/still-image.vue' + import { useAnnouncementsStore } from 'src/stores/announcements' import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders' @@ -55,7 +55,7 @@ const NavPanel = { }, }, components: { - StillImage, + }, computed: { getters() { diff --git a/src/components/notification/notification.js b/src/components/notification/notification.js index c1b6c1441..176ad3c9d 100644 --- a/src/components/notification/notification.js +++ b/src/components/notification/notification.js @@ -1,14 +1,14 @@ -import { defineAsyncComponent } from 'vue' import { mapState } from 'vuex' -import RichContent from 'src/components/rich_content/rich_content.jsx' + import { isStatusNotification } from '../../services/notification_utils/notification_utils.js' import { highlightClass, highlightStyle, } from '../../services/user_highlighter/user_highlighter.js' + import Report from '../report/report.vue' -import Status from '../status/status.vue' + import StatusContent from '../status_content/status_content.vue' import Timeago from '../timeago/timeago.vue' import UserAvatar from '../user_avatar/user_avatar.vue' @@ -19,6 +19,7 @@ import { useInstanceStore } from 'src/stores/instance.js' import { useMergedConfigStore } from 'src/stores/merged_config.js' import { useUserHighlightStore } from 'src/stores/user_highlight.js' +import { defineAsyncComponent } from 'vue' import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator' import { library } from '@fortawesome/fontawesome-svg-core' @@ -64,14 +65,13 @@ const Notification = { StatusContent, UserAvatar, Timeago, - Status, + Report, - RichContent, + UserPopover, UserLink, - ConfirmModal: defineAsyncComponent( - () => import('src/components/confirm_modal/confirm_modal.vue'), - ), + ConfirmModal: defineAsyncComponent(() => import('src/components/confirm_modal/confirm_modal.vue')), + }, mounted() { document.addEventListener('selectionchange', this.onContentSelect) diff --git a/src/components/poll/poll.js b/src/components/poll/poll.js index 5033726f3..6f82f94e8 100644 --- a/src/components/poll/poll.js +++ b/src/components/poll/poll.js @@ -1,5 +1,5 @@ import Checkbox from 'components/checkbox/checkbox.vue' -import RichContent from 'components/rich_content/rich_content.jsx' + import Timeago from 'components/timeago/timeago.vue' import genRandomSeed from '../../services/random_seed/random_seed.service.js' @@ -12,7 +12,7 @@ export default { props: ['basePoll', 'emoji'], components: { Timeago, - RichContent, + Checkbox, }, data() { diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js index b2ea91d60..164db3896 100644 --- a/src/components/post_status_form/post_status_form.js +++ b/src/components/post_status_form/post_status_form.js @@ -17,6 +17,7 @@ import { propsToNative } from '../../services/attributes_helper/attributes_helpe import { findOffset } from '../../services/offset_finder/offset_finder.service.js' import genRandomSeed from '../../services/random_seed/random_seed.service.js' import statusPoster from '../../services/status_poster/status_poster.service.js' +import Gallery from 'src/components/gallery/gallery.vue' import { useEmojiStore } from 'src/stores/emoji.js' import { useInstanceStore } from 'src/stores/instance.js' @@ -150,9 +151,7 @@ const PostStatusForm = { Select, Attachment, StatusContent, - Gallery: defineAsyncComponent( - () => import( 'src/components/gallery/gallery.vue') - ), + Gallery, DraftCloser, Popover, }, diff --git a/src/components/quote/quote.js b/src/components/quote/quote.js index 9525ddff2..30bb147cf 100644 --- a/src/components/quote/quote.js +++ b/src/components/quote/quote.js @@ -1,6 +1,5 @@ import { defineAsyncComponent } from 'vue' -import Status from '../status/status.vue' import { library } from '@fortawesome/fontawesome-svg-core' import { faCircleNotch } from '@fortawesome/free-solid-svg-icons' @@ -9,7 +8,7 @@ library.add(faCircleNotch) export default { components: { - Status, + }, name: 'Quote', props: { diff --git a/src/components/report/report.js b/src/components/report/report.js index fcfb83c3a..66e59480e 100644 --- a/src/components/report/report.js +++ b/src/components/report/report.js @@ -1,4 +1,4 @@ -import RichContent from 'src/components/rich_content/rich_content.jsx' + import Select from '../select/select.vue' import StatusContent from '../status_content/status_content.vue' import Timeago from '../timeago/timeago.vue' @@ -14,7 +14,7 @@ const Report = { Select, StatusContent, Timeago, - RichContent, + }, computed: { report() { diff --git a/src/components/rich_content/rich_content.jsx b/src/components/rich_content/rich_content.jsx index fc17a529f..9ed06eb64 100644 --- a/src/components/rich_content/rich_content.jsx +++ b/src/components/rich_content/rich_content.jsx @@ -3,7 +3,7 @@ import { flattenDeep, unescape as ldUnescape } from 'lodash' import HashtagLink from 'src/components/hashtag_link/hashtag_link.vue' import { MENTIONS_LIMIT } from 'src/components/mentions_line/mentions_line.js' import MentionsLine from 'src/components/mentions_line/mentions_line.vue' -import StillImage from 'src/components/still-image/still-image.vue' + import StillImageEmojiPopover from 'src/components/still-image/still-image-emoji-popover.vue' import { convertHtmlToLines } from 'src/services/html_converter/html_line_converter.service.js' diff --git a/src/components/search/search.js b/src/components/search/search.js index e160514a1..220ec9090 100644 --- a/src/components/search/search.js +++ b/src/components/search/search.js @@ -3,7 +3,7 @@ import { map, uniqBy } from 'lodash' import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx' import Conversation from '../conversation/conversation.vue' import FollowCard from '../follow_card/follow_card.vue' -import Status from '../status/status.vue' + import { library } from '@fortawesome/fontawesome-svg-core' import { faCircleNotch, faSearch } from '@fortawesome/free-solid-svg-icons' @@ -14,7 +14,7 @@ const Search = { components: { FollowCard, Conversation, - Status, + TabSwitcher, }, props: ['query'], diff --git a/src/components/settings_modal/helpers/emoji_editing_popover.vue b/src/components/settings_modal/helpers/emoji_editing_popover.vue index cd422b160..d576ee728 100644 --- a/src/components/settings_modal/helpers/emoji_editing_popover.vue +++ b/src/components/settings_modal/helpers/emoji_editing_popover.vue @@ -151,7 +151,7 @@