diff --git a/components/status/StatusCard.vue b/components/status/StatusCard.vue index c0ac9acc..b9747484 100644 --- a/components/status/StatusCard.vue +++ b/components/status/StatusCard.vue @@ -15,6 +15,7 @@ const props = withDefaults( // Manual overrides hasOlder?: boolean hasNewer?: boolean + // When looking into a detailed view of a post, we can simplify the replying badges // to the main expanded post main?: mastodon.v1.Status @@ -32,9 +33,13 @@ const status = $computed(() => { const directReply = $computed(() => props.hasNewer || (!!status.inReplyToId && (status.inReplyToId === props.newer?.id || status.inReplyToId === props.newer?.reblog?.id))) // Use reblogged status, connect it to further replies const connectReply = $computed(() => props.hasOlder || status.id === props.older?.inReplyToId || status.id === props.older?.reblog?.inReplyToId) +// Open a detailed status, the replies directly to it +const replyToMain = $computed(() => props.main && props.main.id === status.inReplyToId) const rebloggedBy = $computed(() => props.status.reblog ? props.status.account : null) +const statusRoute = $computed(() => getStatusRoute(status)) + const el = ref() const router = useRouter() @@ -47,13 +52,12 @@ function onclick(evt: MouseEvent | KeyboardEvent) { } function go(evt: MouseEvent | KeyboardEvent) { - const route = getStatusRoute(status) if (evt.metaKey || evt.ctrlKey) { - window.open(route.href) + window.open(statusRoute.href) } else { cacheStatus(status) - router.push(route) + router.push(statusRoute) } } @@ -70,17 +74,12 @@ const filter = $computed(() => filterResult?.filter as mastodon.v2.Filter) const filterPhrase = $computed(() => filter?.phrase || (filter as any)?.title) const isFiltered = $computed(() => filterPhrase && (props.context ? filter?.context.includes(props.context) : false)) +const isSelfReply = $computed(() => status.inReplyToAccountId === status.account.id) const collapseRebloggedBy = $computed(() => rebloggedBy?.id === status.account.id) - -// Collapse ReplyingTo badge if it is a self-reply (thread) -const collapseReplyingTo = $computed(() => (!rebloggedBy || collapseRebloggedBy) && status.inReplyToAccountId === status.account.id) - -// Only show avatar in ReplyingTo badge if it was reblogged by the same account or if it is against the main post -const simplifyReplyingTo = $computed(() => - (props.main && props.main.account.id === status.inReplyToAccountId) || (rebloggedBy && rebloggedBy.id === status.inReplyToAccountId), -) - const isDM = $computed(() => status.visibility === 'direct') + +const showUpperBorder = $computed(() => props.newer && !directReply) +const showReplyTo = $computed(() => !replyToMain && !directReply)