conversation: scrollIntoView when collapsed

This helps find the original context when collapsing a thread on the
timeline.
This commit is contained in:
novenary 2024-09-18 01:06:26 +03:00
parent 8f06566ddd
commit c6de61e081
2 changed files with 11 additions and 3 deletions

View file

@ -267,11 +267,11 @@ const conversation = {
}, },
replies () { replies () {
let i = 1 let i = 1
return reduce(this.conversation, (result, { id, in_reply_to_status_id }) => { return reduce(this.conversation, (result, { id, in_reply_to_status_id }) => {
const irid = in_reply_to_status_id const irid = in_reply_to_status_id
if (irid) { if (irid) {
result[irid] = result[irid] || [] result[irid] = result[irid] || []
result[irid].push({ result[irid].push({
@ -414,6 +414,11 @@ const conversation = {
}, },
toggleExpanded () { toggleExpanded () {
this.expanded = !this.expanded this.expanded = !this.expanded
this.$nextTick(() => {
if (!this.expanded) {
this.$el.scrollIntoView({ block: 'nearest' })
}
})
}, },
getConversationId (statusId) { getConversationId (statusId) {
const status = this.$store.state.statuses.allStatusesObject[statusId] const status = this.$store.state.statuses.allStatusesObject[statusId]

View file

@ -278,5 +278,8 @@
&.-expanded.status-fadein { &.-expanded.status-fadein {
margin: calc(var(--status-margin, $status-margin) / 2); margin: calc(var(--status-margin, $status-margin) / 2);
} }
/* HACK: this value was picked arbitrarily and this is likely not even the right place */
scroll-margin-block-start: calc(var(--navbar-height) * 2);
} }
</style> </style>