dont scroll to first item, it obscures back button

This commit is contained in:
Nolan Lawson 2018-02-10 14:19:10 -08:00
parent db3291c542
commit 0a165cb2ad
3 changed files with 13 additions and 5 deletions

View file

@ -4,7 +4,6 @@
:key :key
:index :index
:length :length
:scrollToThisItem
:intersectionObserver :intersectionObserver
:isIntersecting :isIntersecting
:isCached :isCached

View file

@ -37,7 +37,7 @@
items="{{$timelineItemIds}}" items="{{$timelineItemIds}}"
shown="{{$initialized}}" shown="{{$initialized}}"
on:initializedVisibleItems="initialize()" on:initializedVisibleItems="initialize()"
scrollToItem="{{timelineValue}}" scrollToItem="{{scrollToItem}}"
realm="{{$currentInstance + '/' + timeline}}" realm="{{$currentInstance + '/' + timeline}}"
/> />
{{/if}} {{/if}}
@ -115,9 +115,17 @@
timelineValue: (timeline) => { timelineValue: (timeline) => {
return timeline.split('/').slice(-1)[0] return timeline.split('/').slice(-1)[0]
}, },
// for threads, it's simpler to just render all items due to need to scroll to the right item // for threads, it's simpler to just render all items as a pseudo-virtual list
// TODO: this can be optimized to use a virtual list // due to need to scroll to the right item and thus calculate all item heights up-front
virtual: (timelineType) => timelineType !=='status' virtual: (timelineType) => timelineType !=='status',
scrollToItem: (timelineType, timelineValue, $firstTimelineItemId) => {
// Scroll to the first item if this is a "status in own thread" timeline.
// Don't scroll to the first item because it obscures the "back" button.
return timelineType === 'status'
&& $firstTimelineItemId
&& timelineValue !== $firstTimelineItemId
&& timelineValue
}
}, },
store: () => store, store: () => store,
components: { components: {

View file

@ -16,5 +16,6 @@ export function timelineComputations (store) {
computeForTimeline(store, 'lastFocusedElementSelector') computeForTimeline(store, 'lastFocusedElementSelector')
computeForTimeline(store, 'ignoreBlurEvents') computeForTimeline(store, 'ignoreBlurEvents')
store.compute('firstTimelineItemId', ['timelineItemIds'], (timelineItemIds) => timelineItemIds && timelineItemIds.length && timelineItemIds[0])
store.compute('lastTimelineItemId', ['timelineItemIds'], (timelineItemIds) => timelineItemIds && timelineItemIds.length && timelineItemIds[timelineItemIds.length - 1]) store.compute('lastTimelineItemId', ['timelineItemIds'], (timelineItemIds) => timelineItemIds && timelineItemIds.length && timelineItemIds[timelineItemIds.length - 1])
} }