mirror of
https://github.com/versia-pub/frontend.git
synced 2025-12-06 08:28:20 +01:00
fix: 🐛 Fix links in UI
This commit is contained in:
parent
db00a81ff9
commit
485b1b8c80
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="rounded flex flex-row items-center gap-3">
|
<div class="rounded flex flex-row items-center gap-3">
|
||||||
<NuxtLink :href="url" :class="cn('relative size-14', smallLayout && 'size-8')">
|
<NuxtLink :href="urlAsPath" :class="cn('relative size-14', smallLayout && 'size-8')">
|
||||||
<Avatar shape="square" :class="cn('size-14 border border-card', smallLayout && 'size-8')">
|
<Avatar shape="square" :class="cn('size-14 border border-card', smallLayout && 'size-8')">
|
||||||
<AvatarImage :src="avatar" alt="" />
|
<AvatarImage :src="avatar" alt="" />
|
||||||
<AvatarFallback class="rounded-lg"> AA </AvatarFallback>
|
<AvatarFallback class="rounded-lg"> AA </AvatarFallback>
|
||||||
|
|
@ -44,7 +44,7 @@ import type {
|
||||||
import { AtSign, Globe, Lock, LockOpen } from "lucide-vue-next";
|
import { AtSign, Globe, Lock, LockOpen } from "lucide-vue-next";
|
||||||
import CopyableText from "./copyable-text.vue";
|
import CopyableText from "./copyable-text.vue";
|
||||||
|
|
||||||
const { acct, createdAt } = defineProps<{
|
const { acct, createdAt, url } = defineProps<{
|
||||||
avatar: string;
|
avatar: string;
|
||||||
cornerAvatar?: string;
|
cornerAvatar?: string;
|
||||||
acct: string;
|
acct: string;
|
||||||
|
|
@ -57,6 +57,7 @@ const { acct, createdAt } = defineProps<{
|
||||||
|
|
||||||
const [username, instance] = acct.split("@");
|
const [username, instance] = acct.split("@");
|
||||||
const digitRegex = /\d/;
|
const digitRegex = /\d/;
|
||||||
|
const urlAsPath = new URL(url).pathname;
|
||||||
const timeAgo = useTimeAgo(createdAt, {
|
const timeAgo = useTimeAgo(createdAt, {
|
||||||
messages: {
|
messages: {
|
||||||
justNow: "now",
|
justNow: "now",
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<NuxtLink :href="url" class="rounded border hover:bg-muted duration-100 text-sm flex flex-row items-center gap-2 px-2 py-1 mb-4">
|
<NuxtLink :href="urlAsPath" class="rounded border hover:bg-muted duration-100 text-sm flex flex-row items-center gap-2 px-2 py-1 mb-4">
|
||||||
<Repeat class="size-4 text-primary" />
|
<Repeat class="size-4 text-primary" />
|
||||||
<Avatar shape="square" class="size-6 border">
|
<Avatar shape="square" class="size-6 border">
|
||||||
<AvatarImage :src="avatar" alt="" />
|
<AvatarImage :src="avatar" alt="" />
|
||||||
|
|
@ -14,9 +14,11 @@
|
||||||
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
|
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
|
||||||
import { Repeat } from "lucide-vue-next";
|
import { Repeat } from "lucide-vue-next";
|
||||||
|
|
||||||
defineProps<{
|
const { url } = defineProps<{
|
||||||
avatar: string;
|
avatar: string;
|
||||||
displayName: string;
|
displayName: string;
|
||||||
url: string;
|
url: string;
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
|
const urlAsPath = new URL(url).pathname;
|
||||||
</script>
|
</script>
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div v-if="relationship?.requested_by !== false" class="flex flex-row items-center gap-3 p-4">
|
<div v-if="relationship?.requested_by !== false" class="flex flex-row items-center gap-3 p-4">
|
||||||
<NuxtLink class="relative size-10">
|
<NuxtLink :href="followerUrl" class="relative size-10">
|
||||||
<Avatar shape="square" class="size-10 border border-border">
|
<Avatar shape="square" class="size-10 border border-border">
|
||||||
<AvatarImage :src="follower.avatar" alt="" />
|
<AvatarImage :src="follower.avatar" alt="" />
|
||||||
<AvatarFallback class="rounded-lg"> AA </AvatarFallback>
|
<AvatarFallback class="rounded-lg"> AA </AvatarFallback>
|
||||||
|
|
@ -52,6 +52,7 @@ const { follower } = defineProps<{
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
const loading = ref(true);
|
const loading = ref(true);
|
||||||
|
const followerUrl = `/@${follower.acct}`;
|
||||||
const [username, instance] = follower.acct.split("@");
|
const [username, instance] = follower.acct.split("@");
|
||||||
const { relationship } = useRelationship(client, follower.id);
|
const { relationship } = useRelationship(client, follower.id);
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue