feat: make internal app URLs permalinks (#329)

composables/content.ts

@@ -18,15 +18,14 @@ function handleMention(el: Element) {
       const matchUser = href.value.match(UserLinkRE)
       if (matchUser) {
         const [, server, username] = matchUser
-        // Handles need to ignore server subdomains
         const handle = `@${username}@${server.replace(/(.+\.)(.+\..+)/, '$2')}`
-        href.value = `/${handle}`
+        href.value = `/${server}/@${username}`
         return h(AccountHoverWrapper, { handle, class: 'inline-block' }, () => nodeToVNode(el))
       }
       const matchTag = href.value.match(TagLinkRE)
       if (matchTag) {
         const [, , name] = matchTag
-        href.value = `/tags/${name}`
+        href.value = `/${currentServer.value}/tags/${name}`
       }
     }
   }

composables/masto.ts

@@ -64,10 +64,15 @@ export function toShortHandle(fullHandle: string) {
 }
 
 export function getAccountRoute(account: Account) {
+  let handle = getFullHandle(account).slice(1)
+  if (handle.endsWith(`@${currentServer.value}`))
+    handle = handle.slice(0, -currentServer.value.length - 1)
+
   return useRouter().resolve({
     name: 'account-index',
     params: {
-      account: getFullHandle(account).slice(1),
+      server: currentServer.value,
+      account: handle,
     },
     state: {
       account: account as any,
@@ -78,6 +83,7 @@ export function getAccountFollowingRoute(account: Account) {
   return useRouter().resolve({
     name: 'account-following',
     params: {
+      server: currentServer.value,
       account: getFullHandle(account).slice(1),
     },
     state: {
@@ -89,6 +95,7 @@ export function getAccountFollowersRoute(account: Account) {
   return useRouter().resolve({
     name: 'account-followers',
     params: {
+      server: currentServer.value,
       account: getFullHandle(account).slice(1),
     },
     state: {
@@ -101,6 +108,7 @@ export function getStatusRoute(status: Status) {
   return useRouter().resolve({
     name: 'status',
     params: {
+      server: currentServer.value,
       account: getFullHandle(status.account).slice(1),
       status: status.id,
     },
@@ -111,18 +119,14 @@ export function getStatusRoute(status: Status) {
 }
 
 export function getStatusPermalinkRoute(status: Status) {
-  return status.url
-    ? useRouter().resolve({
-      name: 'permalink',
-      params: { permalink: withoutProtocol(status.url) },
-    })
-    : null
+  return status.url ? withoutProtocol(status.url) : null
 }
 
 export function getStatusInReplyToRoute(status: Status) {
   return useRouter().resolve({
     name: 'status-by-id',
     params: {
+      server: currentServer.value,
       status: status.inReplyToId,
     },
   })
@@ -143,6 +147,8 @@ const requestedRelationships = new Map<string, Ref<Relationship | undefined>>()
 let timeoutHandle: NodeJS.Timeout | undefined
 
 export function useRelationship(account: Account): Ref<Relationship | undefined> {
+  if (!currentUser.value)
+    return ref()
   let relationship = requestedRelationships.get(account.id)
   if (relationship)
     return relationship

composables/users.ts

@@ -21,11 +21,12 @@ export const currentUser = computed<UserLogin | undefined>(() => {
 })
 
 export const publicServer = ref(DEFAULT_SERVER)
+const publicInstance = ref<Instance | null>(null)
 export const currentServer = computed<string>(() => currentUser.value?.server || publicServer.value)
 
 export const useUsers = () => users
 
-export const currentInstance = computed<null | Instance>(() => currentUserId.value ? servers.value[currentUserId.value] ?? null : null)
+export const currentInstance = computed<null | Instance>(() => currentUserId.value ? servers.value[currentUserId.value] ?? null : publicInstance.value)
 
 export const characterLimit = computed(() => currentInstance.value?.configuration.statuses.maxCharacters ?? DEFAULT_POST_CHARS_LIMIT)
 
@@ -37,14 +38,18 @@ export async function loginTo(user?: Omit<UserLogin, 'account'> & { account?: Ac
   }
 
   const config = useRuntimeConfig()
+  const route = useRoute()
+  const router = useRouter()
+  const server = user?.server || route.params.server as string || publicServer.value
   const masto = await loginMasto({
-    url: `https://${user?.server || DEFAULT_SERVER}`,
+    url: `https://${server}`,
     accessToken: user?.token,
     disableVersionCheck: !!config.public.disableVersionCheck,
   })
 
   if (!user?.token) {
-    publicServer.value = user?.server || DEFAULT_SERVER
+    publicServer.value = server
+    publicInstance.value = await masto.instances.fetch()
   }
 
   else {
@@ -71,6 +76,13 @@ export async function loginTo(user?: Omit<UserLogin, 'account'> & { account?: Ac
 
   setMasto(masto)
 
+  if ('server' in route.params) {
+    await router.push({
+      ...route,
+      force: true,
+    })
+  }
+
   return masto
 }
 
@@ -98,7 +110,7 @@ export async function signout() {
   currentUserId.value = users.value[0]?.account?.id
 
   if (!currentUserId.value)
-    await useRouter().push('/public')
+    await useRouter().push(`/${currentServer.value}/public`)
 
   await loginTo(currentUser.value)
 }