Merge pull request 'More sonarqube cleanup' (#3528) from sonarqube-cleanup2 into develop

Reviewed-on: https://git.pleroma.social/pleroma/pleroma-fe/pulls/3528

build/update-emoji.js

@@ -3,7 +3,7 @@ import emojis from '@kazvmoe-infra/unicode-emoji-json/data-by-group.json' with {
   type: 'json',
 }
 
-Object.keys(emojis).map((k) => {
+Object.keys(emojis).forEach((k) => {
   emojis[k].forEach((e) => {
     delete e.unicode_version
     delete e.emoji_version

src/components/announcement/announcement.js

@@ -29,9 +29,8 @@ const Announcement = {
       currentUser: (state) => state.users.currentUser,
     }),
     canEditAnnouncement() {
-      return (
+      return this.currentUser?.privileges.has(
-        this.currentUser &&
+        'announcements_manage_announcements',
-        this.currentUser.privileges.has('announcements_manage_announcements')
       )
     },
     content() {

src/components/announcements_page/announcements_page.js

@@ -33,9 +33,8 @@ const AnnouncementsPage = {
       return useAnnouncementsStore().announcements
     },
     canPostAnnouncement() {
-      return (
+      return this.currentUser?.privileges.has(
-        this.currentUser &&
+        'announcements_manage_announcements',
-        this.currentUser.privileges.has('announcements_manage_announcements')
       )
     },
   },

src/components/attachment/attachment.js

@@ -165,16 +165,16 @@ const Attachment = {
       useMediaViewerStore().setCurrentMedia(this.attachment)
     },
     onEdit(event) {
-      this.edit && this.edit(this.attachment, event)
+      this.edit?.(this.attachment, event)
     },
     onRemove() {
-      this.remove && this.remove(this.attachment)
+      this.remove?.(this.attachment)
     },
     onShiftUp() {
-      this.shiftUp && this.shiftUp(this.attachment)
+      this.shiftUp?.(this.attachment)
     },
     onShiftDn() {
-      this.shiftDn && this.shiftDn(this.attachment)
+      this.shiftDn?.(this.attachment)
     },
     stopFlash() {
       this.$refs.flash.closePlayer()

src/components/chat_message/chat_message.vue

@@ -1,9 +1,9 @@
 <template>
   <div
     v-if="isMessage"
+    :id="`chatmessage-${message.id}`"
     class="chat-message-wrapper"
     :class="[classnames, { 'hovered-message-chain': hoveredMessageChain }]"
-    :id="`chatmessage-${message.id}`"
     @mouseover="onHover(true)"
     @mouseleave="onHover(false)"
   >
@@ -40,7 +40,10 @@
             </template>
           </i18n-t>
         </StatusPopover>
-        <span v-else class="reply-label">
+        <span
+          v-else
+          class="reply-label"
+        >
           {{ $t('status.broken_reply') }}
         </span>
       </template>
@@ -83,7 +86,10 @@
             :user="author"
           />
         </UserPopover>
-        <div v-else class="avatar-spacer" />
+        <div
+          v-else
+          class="avatar-spacer"
+        />
       </div>
       <div class="chat-message-inner">
         <div class="message-bubble-wrapper">
@@ -98,7 +104,6 @@
               @mouseenter="hovered = true"
               @mouseleave="hovered = false"
             >
-
               <StatusActionButtons
                 v-if="isStatus"
                 class="chat-message-toolbar"
@@ -112,9 +117,9 @@
                 @toggle-replying="$emit('replyRequested', message)"
               />
               <div
+                v-else
                 class="chat-message-toolbar"
                 :class="{ '-visible': hovered || menuOpened }"
-                v-else
               >
                 <Popover
                   trigger="click"
@@ -221,7 +226,10 @@
             v-if="isStatus && repliedTo"
             class="reply-indicator"
           >
-            <FAIcon class="icon" icon="reply" />
+            <FAIcon
+              class="icon"
+              icon="reply"
+            />
           </div>
           <div class="end-spacer" />
         </div>
@@ -232,7 +240,10 @@
     v-else
     class="chat-message-date-separator"
   >
-    <ChatMessageDate :date="chatItem.date" :show-time="chatItem.isTime" />
+    <ChatMessageDate
+      :date="chatItem.date"
+      :show-time="chatItem.isTime"
+    />
   </div>
 </template>
 

src/components/chat_message_list/chat_message_list.vue

@@ -7,7 +7,7 @@
       :previous-item="getPreviousItem(index)"
       :hovered-message-chain="chatItem.messageChainId === hoveredMessageChainId"
       :focused="chatItem.id === focusedId"
-      :repliedTo="chatItem.id === repliedId"
+      :replied-to="chatItem.id === repliedId"
       @hover="onMessageHover"
       @delete="onMessageDelete"
       @reply-requested="onReplyRequested"

src/components/chat_view/chat_view.vue

@@ -24,7 +24,7 @@
                 v-if="messages[0]?.summary_raw_html"
                 :html="messages[0].summary_raw_html"
                 :emoji="messages[0].emojis"
-                />
+              />
               <template v-else>
                 {{ $t('timeline.conversation') }}
               </template>

src/components/conversation/conversation.js

@@ -375,7 +375,7 @@ const conversation = {
       return !!(this.expanded || this.isPage)
     },
     hiddenStyle() {
-      const height = (this.status && this.status.virtualHeight) || '120px'
+      const height = this.status?.virtualHeight || '120px'
       return this.virtualHidden ? { height } : {}
     },
     threadDisplayStatus() {

src/components/conversation/conversation.vue

@@ -14,9 +14,9 @@
           v-if="conversation[0]?.summary_raw_html"
           :html="conversation[0].summary_raw_html"
           :emoji="conversation[0].emojis"
-          />
+        />
         <template v-else>
-        {{ $t('timeline.conversation') }}
+          {{ $t('timeline.conversation') }}
         </template>
       </h1>
       <button

src/components/desktop_nav/desktop_nav.js

@@ -45,8 +45,7 @@ export default {
   data: () => ({
     searchBarHidden: true,
     supportsMask:
-      window.CSS &&
+      window.CSS?.supports &&
-      window.CSS.supports &&
       (window.CSS.supports('mask-size', 'contain') ||
         window.CSS.supports('-webkit-mask-size', 'contain') ||
         window.CSS.supports('-moz-mask-size', 'contain') ||

src/components/edit_status_modal/edit_status_modal.js

@@ -42,9 +42,7 @@ const EditStatusModal = {
     },
     isFormVisible(val) {
       if (val) {
-        this.$nextTick(
+        this.$nextTick(() => this.$el?.querySelector('textarea').focus())
-          () => this.$el && this.$el.querySelector('textarea').focus(),
-        )
       }
     },
   },

src/components/emoji_input/suggestor.js

@@ -79,7 +79,7 @@ export const suggestUsers = ({ dispatch, state }) => {
 
   const userSearch = (query) => dispatch('searchUsers', { query })
   const debounceUserSearch = (query) => {
-    cancelUserSearch && cancelUserSearch()
+    cancelUserSearch?.()
     return new Promise((resolve, reject) => {
       timeout = setTimeout(() => {
         userSearch(query).then(resolve).catch(reject)

src/components/flash/flash.js

@@ -44,7 +44,7 @@ const Flash = {
       })
     },
     closePlayer() {
-      this.ruffleInstance && this.ruffleInstance.remove()
+      this.ruffleInstance?.remove()
       this.player = false
       this.$emit('playerClosed')
     },

src/components/image_cropper/image_cropper.js

@@ -50,7 +50,7 @@ const ImageCropper = {
     },
     readFile() {
       const fileInput = this.$refs.input
-      if (fileInput.files != null && fileInput.files[0] != null) {
+      if (fileInput?.files?.[0]) {
         this.file = fileInput.files[0]
         const reader = new window.FileReader()
         reader.onload = (e) => {

src/components/mention_link/mention_link.js

@@ -75,13 +75,11 @@ const MentionLink = {
   },
   computed: {
     user() {
-      return (
+      return this.url && this.$store?.getters.findUserByUrl(this.url)
-        this.url && this.$store && this.$store.getters.findUserByUrl(this.url)
-      )
     },
     isYou() {
       // FIXME why user !== currentUser???
-      return this.user && this.user.id === this.currentUser.id
+      return this.user?.id === this.currentUser.id
     },
     userName() {
       return this.user && this.userNameFullUi.split('@')[0]
@@ -94,10 +92,10 @@ const MentionLink = {
       )
     },
     userNameFull() {
-      return this.user && this.user.screen_name
+      return this.user?.screen_name
     },
     userNameFullUi() {
-      return this.user && this.user.screen_name_ui
+      return this.user?.screen_name_ui
     },
     highlightData() {
       return this.highlight[this.user?.screen_name]

src/components/moderation_tools/moderation_tools.js

@@ -405,7 +405,7 @@ const ModerationTools = {
       )
     },
     isAdmin() {
-      this.$store.state.users.currentUser.role === 'admin'
+      return this.$store.state.users.currentUser.role === 'admin'
     },
   },
   methods: {

src/components/mrf_transparency_panel/mrf_transparency_panel.js

@@ -11,7 +11,7 @@ import { useInstanceStore } from 'src/stores/instance.js'
  */
 const toInstanceReasonObject = (instances, info, key) => {
   return instances.map((instance) => {
-    if (info[key] && info[key][instance] && info[key][instance].reason) {
+    if (info[key]?.[instance]?.reason) {
       return { instance, reason: info[key][instance].reason }
     }
     return { instance, reason: '' }

src/components/navigation/filter.js

@@ -15,8 +15,7 @@ export const filterNavigation = (
     if (!isFederating && set.has('federating')) return false
     if (!currentUser && isPrivate && set.has('!private')) return false
     if (!currentUser && !(anon || anonRoute)) return false
-    if ((!currentUser || !currentUser.locked) && set.has('lockedUser'))
+    if (!currentUser?.locked && set.has('lockedUser')) return false
-      return false
     if (!hasChats && set.has('chats')) return false
     if (!hasAnnouncements && set.has('announcements')) return false
     if (!supportsBubbleTimeline && set.has('supportsBubbleTimeline'))

src/components/poll/poll.js

@@ -39,13 +39,13 @@ export default {
       return storePoll || {}
     },
     options() {
-      return (this.poll && this.poll.options) || []
+      return this.poll?.options || []
     },
     expiresAt() {
-      return (this.poll && this.poll.expires_at) || null
+      return this.poll?.expires_at || null
     },
     expired() {
-      return (this.poll && this.poll.expired) || false
+      return this.poll?.expired || false
     },
     expirationLabel() {
       if (useMergedConfigStore().mergedConfig.useAbsoluteTimeFormat) {

src/components/popover/popover.js

@@ -129,9 +129,7 @@ const Popover = {
       // Popover will be anchored around this element, trigger ref is the container, so
       // its children are what are inside the slot. Expect only one v-slot:trigger.
       const anchorEl =
-        this.anchorEl ||
+        this.anchorEl || this.$refs.trigger?.children[0] || this.$el
-        (this.$refs.trigger && this.$refs.trigger.children[0]) ||
-        this.$el
       // SVGs don't have offsetWidth/Height, use fallback
       const anchorHeight = anchorEl.offsetHeight || anchorEl.clientHeight
       const anchorWidth = anchorEl.offsetWidth || anchorEl.clientWidth
@@ -155,8 +153,7 @@ const Popover = {
 
       // Minor optimization, don't call a slow reflow call if we don't have to
       const parentScreenBox =
-        this.boundTo &&
+        (this.boundTo?.x === 'container' || this.boundTo?.y === 'container') &&
-        (this.boundTo.x === 'container' || this.boundTo.y === 'container') &&
         this.containerBoundingClientRect()
 
       const margin = this.margin || {}
@@ -164,7 +161,7 @@ const Popover = {
       // What are the screen bounds for the popover? Viewport vs container
       // when using viewport, using default margin values to dodge the navbar
       const xBounds =
-        this.boundTo && this.boundTo.x === 'container'
+        this.boundTo?.x === 'container'
           ? {
               min: parentScreenBox.left + (margin.left || 0),
               max: parentScreenBox.right - (margin.right || 0),
@@ -175,7 +172,7 @@ const Popover = {
             }
 
       const yBounds =
-        this.boundTo && this.boundTo.y === 'container'
+        this.boundTo?.y === 'container'
           ? {
               min: parentScreenBox.top + (margin.top || 0),
               max: parentScreenBox.bottom - (margin.bottom || 0),
@@ -247,12 +244,12 @@ const Popover = {
         if (bottomBoundary + content.offsetHeight > yBounds.max) usingTop = true
         if (topBoundary - content.offsetHeight < yBounds.min) usingTop = false
 
-        const yOffset = (this.offset && this.offset.y) || 0
+        const yOffset = this.offset?.y || 0
         translateY = usingTop
           ? topBoundary - yOffset - content.offsetHeight
           : bottomBoundary + yOffset
 
-        const xOffset = (this.offset && this.offset.x) || 0
+        const xOffset = this.offset?.x || 0
         translateX = origin.x + horizOffset + xOffset
       } else {
         // Default to whatever user wished with placement prop
@@ -268,12 +265,12 @@ const Popover = {
         if (rightBoundary + content.offsetWidth > xBounds.max) usingLeft = true
         if (leftBoundary - content.offsetWidth < xBounds.min) usingLeft = false
 
-        const xOffset = (this.offset && this.offset.x) || 0
+        const xOffset = this.offset?.x || 0
         translateX = usingLeft
           ? leftBoundary - xOffset - content.offsetWidth
           : rightBoundary + xOffset
 
-        const yOffset = (this.offset && this.offset.y) || 0
+        const yOffset = this.offset?.y || 0
         translateY = origin.y + vertOffset + yOffset
       }
 
@@ -298,7 +295,7 @@ const Popover = {
       }, 0)
       const wasHidden = this.hidden
       this.hidden = false
-      this.parentPopover && this.parentPopover.onChildPopoverState(this, true)
+      this.parentPopover?.onChildPopoverState(this, true)
       if (this.trigger === 'click' || this.stayOnClick) {
         document.addEventListener('click', this.onClickOutside)
       }
@@ -316,7 +313,7 @@ const Popover = {
       if (this.disabled) return
       if (!this.hidden) this.$emit('close')
       this.hidden = true
-      this.parentPopover && this.parentPopover.onChildPopoverState(this, false)
+      this.parentPopover?.onChildPopoverState(this, false)
       if (this.trigger === 'click') {
         document.removeEventListener('click', this.onClickOutside)
       }
@@ -366,7 +363,7 @@ const Popover = {
     onClickOutside(e) {
       if (this.disableClickOutside) return
       if (this.hidden) return
-      if (this.$refs.content && this.$refs.content.contains(e.target)) return
+      if (this.$refs.content?.contains(e.target)) return
       if (this.$el.contains(e.target)) return
       if (this.childrenShown.size > 0) return
       this.hidePopover()

src/components/post_status_form/post_status_form.js

@@ -316,7 +316,7 @@ const PostStatusForm = {
     },
     // -Edit
     isEdit() {
-      return typeof this.statusId !== 'undefined' && this.statusId.trim() !== ''
+      return this.statusId !== undefined && this.statusId.trim() !== ''
     },
     // -Reply
     isReply() {
@@ -619,7 +619,7 @@ const PostStatusForm = {
       this.newStatus.quote = null
       this.newStatus.nsfw = this.defaultNewStatus.nsfw
       this.newStatus.mediaDescriptions = {}
-      this.$refs.mediaUpload && this.$refs.mediaUpload.clearFile()
+      this.$refs.mediaUpload?.clearFile()
       if (this.preserveFocus) {
         this.$nextTick(() => {
           this.$refs.textarea.focus()
@@ -809,7 +809,7 @@ const PostStatusForm = {
       }
     },
     fileDrop(e) {
-      if (e.dataTransfer && e.dataTransfer.types.includes('Files')) {
+      if (e.dataTransfer?.types.includes('Files')) {
         e.preventDefault() // allow dropping text like before
         this.dropFiles = e.dataTransfer.files
         clearTimeout(this.dropStopTimeout)
@@ -826,7 +826,7 @@ const PostStatusForm = {
     },
     fileDrag(e) {
       e.dataTransfer.dropEffect = this.uploadFileLimitReached ? 'none' : 'copy'
-      if (e.dataTransfer && e.dataTransfer.types.includes('Files')) {
+      if (e.dataTransfer?.types.includes('Files')) {
         clearTimeout(this.dropStopTimeout)
         this.showDropIcon = 'show'
       }

src/components/post_status_form/post_status_form.vue

@@ -1,8 +1,8 @@
 <template>
   <div
+    v-if="initialized"
     ref="form"
     class="post-status-form"
-    v-if="initialized"
   >
     <form
       autocomplete="off"
@@ -176,12 +176,12 @@
           <input
             v-if="mentionsLine"
             :value="mentionsLineReadOnly ? mentionsString : newStatus.mentionsLine"
-            @change="onMentionsLineUpdate"
             type="text"
             :placeholder="$t('post_status.mentions_line')"
             :disabled="mentionsLineReadOnly || (posting && !optimisticPosting)"
             size="1"
             class="input mentions-input form-post-mentions unstyled"
+            @change="onMentionsLineUpdate"
           >
           <EmojiInput
             ref="emoji-input"
@@ -271,14 +271,14 @@
       <PollForm
         v-if="pollsAvailable"
         ref="pollForm"
-        :visible="pollFormVisible"
         v-model="newStatus.poll"
+        :visible="pollFormVisible"
       />
       <QuoteForm
         v-if="quotingAvailable"
+        :id="newStatus.quote?.id"
         ref="quoteForm"
         :visible="quoteFormVisible"
-        :id="newStatus.quote?.id"
         :url="newStatus.quote?.url"
         @update:url="url => newStatus.quote.url = url"
         @update:id="id => newStatus.quote.id = id"

src/components/post_status_modal/post_status_modal.js

@@ -40,9 +40,7 @@ const PostStatusModal = {
     },
     isFormVisible(val) {
       if (val) {
-        this.$nextTick(
+        this.$nextTick(() => this.$el?.querySelector('textarea').focus())
-          () => this.$el && this.$el.querySelector('textarea').focus(),
-        )
       }
     },
   },

src/components/quote/quote_form.js

@@ -102,7 +102,7 @@ export default {
             type: 'statuses',
           })
           .then((data) => {
-            if (data?.statuses && data.statuses.length === 1) {
+            if (data?.statuses?.length === 1) {
               this.$emit('update:id', data.statuses[0].id)
             } else {
               this.handleError(true)

src/components/registration/registration.js

@@ -154,7 +154,7 @@ const registration = {
       })
     },
     replaceNewlines(str) {
-      return str.replace(/\s*\n\s*/g, ' \n')
+      return str.replaceAll(/\s*\n\s*/g, ' \n')
     },
   },
 }

src/components/rich_content/rich_content.jsx

@@ -181,7 +181,7 @@ export default {
     }
 
     // Processor to use with html_tree_converter
-    const processItem = (item, index, array, what) => {
+    const processItem = (item, index, array) => {
       // Handle text nodes - just add emoji
       if (typeof item === 'string') {
         const emptyText = item.trim() === ''
@@ -251,18 +251,14 @@ export default {
           return ['', [mentionsLinePadding, renderImage(opener)], '']
         } else if (Tag === 'a' && this.handleLinks) {
           // replace mentions with MentionLink
-          if (fullAttrs.class && fullAttrs.class.includes('mention')) {
+          if (fullAttrs.class?.includes('mention')) {
             // Handling mentions here
             return renderMention(attrs, children)
           } else {
             currentMentions = null
           }
         } else if (Tag === 'span') {
-          if (
+          if (this.handleLinks && fullAttrs.class?.includes('h-card')) {
-            this.handleLinks &&
-            fullAttrs.class &&
-            fullAttrs.class.includes('h-card')
-          ) {
             return ['', children.map(processItem), '']
           }
         }
@@ -281,7 +277,7 @@ export default {
 
     // Processor for back direction (for finding "last" stuff, just easier this way)
     let encounteredTextReverse = false
-    const processItemReverse = (item, index, array, what) => {
+    const processItemReverse = (item, index, array) => {
       // Handle text nodes - just add emoji
       if (typeof item === 'string') {
         const emptyText = item.trim() === ''
@@ -300,7 +296,7 @@ export default {
             const attrs = getAttrs(opener, () => true)
             // should only be this
             if (
-              (fullAttrs.class && fullAttrs.class.includes('hashtag')) || // Pleroma style
+              fullAttrs.class?.includes('hashtag') || // Pleroma style
               fullAttrs.rel === 'tag' // Mastodon style
             ) {
               return renderHashtag(attrs, children, encounteredTextReverse)
@@ -479,7 +475,7 @@ export default {
       >
         {this.collapse
           ? pass2.map((x) => {
-              if (typeof x === 'string') return x.replace(/\n/g, ' ')
+              if (typeof x === 'string') return x.replaceAll('\n', ' ')
               if (!Array.isArray(x)) return x
               return x.map((y) => (y.type === 'br' ? ' ' : y))
             })
@@ -547,8 +543,8 @@ export const preProcessPerLine = (html, greentext) => {
         (string.includes('>') || string.includes('<'))
       ) {
         const cleanedString = string
-          .replace(/<[^>]+?>/gi, '') // remove all tags
+          .replaceAll(/<[^>]+?>/gi, '') // remove all tags
-          .replace(/@\w+/gi, '') // remove mentions (even failed ones)
+          .replaceAll(/@\w+/gi, '') // remove mentions (even failed ones)
           .trim()
         if (cleanedString.startsWith('&gt;')) {
           return `<span class='greentext'>${string}</span>`

src/components/search/search.js

@@ -122,7 +122,7 @@ const Search = {
       return 'statuses'
     },
     lastHistoryRecord(hashtag) {
-      return hashtag.history && hashtag.history[0]
+      return hashtag.history?.[0]
     },
   },
 }

src/components/settings_modal/admin_tabs/emoji_tab.js

@@ -300,7 +300,7 @@ const EmojiTab = {
     sortPackFiles(nameOfPack) {
       // Sort by key
       const sorted = Object.keys(this.knownPacks[nameOfPack].files)
-        .sort()
+        .sort((a, b) => a.localeCompare(b))
         .reduce((acc, key) => {
           if (key.length === 0) return acc
           acc[key] = this.knownPacks[nameOfPack].files[key]

src/components/settings_modal/helpers/setting.js

@@ -179,7 +179,7 @@ export default {
           [
             'admin_dash',
             'temp_overrides',
-            ...this.canonPath.map((p) => p.replace(/\./g, '_DOT_')),
+            ...this.canonPath.map((p) => p.replaceAll('.', '_DOT_')),
             'label',
           ].join('.'),
         )
@@ -198,7 +198,7 @@ export default {
           [
             'admin_dash',
             'temp_overrides',
-            ...this.canonPath.map((p) => p.replace(/\./g, '_DOT_')),
+            ...this.canonPath.map((p) => p.replaceAll('.', '_DOT_')),
             'description',
           ].join('.'),
         )

src/components/settings_modal/tabs/appearance_tab.js

@@ -257,7 +257,7 @@ const AppearanceTab = {
 
           const result = {
             name: `${meta.directives.name || this.$t('settings.style.themes3.palette.imported')}: ${variant}`,
-            key: `style.${variant.toLowerCase().replace(/ /g, '_')}`,
+            key: `style.${variant.toLowerCase().replaceAll(' ', '_')}`,
             bg,
             fg,
             text,

src/components/settings_modal/tabs/old_theme_tab/old_theme_tab.js

@@ -319,7 +319,7 @@ export default {
       return useInterfaceStore().themeDataUsed
     },
     shadowsAvailable() {
-      return Object.keys(DEFAULT_SHADOWS).sort()
+      return Object.keys(DEFAULT_SHADOWS).sort((a, b) => a.localeCompare(b))
     },
     currentShadowOverriden: {
       get() {
@@ -346,7 +346,7 @@ export default {
       },
     },
     currentShadowFallback() {
-      return (this.previewTheme.shadows || {})[this.shadowSelected]
+      return this.previewTheme.shadows?.[this.shadowSelected]
     },
     currentShadow: {
       get() {
@@ -425,8 +425,8 @@ export default {
       this.dismissWarning()
       const version =
         origin === 'localStorage' && !theme.colors ? 'l1' : fileVersion
-      const snapshotEngineVersion = (theme || {}).themeEngineVersion
+      const snapshotEngineVersion = theme?.themeEngineVersion
-      const themeEngineVersion = (source || {}).themeEngineVersion || 2
+      const themeEngineVersion = source?.themeEngineVersion || 2
       const versionsMatch = themeEngineVersion === CURRENT_VERSION
       const sourceSnapshotMismatch =
         theme !== undefined &&

src/components/side_drawer/side_drawer.js

@@ -61,7 +61,7 @@ const SideDrawer = {
       this.toggleDrawer,
     )
 
-    if (this.currentUser && this.currentUser.locked) {
+    if (this.currentUser?.locked) {
       this.$store.dispatch('startFetchingFollowRequests')
     }
   },

src/components/status/status.js

@@ -128,8 +128,7 @@ const Status = {
   computed: {
     showReasonMutedThread() {
       return (
-        (this.status.thread_muted ||
+        (this.status.thread_muted || this.status.reblog?.thread_muted) &&
-          (this.status.reblog && this.status.reblog.thread_muted)) &&
         !this.inConversation
       )
     },

src/components/status_action_buttons/status_action_buttons.vue

@@ -20,9 +20,9 @@
           :get-component="getComponent"
           :close="() => { /* no-op */ }"
           :do-action="doAction"
-          @emoji-picker-shown="onEmojiPickerShown"
           :default-button-style="useDefaultButtons"
           :hide-label="hideLabels"
+          @emoji-picker-shown="onEmojiPickerShown"
         />
         <button
           v-if="showPin && currentUser"

src/components/status_body/status_body.js

@@ -147,16 +147,15 @@ const StatusBody = {
       return this.status.attachments.map((file) => file.type)
     },
     collapsedStatus() {
-      return this.status.raw_html.replace(/(\n|<br\s?\/?>)/g, ' ')
+      return this.status.raw_html.replaceAll('(\n|<br\s?\/?>)', ' ')
     },
     ...mapState(useMergedConfigStore, ['mergedConfig']),
   },
   mounted() {
-    this.status.attentions &&
+    this.status.attentions?.forEach((attn) => {
-      this.status.attentions.forEach((attn) => {
+      const { id } = attn
-        const { id } = attn
+      this.$store.dispatch('fetchUserIfMissing', id)
-        this.$store.dispatch('fetchUserIfMissing', id)
+    })
-      })
   },
   methods: {
     onParseReady(event) {
@@ -168,7 +167,7 @@ const StatusBody = {
         .filter((mention) => !mention.notifying)
         .forEach((mention) => {
           const { content, url } = mention
-          const cleanedString = content.replace(/<[^>]+?>/gi, '') // remove all tags
+          const cleanedString = content.replaceAll(/<[^>]+?>/gi, '') // remove all tags
           if (!cleanedString.startsWith('@')) return
           const handle = cleanedString.slice(1)
           const host = url.replace(/^https?:\/\//, '').replace(/\/.+?$/, '')

src/components/still-image/still-image.js

@@ -51,7 +51,7 @@ const StillImage = {
       }
       const image = this.$refs.src
       if (!image) return
-      this.imageLoadHandler && this.imageLoadHandler(image)
+      this.imageLoadHandler?.(image)
       const canvas = this.$refs.canvas
       if (!canvas) return
       const width = image.naturalWidth
@@ -61,7 +61,7 @@ const StillImage = {
       canvas.getContext('2d').drawImage(image, 0, 0, width, height)
     },
     onError() {
-      this.imageLoadError && this.imageLoadError()
+      this.imageLoadError?.()
     },
   },
   watch: {

src/components/tab_switcher/tab_switcher.jsx

@@ -111,7 +111,11 @@ export default {
               type="button"
               role="tab"
             >
-              <img src={props.image} title={props['image-tooltip']} />
+              <img
+                src={props.image}
+                alt={props['image-tooltip']}
+                title={props['image-tooltip']}
+              />
               {props.label ? '' : props.label}
             </button>
           </div>

src/components/user_card/user_card.js

@@ -196,7 +196,7 @@ export default {
   },
   computed: {
     escapedNewBio() {
-      return ldEscape(this.newBio).replace(/\n/g, '<br>')
+      return ldEscape(this.newBio).replaceAll('\n', '<br>')
     },
     somethingToSave() {
       if (this.newName !== this.user.name_unescaped) return true

src/lib/persisted_state.js

@@ -185,7 +185,7 @@ export const piniaPersistPlugin =
       }
 
       const fallbackValue = await storage.getItem(vuexKey)
-      if (fallbackValue && fallbackValue[id]) {
+      if (fallbackValue?.[id]) {
         console.info(`Migrating ${id} store data from vuex to pinia`)
         const res = fallbackValue[id]
         await storage.setItem(key, res)

src/modules/api.js

@@ -336,7 +336,7 @@ const api = {
       }
     },
     disconnectFromSocket({ commit, state }) {
-      state.socket && state.socket.disconnect()
+      state.socket?.disconnect()
       commit('setSocket', null)
     },
   },

src/modules/statuses.js

@@ -134,7 +134,7 @@ const sortById = (a, b) => {
 const sortTimeline = (timeline) => {
   timeline.visibleStatuses = timeline.visibleStatuses.sort(sortById)
   timeline.statuses = timeline.statuses.sort(sortById)
-  timeline.minVisibleId = (last(timeline.visibleStatuses) || {}).id
+  timeline.minVisibleId = last(timeline.visibleStatuses)?.id
   return timeline
 }
 

src/services/chat_utils/chat_utils.js

@@ -12,10 +12,7 @@ export const maybeShowChatNotification = (chat) => {
     body: chat.lastMessage.content,
   }
 
-  if (
+  if (chat.lastMessage.attachment?.type === 'image') {
-    chat.lastMessage.attachment &&
-    chat.lastMessage.attachment.type === 'image'
-  ) {
     opts.image = chat.lastMessage.attachment.preview_url
   }
 

src/services/entity_normalizer/entity_normalizer.service.js

@@ -62,8 +62,8 @@ export const parseUser = (data) => {
   })
   output.fields_text = data.fields.map((field) => {
     return {
-      name: unescape(field.name.replace(/<[^>]*>/g, '')),
+      name: unescape(field.name.replaceAll(/<[^>]*>/g, '')),
-      value: unescape(field.value.replace(/<[^>]*>/g, '')),
+      value: unescape(field.value.replaceAll(/<[^>]*>/g, '')),
     }
   })
 
@@ -191,7 +191,7 @@ export const parseUser = (data) => {
 
   // Convert punycode to unicode for UI
   output.screen_name_ui = output.screen_name
-  if (output.screen_name && output.screen_name.includes('@')) {
+  if (output.screen_name?.includes('@')) {
     const parts = output.screen_name.split('@')
     const unicodeDomain = punycode.toUnicode(parts[1])
     if (unicodeDomain !== parts[1]) {

src/services/errors/errors.js

@@ -3,7 +3,7 @@ import { capitalize } from 'lodash'
 function humanizeErrors(errors) {
   return Object.entries(errors).reduce((errs, [k, val]) => {
     const message = val.reduce((acc, message) => {
-      const key = capitalize(k.replace(/_/g, ' '))
+      const key = capitalize(k.replaceAll('_', ' '))
       return acc + [key, message].join(' ') + '. '
     }, '')
     return [...errs, message]

src/services/notification_utils/notification_utils.js

@@ -175,13 +175,7 @@ export const prepareNotificationObject = (notification, i18n) => {
   }
 
   // Shows first attached non-nsfw image, if any. Should add configuration for this somehow...
-  if (
+  if (!status.nsfw && status?.attachments?.[0]?.mimetype.startsWith('image/')) {
-    status &&
-    status.attachments &&
-    status.attachments.length > 0 &&
-    !status.nsfw &&
-    status.attachments[0].mimetype.startsWith('image/')
-  ) {
     notifObj.image = status.attachments[0].url
   }
 

src/services/notifications_fetcher/notifications_fetcher.service.js

@@ -66,7 +66,8 @@ const fetchAndUpdate = ({ store, credentials, older = false, sinceId }) => {
     const unreadNotifsIds = notifications
       .filter((n) => !n.seen)
       .map((n) => n.id)
-    if (readNotifsIds.length > 0 && readNotifsIds.length > 0) {
+
+    if (readNotifsIds.length > 0 && unreadNotifsIds.length > 0) {
       const minId = Math.min(...unreadNotifsIds) // Oldest known unread notification
       if (minId !== Infinity) {
         args.sinceId = null // Don't use since_id since it sorta conflicts with min_id

src/services/style_setter/style_setter.js

@@ -29,7 +29,7 @@ export const createStyleSheet = (id, priority = 1000) => {
     addRule(rule) {
       let newRule = rule
       if (!CSS.supports?.('backdrop-filter', 'blur()')) {
-        newRule = newRule.replace(/backdrop-filter:[^;]+;/g, '') // Remove backdrop-filter
+        newRule = newRule.replaceAll(/backdrop-filter:[^;]+;/g, '') // Remove backdrop-filter
       }
 
       if (newRule.startsWith('::-webkit')) {
@@ -44,7 +44,7 @@ export const createStyleSheet = (id, priority = 1000) => {
       }
 
       this.rules.push(
-        newRule.replace(/var\(--shadowFilter\)[^;]*;/g, ''), // Remove shadowFilter references
+        newRule.replaceAll(/var\(--shadowFilter\)[^;]*;/g, ''), // Remove shadowFilter references
       )
     },
   }

src/services/sw/sw.js

@@ -1,7 +1,9 @@
 /* global process */
 function urlBase64ToUint8Array(base64String) {
   const padding = '='.repeat((4 - (base64String.length % 4)) % 4)
-  const base64 = (base64String + padding).replace(/-/g, '+').replace(/_/g, '/')
+  const base64 = (base64String + padding)
+    .replaceAll('-', '+')
+    .replace(/_/g, '/')
 
   const rawData = window.atob(base64)
   return Uint8Array.from([...rawData].map((char) => char.codePointAt(0)))

src/services/theme_data/iss_utils.js

@@ -110,13 +110,6 @@ export const genericRuleToSelector =
       let arraySelector = Array.isArray(selector) ? selector : [selector]
       if (ignoreOutOfTreeSelector || liteMode)
         arraySelector = [arraySelector[0]]
-      arraySelector
-        .sort((a) => {
-          if (a.startsWith(':')) return 1
-          if (/^[a-z]/.exec(a)) return -1
-          else return 0
-        })
-        .join('')
       return arraySelector
     })
 

src/services/theme_data/theme_data.service.js

@@ -244,10 +244,7 @@ export const OPACITIES = Object.entries(SLOT_INHERITANCE).reduce((acc, [k]) => {
       ...acc,
       [opacity]: {
         defaultValue: DEFAULT_OPACITY[opacity] || 1,
-        affectedSlots: [
+        affectedSlots: [...(acc[opacity]?.affectedSlots || []), k],
-          ...((acc[opacity] && acc[opacity].affectedSlots) || []),
-          k,
-        ],
       },
     }
   } else {
@@ -413,7 +410,7 @@ export const getColors = (sourceColors, sourceOpacity) =>
             outputColor.a = Number(
               opacityOverriden
                 ? sourceOpacity[opacitySlot]
-                : (OPACITIES[opacitySlot] || {}).defaultValue,
+                : OPACITIES[opacitySlot]?.defaultValue,
             )
           }
         }
@@ -460,7 +457,7 @@ export const generatePreset = (input) => {
   return composePreset(
     colors,
     generateRadii(input),
-    generateShadows(input, colors.theme.colors, colors.mod),
+    generateShadows(input, colors.theme.colors),
     generateFonts(input),
   )
 }

src/services/user_highlighter/user_highlighter.js

@@ -47,7 +47,7 @@ const highlightStyle = (prefs) => {
 
 const highlightClass = (user) => {
   return (
-    'USER____' + user.screen_name?.replace(/\./g, '_').replace(/@/g, '_AT_')
+    'USER____' + user.screen_name?.replaceAll('.', '_').replace(/@/g, '_AT_')
   )
 }
 

src/stores/chats.js

@@ -69,8 +69,7 @@ export const useChatsStore = defineStore('chats', {
 
         if (chat) {
           const isNewMessage =
-            (chat.lastMessage && chat.lastMessage.id) !==
+            chat.lastMessage?.id !== updatedChat.lastMessage?.id
-            (updatedChat.lastMessage && updatedChat.lastMessage.id)
           chat.lastMessage = updatedChat.lastMessage
           chat.unread = updatedChat.unread
           chat.updated_at = updatedChat.updated_at

src/stores/emoji.js

@@ -146,7 +146,7 @@ export const useEmojiStore = defineStore('emoji', {
     async getStaticEmoji() {
       try {
         // See build/emojis_plugin for more details
-        const values = (await import('/src/assets/emoji.json')).default
+        const values = (await import('src/assets/emoji.json')).default
 
         const emoji = Object.keys(values).reduce((res, groupId) => {
           res[groupId] = values[groupId].map((e) => ({
@@ -231,7 +231,7 @@ export const useEmojiStore = defineStore('emoji', {
         .then((allPacks) => {
           // Sort by key
           return Object.keys(allPacks)
-            .sort()
+            .sort((a, b) => a.localeCompare(b))
             .reduce((acc, key) => {
               if (key.length === 0) return acc
               acc[key] = allPacks[key]

src/stores/interface.js

@@ -60,8 +60,7 @@ export const useInterfaceStore = defineStore('interface', {
     },
     browserSupport: {
       cssFilter:
-        window.CSS &&
+        window.CSS?.supports &&
-        window.CSS.supports &&
         (window.CSS.supports('filter', 'drop-shadow(0 0)') ||
           window.CSS.supports('-webkit-filter', 'drop-shadow(0 0)')),
       localFonts: typeof window.queryLocalFonts === 'function',
@@ -578,7 +577,8 @@ export const useInterfaceStore = defineStore('interface', {
             return { name: x.variant, ...cleanDirectives }
           })
           .forEach((palette) => {
-            const key = 'style.' + palette.name.toLowerCase().replace(/ /g, '_')
+            const key =
+              'style.' + palette.name.toLowerCase().replaceAll(' ', '_')
             if (!firstStylePaletteName) firstStylePaletteName = key
             palettesIndex[key] = () => Promise.resolve(palette)
           })

src/stores/sync_config.js

@@ -195,10 +195,13 @@ export const _getRecentData = (cache, live, isTest) => {
 }
 
 export const _getAllFlags = (recent, stale) => {
+  const recentStorage = toRaw(recent?.flagStorage)
+  const staleStorage = toRaw(stale?.flagStorage)
+
   return Array.from(
     new Set([
-      ...Object.keys(toRaw((recent || {}).flagStorage || {})),
+      ...Object.keys(recentStorage || {}),
-      ...Object.keys(toRaw((stale || {}).flagStorage || {})),
+      ...Object.keys(staleStorage || {}),
     ]),
   )
 }

test/unit/specs/components/rich_content.spec.js

@@ -50,7 +50,7 @@ describe('RichContent', () => {
       },
     })
 
-    expect(wrapper.html().replace(/\n/g, '')).to.eql(compwrap(html))
+    expect(wrapper.html().replaceAll('\n', '')).to.eql(compwrap(html))
   })
 
   it('unescapes everything as needed', () => {
@@ -67,7 +67,7 @@ describe('RichContent', () => {
       },
     })
 
-    expect(wrapper.html().replace(/\n/g, '')).to.eql(compwrap(expected))
+    expect(wrapper.html().replaceAll('\n', '')).to.eql(compwrap(expected))
   })
 
   it('replaces mention with mentionsline', () => {
@@ -83,7 +83,7 @@ describe('RichContent', () => {
       },
     })
 
-    expect(wrapper.html().replace(/\n/g, '')).to.eql(
+    expect(wrapper.html().replaceAll('\n', '')).to.eql(
       compwrap(p(mentionsLine(1), ' how are you doing today?')),
     )
   })
@@ -116,7 +116,7 @@ describe('RichContent', () => {
       },
     })
 
-    expect(wrapper.html().replace(/\n/g, '')).to.eql(compwrap(expected))
+    expect(wrapper.html().replaceAll('\n', '')).to.eql(compwrap(expected))
   })
 
   it('Does not touch links if link handling is disabled', () => {
@@ -211,7 +211,7 @@ describe('RichContent', () => {
       },
     })
 
-    expect(wrapper.html().replace(/\n/g, '')).to.eql(compwrap(expected))
+    expect(wrapper.html().replaceAll('\n', '')).to.eql(compwrap(expected))
   })
 
   it("Doesn't add nonexistent emoji to post", () => {
@@ -228,7 +228,7 @@ describe('RichContent', () => {
       },
     })
 
-    expect(wrapper.html().replace(/\n/g, '')).to.eql(compwrap(html))
+    expect(wrapper.html().replaceAll('\n', '')).to.eql(compwrap(html))
   })
 
   it('Greentext + last mentions', () => {
@@ -279,7 +279,7 @@ describe('RichContent', () => {
       },
     })
 
-    expect(wrapper.html().replace(/\n/g, '')).to.eql(compwrap(expected))
+    expect(wrapper.html().replaceAll('\n', '')).to.eql(compwrap(expected))
   })
 
   it('buggy example/hashtags', () => {
@@ -315,7 +315,7 @@ describe('RichContent', () => {
       },
     })
 
-    expect(wrapper.html().replace(/\n/g, '')).to.eql(compwrap(expected))
+    expect(wrapper.html().replaceAll('\n', '')).to.eql(compwrap(expected))
   })
 
   it('rich contents of a mention are handled properly', () => {
@@ -365,8 +365,8 @@ describe('RichContent', () => {
     expect(
       wrapper
         .html()
-        .replace(/\n/g, '')
+        .replaceAll('\n', '')
-        .replace(/<!--.*?-->/g, ''),
+        .replaceAll(/<!--.*?-->/g, ''),
     ).to.eql(compwrap(expected))
   })
 
@@ -438,8 +438,8 @@ describe('RichContent', () => {
     expect(
       wrapper
         .html()
-        .replace(/\n/g, '')
+        .replaceAll('\n', '')
-        .replace(/<!--.*?-->/g, ''),
+        .replaceAll(/<!--.*?-->/g, ''),
     ).to.eql(compwrap(expected))
   })
 
@@ -484,7 +484,7 @@ describe('RichContent', () => {
       },
     })
 
-    expect(wrapper.html().replace(/\n/g, '')).to.eql(compwrap(expected))
+    expect(wrapper.html().replaceAll('\n', '')).to.eql(compwrap(expected))
   })
 
   it.skip('[INFORMATIVE] Performance testing, 10 000 simple posts', () => {

test/unit/specs/modules/statuses.spec.js

@@ -107,7 +107,7 @@ describe('Statuses module', () => {
         showImmediately: true,
         timeline: 'public',
       })
-      expect(state.timelines.public.maxId).to.eql('1')
+      expect(state.timelines.public.maxId).to.equal('1')
 
       mutations.addNewStatuses(state, {
         statuses: [secondStatus],
@@ -120,7 +120,7 @@ describe('Statuses module', () => {
         secondStatus,
         status,
       ])
-      expect(state.timelines.public.maxId).to.eql('1')
+      expect(state.timelines.public.maxId).to.equal('1')
     })
 
     it('keeps a descending by id order in timeline.visibleStatuses and timeline.statuses', () => {
@@ -340,7 +340,7 @@ describe('Statuses module', () => {
       expect(state.allStatusesObject['1'].emoji_reactions[0].me).to.eql(true)
       expect(
         state.allStatusesObject['1'].emoji_reactions[0].accounts[0].id,
-      ).to.eql('me')
+      ).to.equal('me')
     })
 
     it('adds a new reaction', () => {
@@ -362,7 +362,7 @@ describe('Statuses module', () => {
       expect(state.allStatusesObject['1'].emoji_reactions[0].me).to.eql(true)
       expect(
         state.allStatusesObject['1'].emoji_reactions[0].accounts[0].id,
-      ).to.eql('me')
+      ).to.equal('me')
     })
 
     it('decreases count in existing reaction', () => {
@@ -429,8 +429,8 @@ describe('Statuses module', () => {
       mutations.showNewStatuses(state, { timeline: 'public' })
 
       expect(state.timelines.public.visibleStatuses.length).to.eql(2)
-      expect(state.timelines.public.minVisibleId).to.eql('10')
+      expect(state.timelines.public.minVisibleId).to.equal('10')
-      expect(state.timelines.public.minId).to.eql('10')
+      expect(state.timelines.public.minId).to.equal('10')
     })
   })
 

tools/emoji_merger.js

@@ -54,7 +54,7 @@ const run = () => {
 
   // Sort by key
   const sorted = Object.keys(emojisObject)
-    .sort()
+    .sort((a, b) => a.localeCompare(b))
     .reduce((acc, key) => {
       if (key.length === 0) return acc
       acc[key] = emojisObject[key]