refactor: improve UI & types

components/account/AccountFollowButton.vue

@@ -5,7 +5,7 @@ const { account } = defineProps<{
   account: Account
 }>()
 
-const isSelf = $computed(() => currentUser.value?.account?.id === account.id)
+const isSelf = $computed(() => currentUser.value?.account.id === account.id)
 const relationship = $(useRelationship(account))
 
 async function toggleFollow() {

components/publish/PublishWidget.vue

@@ -118,7 +118,7 @@ onUnmounted(() => {
     </template>
 
     <div p4 flex gap-4>
-      <NuxtLink w-12 h-12 :to="getAccountPath(currentUser.account!)">
+      <NuxtLink w-12 h-12 :to="getAccountPath(currentUser.account)">
         <AccountAvatar :account="currentUser.account" w-12 h-12 />
       </NuxtLink>
       <div
@@ -154,9 +154,11 @@ onUnmounted(() => {
         </div>
 
         <div flex="~ gap-2">
-          <button btn-action-icon @click="pickAttachments">
-            <div i-ri:upload-line />
-          </button>
+          <CommonTooltip placement="bottom" content="Add images, a video or an audio file">
+            <button btn-action-icon @click="pickAttachments">
+              <div i-ri:upload-line />
+            </button>
+          </CommonTooltip>
 
           <div flex-auto />
 

components/status/StatusActions.vue

@@ -14,7 +14,7 @@ const clipboard = useClipboard()
 const router = useRouter()
 const route = useRoute()
 
-const isAuthor = $computed(() => status.account.id === currentUser.value?.account?.id)
+const isAuthor = $computed(() => status.account.id === currentUser.value?.account.id)
 
 // Use different states to let the user press different actions right after the other
 const isLoading = $ref({

components/user/UserSwitcher.vue

@@ -41,7 +41,7 @@ const sorted = computed(() => {
         @click="signout"
       >
         <div i-ri:logout-box-line />
-        Sign out {{ getAccountHandle(currentUser.account!) }}
+        Sign out {{ getAccountHandle(currentUser.account) }}
       </button>
     </div>
   </div>