optional chaining

src/components/announcement/announcement.js

@@ -30,8 +30,7 @@ const Announcement = {
     }),
     canEditAnnouncement() {
       return (
-        this.currentUser &&
+        this.currentUser?.privileges.has('announcements_manage_announcements')
-        this.currentUser.privileges.has('announcements_manage_announcements')
       )
     },
     content() {

src/components/announcements_page/announcements_page.js

@@ -34,8 +34,7 @@ const AnnouncementsPage = {
     },
     canPostAnnouncement() {
       return (
-        this.currentUser &&
+        this.currentUser?.privileges.has('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/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/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

@@ -43,7 +43,7 @@ const EditStatusModal = {
     isFormVisible(val) {
       if (val) {
         this.$nextTick(
-          () => this.$el && this.$el.querySelector('textarea').focus(),
+          () => 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

@@ -76,12 +76,12 @@ const MentionLink = {
   computed: {
     user() {
       return (
-        this.url && this.$store && this.$store.getters.findUserByUrl(this.url)
+        this.url && 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 +94,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/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,7 +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
     if (!hasChats && set.has('chats')) return false
     if (!hasAnnouncements && set.has('announcements')) return false

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

@@ -130,7 +130,7 @@ const Popover = {
       // its children are what are inside the slot. Expect only one v-slot:trigger.
       const anchorEl =
         this.anchorEl ||
-        (this.$refs.trigger && this.$refs.trigger.children[0]) ||
+        (this.$refs.trigger?.children[0]) ||
         this.$el
       // SVGs don't have offsetWidth/Height, use fallback
       const anchorHeight = anchorEl.offsetHeight || anchorEl.clientHeight
@@ -155,8 +155,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 +163,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 +174,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 +246,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 +267,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 +297,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 +315,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 +365,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_modal/post_status_modal.js

@@ -41,7 +41,7 @@ const PostStatusModal = {
     isFormVisible(val) {
       if (val) {
         this.$nextTick(
-          () => this.$el && this.$el.querySelector('textarea').focus(),
+          () => 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/rich_content/rich_content.jsx

@@ -251,7 +251,7 @@ 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 {
@@ -260,8 +260,7 @@ export default {
         } else if (Tag === 'span') {
           if (
             this.handleLinks &&
-            fullAttrs.class &&
+            fullAttrs.class?.includes('h-card')
-            fullAttrs.class.includes('h-card')
           ) {
             return ['', children.map(processItem), '']
           }
@@ -300,7 +299,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)

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/tabs/old_theme_tab/old_theme_tab.js

@@ -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

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

src/components/status_body/status_body.js

@@ -152,11 +152,10 @@ const StatusBody = {
     ...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) {

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/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

@@ -13,8 +13,7 @@ export const maybeShowChatNotification = (chat) => {
   }
 
   if (
-    chat.lastMessage.attachment &&
+    chat.lastMessage.attachment?.type === 'image'
-    chat.lastMessage.attachment.type === 'image'
   ) {
     opts.image = chat.lastMessage.attachment.preview_url
   }

src/services/entity_normalizer/entity_normalizer.service.js

@@ -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/notification_utils/notification_utils.js

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

src/services/theme_data/theme_data.service.js

@@ -245,7 +245,7 @@ export const OPACITIES = Object.entries(SLOT_INHERITANCE).reduce((acc, [k]) => {
       [opacity]: {
         defaultValue: DEFAULT_OPACITY[opacity] || 1,
         affectedSlots: [
-          ...((acc[opacity] && acc[opacity].affectedSlots) || []),
+          ...((acc[opacity]?.affectedSlots) || []),
           k,
         ],
       },
@@ -413,7 +413,7 @@ export const getColors = (sourceColors, sourceOpacity) =>
             outputColor.a = Number(
               opacityOverriden
                 ? sourceOpacity[opacitySlot]
-                : (OPACITIES[opacitySlot] || {}).defaultValue,
+                : OPACITIES[opacitySlot]?.defaultValue,
             )
           }
         }

src/stores/chats.js

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

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',

src/stores/sync_config.js

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