hj/pleroma-fe
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Merge branch 'more-fixes' into shigusegubu-themes3

Browse source
This commit is contained in:
Henry Jameson 2026-07-06 19:47:25 +03:00
commit 58c8bab9e2
10 changed files with 54 additions and 73 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/App.scss
View file

@ -145,8 +145,8 @@ h4 {
}
code {
background: var(--bg);
border: 1px solid var(--fg);
background: var(--background);
border: 1px solid var(--border);
border-radius: var(--roundness);
padding: 0 0.2em;

27
src/components/conversation/conversation.js
View file

@ -97,7 +97,7 @@ const conversation = {
},
data() {
return {
highlight: null,
focused: null,
expanded: false,
threadDisplayStatusObject: {}, // id => 'showing' | 'hidden'
inlineDivePosition: null,
@ -389,6 +389,9 @@ const conversation = {
canDive() {
return this.isTreeView && this.isExpanded
},
maybeFocused() {
return this.isExpanded ? this.focused : null
},
...mapPiniaState(useMergedConfigStore, ['mergedConfig']),
...mapState({
mastoUserSocketStatus: (state) => state.api.mastoUserSocketStatus,
@ -411,7 +414,7 @@ const conversation = {
oldConversationId &&
newConversationId === oldConversationId
) {
this.setHighlight(this.originalStatusId)
this.setFocused(this.originalStatusId)
} else {
this.fetchConversation()
}
@ -439,7 +442,7 @@ const conversation = {
}).then(({ data: { ancestors, descendants } }) => {
this.$store.dispatch('addNewStatuses', { statuses: ancestors })
this.$store.dispatch('addNewStatuses', { statuses: descendants })
this.setHighlight(this.originalStatusId)
this.setFocused(this.originalStatusId)
})
} else {
this.loadStatusError = null
@ -457,18 +460,12 @@ const conversation = {
})
}
},
isFocused(id) {
return this.isExpanded && id === this.highlight
},
getReplies(id) {
return this.replies[id] || []
},
maybeHighlight() {
return this.isExpanded ? this.highlight : null
},
setHighlight(id) {
setFocused(id) {
if (!id) return
this.highlight = id
this.focused = id
if (!this.streamingEnabled) {
this.$store.dispatch('fetchStatus', id)
@ -533,7 +530,7 @@ const conversation = {
// only used when we are not on a page
undive() {
this.inlineDivePosition = null
this.setHighlight(this.statusId)
this.setFocused(this.statusId)
},
tryScrollTo(id) {
if (!id) {
@ -551,7 +548,7 @@ const conversation = {
// contain scrolling calls, as we do not want the page to jump
// when we scroll with an expanded conversation.
//
// Now the method is to rely solely on the `highlight` watcher
// Now the method is to rely solely on the `focused` watcher
// in `status` components.
// In linear views, all statuses are rendered at all times, but
// in tree views, it is possible that a change in active status
@ -559,9 +556,9 @@ const conversation = {
// status becomes an ancestor status, and thus they will be
// different).
// Here, let the components be rendered first, in order to trigger
// the `highlight` watcher.
// the `focused` watcher.
this.$nextTick(() => {
this.setHighlight(id)
this.setFocused(id)
})
},
goToCurrent() {

15
src/components/conversation/conversation.vue
View file

@ -96,8 +96,7 @@
:replies="getReplies(status.id)"
:expandable="!isExpanded"
:focused="isFocused(status.id)"
:highlight="maybeHighlight"
:focused="maybeFocused === status.id"
:inline-expanded="collapsable && isExpanded"
:show-pinned="pinnedStatusIdsObject && pinnedStatusIdsObject[status.id]"
:in-profile="inProfile"
@ -107,7 +106,7 @@
:show-other-replies-as-button="showOtherRepliesButtonInsideStatus"
can-dive
@goto="setHighlight"
@goto="setFocused"
@dive="() => diveIntoStatus(status.id)"
@suspendable-state-change="onStatusSuspendStateChange"
/>
@ -154,9 +153,8 @@
:pinned-status-ids-object="pinnedStatusIdsObject"
:profile-user-id="profileUserId"
:is-focused-function="isFocused"
:get-replies="getReplies"
:highlight="maybeHighlight"
:focused="maybeFocused"
:toggle-expanded="toggleExpanded"
:simple="treeViewIsSimple"
@ -166,7 +164,7 @@
:total-reply-depth="totalReplyDepth"
:can-dive="canDive"
@goto="setHighlight"
@goto="setFocused"
@dive="diveIntoStatus"
@suspendable-state-change="onStatusSuspendStateChange"
/>
@ -185,15 +183,14 @@
:replies="getReplies(status.id)"
:expandable="!isExpanded"
:focused="isFocused(status.id)"
:highlight="maybeHighlight === status.id"
:focused="maybeFocused === status.id || maybeFocused === status.retweeted_status?.id"
:inline-expanded="collapsable && isExpanded"
:show-pinned="pinnedStatusIdsObject && pinnedStatusIdsObject[status.id]"
:in-profile="inProfile"
:in-conversation="isExpanded"
:profile-user-id="profileUserId"
@goto="setHighlight"
@goto="setFocused"
@toggle-expanded="toggleExpanded"
@suspendable-state-change="onStatusSuspendStateChange"
/>

5
src/components/error_modal/error_modal.vue
View file

@ -25,7 +25,10 @@
<details open>
<summary>{{ $t('general.generic_error_details') }}</summary>
<code class="stack pre" v-text="error.stack" />
<code
class="stack pre"
v-text="error.stack"
/>
</details>
</slot>
</div>

5
src/components/global_error/global_error.vue
View file

@ -13,7 +13,10 @@
<details v-if="details">
<summary>{{ $t('general.generic_error_details') }}</summary>
<code class="stack pre" v-text="details" />
<code
class="stack pre"
v-text="details"
/>
</details>
</template>
</ErrorModal>

26
src/components/palette_editor/palette_editor.vue
View file

@ -4,9 +4,11 @@
:class="{ '-compact': compact, '-apply': apply, '-mobile': mobile }"
>
<div class="palette">
<div v-for="key in paletteKeys">
<div
v-for="key in paletteKeys"
:key="key"
>
<ColorInput
:key="key"
:name="key"
:model-value="props.modelValue[key]"
:fallback="fallback(key)"
@ -14,10 +16,11 @@
@update:model-value="value => updatePalette(key, value)"
/>
<ContrastRatio
v-if="contrast[key]"
v-if="contrast?.[key]"
:show-ratio="true"
:contrast="contrast[key]"
/>
<div v-else>{{ '&nbsp;' }}</div>
</div>
</div>
<div class="buttons">
@ -134,11 +137,15 @@ const mobile = computed(() => {
})
const contrast = computed(() => {
if (props.modelValue == null) return null
const bg = hex2rgb(props.modelValue.bg)
const text = hex2rgb(props.modelValue.text)
const link = hex2rgb(props.modelValue.link)
if (text == null || link == null) return null
return {
text: hints(getContrastRatio(bg, hex2rgb(props.modelValue.text))),
link: hints(getContrastRatio(bg, hex2rgb(props.modelValue.link))),
text: hints(getContrastRatio(bg, text)),
link: hints(getContrastRatio(bg, link)),
}
})
@ -232,15 +239,6 @@ const updatePalette = (paletteKey, value) => {
grid-column: 1 / span 2;
}
}
.color-input {
display: grid;
gap: 0.5em;
label {
flex: 1;
}
}
}
}
</style>

27
src/components/status/status.js
View file

@ -97,7 +97,6 @@ const Status = {
expandable: Boolean,
focused: Boolean,
highlight: Boolean,
compact: Boolean,
isPreview: Boolean,
noHeading: Boolean,
@ -320,7 +319,7 @@ const Status = {
},
shouldNotMute() {
if (this.ignoreMute) return true
if (this.isFocused) return true
if (this.focused) return true
const { status } = this
const { reblog } = status
return (
@ -357,16 +356,6 @@ const Status = {
this.muteFilterHits.some((x) => x.hide))
)
},
isFocused() {
// retweet or root of an expanded conversation
if (this.focused) {
return true
} else if (!this.inConversation) {
return false
}
// use conversation highlight only when in conversation
return this.status.id === this.highlight
},
isReply() {
return !!(
this.status.in_reply_to_status_id && this.status.in_reply_to_user_id
@ -415,7 +404,7 @@ const Status = {
shouldDisplayFavsAndRepeats() {
return (
!this.hidePostStats &&
this.isFocused &&
this.focused &&
(this.combinedFavsAndRepeatsUsers.length > 0 ||
this.statusFromGlobalRepository.quotes_count)
)
@ -558,9 +547,9 @@ const Status = {
toggleThreadDisplay() {
this.controlledToggleThreadDisplay()
},
scrollIfHighlighted(highlightId) {
scrollIfFocused(focusedId) {
if (this.$el.getBoundingClientRect == null) return
const id = highlightId
const id = focusedId
if (this.status.id === id) {
const rect = this.$el.getBoundingClientRect()
if (rect.top < 100) {
@ -577,13 +566,13 @@ const Status = {
},
},
watch: {
highlight: function (id) {
this.scrollIfHighlighted(id)
focused: function (id) {
this.scrollIfFocused(id)
},
'status.repeat_num': function (num) {
// refetch repeats when repeat_num is changed in any way
if (
this.isFocused &&
this.focused &&
this.statusFromGlobalRepository.rebloggedBy &&
this.statusFromGlobalRepository.rebloggedBy.length !== num
) {
@ -593,7 +582,7 @@ const Status = {
'status.fave_num': function (num) {
// refetch favs when fave_num is changed in any way
if (
this.isFocused &&
this.focused &&
this.statusFromGlobalRepository.favoritedBy &&
this.statusFromGlobalRepository.favoritedBy.length !== num
) {

7
src/components/status/status.vue
View file

@ -3,7 +3,7 @@
v-if="!hideStatus"
ref="root"
class="Status"
:class="[{ '-focused': isFocused }, { '-conversation': inlineExpanded }]"
:class="[{ '-focused': focused }, { '-conversation': inlineExpanded }]"
>
<div
v-if="error"
@ -409,8 +409,7 @@
<StatusContent
ref="content"
:status="status"
:highlight="highlight"
:focused="isFocused"
:focused="focused"
:in-conversation="inConversation"
@mediaplay="addMediaPlaying($event)"
@mediapause="removeMediaPlaying($event)"
@ -507,7 +506,7 @@
</transition>
<EmojiReactions
v-if="(mergedConfig.emojiReactionsOnTimeline || isFocused) && (!noHeading && !isPreview)"
v-if="(mergedConfig.emojiReactionsOnTimeline || focused) && (!noHeading && !isPreview)"
:status="status"
/>

4
src/components/thread_tree/thread_tree.js
View file

@ -19,10 +19,8 @@ const ThreadTree = {
pinnedStatusIdsObject: Object,
profileUserId: String,
isFocusedFunction: Function,
highlight: String,
focused: String,
getReplies: Function,
setHighlight: Function,
toggleExpanded: Function,
simple: Boolean,

7
src/components/thread_tree/thread_tree.vue
View file

@ -8,9 +8,8 @@
:inline-expanded="collapsable && isExpanded"
:expandable="!isExpanded"
:show-pinned="pinnedStatusIdsObject && pinnedStatusIdsObject[status.id]"
:focused="isFocusedFunction(status.id)"
:in-conversation="isExpanded"
:highlight="highlight === status.id"
:focused="focused === status.id || focused === status.retweeted_status?.id"
:in-profile="inProfile"
:profile-user-id="profileUserId"
class="conversation-status conversation-status-treeview status-fadein panel-body"
@ -42,10 +41,8 @@
:pinned-status-ids-object="pinnedStatusIdsObject"
:profile-user-id="profileUserId"
:is-focused-function="isFocusedFunction"
:get-replies="getReplies"
:highlight="highlight"
:set-highlight="setHighlight"
:focused="focused"
:toggle-expanded="toggleExpanded"
:simple="simple"