chore: merge upstream

elk/components/common/CommonRouteTabs.vue

@@ -14,11 +14,11 @@ const router = useRouter()
 
 useCommands(() => command
   ? options.map(tab => ({
-    scope: 'Tabs',
-    name: tab.display,
-    icon: tab.icon ?? 'i-ri:file-list-2-line',
-    onActivate: () => router.replace(tab.to),
-  }))
+      scope: 'Tabs',
+      name: tab.display,
+      icon: tab.icon ?? 'i-ri:file-list-2-line',
+      onActivate: () => router.replace(tab.to),
+    }))
   : [])
 </script>
 

elk/components/common/CommonTabs.vue

@@ -25,13 +25,13 @@ function toValidName(option: string) {
 
 useCommands(() => command
   ? tabs.value.map(tab => ({
-    scope: 'Tabs',
+      scope: 'Tabs',
 
-    name: tab.display,
-    icon: tab.icon ?? 'i-ri:file-list-2-line',
+      name: tab.display,
+      icon: tab.icon ?? 'i-ri:file-list-2-line',
 
-    onActivate: () => modelValue.value = tab.name,
-  }))
+      onActivate: () => modelValue.value = tab.name,
+    }))
   : [])
 </script>
 

elk/components/nav/NavBottom.vue

@@ -44,7 +44,7 @@ const defaultSelectedNavButtonNames: NavButtonName[] = currentUser.value
   : ['local', 'federated', 'moreMenu']
 const selectedNavButtonNames = useLocalStorage<NavButtonName[]>(STORAGE_KEY_BOTTOM_NAV_BUTTONS, defaultSelectedNavButtonNames)
 
-const selectedNavButtons = computed(() => selectedNavButtonNames.value.map(name => navButtons.find(navButton => navButton.name === name)))
+const selectedNavButtons = computed(() => selectedNavButtonNames.value.map(name => navButtons.find(navButton => navButton.name === name)).filter(n => !!n))
 
 // only one icon can be lit up at the same time
 const moreMenuVisible = ref(false)

elk/components/status/StatusCard.vue

@@ -71,6 +71,7 @@ const timeago = useTimeAgo(() => status.value.createdAt, timeAgoOptions)
 const isSelfReply = computed(() => status.value.inReplyToAccountId === status.value.account.id)
 const collapseRebloggedBy = computed(() => rebloggedBy.value?.id === status.value.account.id)
 const isDM = computed(() => status.value.visibility === 'direct')
+const isPinned = computed(() => status.value.pinned)
 
 const showUpperBorder = computed(() => props.newer && !directReply.value)
 const showReplyTo = computed(() => !replyToMain.value && !directReply.value)
@@ -84,6 +85,19 @@ const forceShow = ref(false)
     <div :h="showUpperBorder ? '1px' : '0'" w-auto bg-border mb-1 z--1 />
 
     <slot name="meta">
+      <!-- Pinned status -->
+      <div flex="~ col" justify-between>
+        <div
+          v-if="isPinned"
+          flex="~ gap2" items-center h-auto text-sm text-orange
+          m="is-5" p="t-1 is-5"
+          relative text-secondary ws-nowrap
+        >
+          <div i-ri:pushpin-line />
+          <span>{{ $t('status.pinned') }}</span>
+        </div>
+      </div>
+
       <!-- Line connecting to previous status -->
       <template v-if="status.inReplyToAccountId">
         <StatusReplyingTo