Change onboarding prompt to follow suggestions carousel in web UI (#28878)
This commit is contained in:
parent
7316a08380
commit
9cdc60ecc6
17 changed files with 507 additions and 138 deletions
|
@ -17,6 +17,9 @@ import {
|
|||
TIMELINE_DISCONNECT,
|
||||
TIMELINE_LOAD_PENDING,
|
||||
TIMELINE_MARK_AS_PARTIAL,
|
||||
TIMELINE_INSERT,
|
||||
TIMELINE_GAP,
|
||||
TIMELINE_SUGGESTIONS,
|
||||
} from '../actions/timelines';
|
||||
import { compareId } from '../compare_id';
|
||||
|
||||
|
@ -32,6 +35,8 @@ const initialTimeline = ImmutableMap({
|
|||
items: ImmutableList(),
|
||||
});
|
||||
|
||||
const isPlaceholder = value => value === TIMELINE_GAP || value === TIMELINE_SUGGESTIONS;
|
||||
|
||||
const expandNormalizedTimeline = (state, timeline, statuses, next, isPartial, isLoadingRecent, usePendingItems) => {
|
||||
// This method is pretty tricky because:
|
||||
// - existing items in the timeline might be out of order
|
||||
|
@ -63,20 +68,20 @@ const expandNormalizedTimeline = (state, timeline, statuses, next, isPartial, is
|
|||
// First, find the furthest (if properly sorted, oldest) item in the timeline that is
|
||||
// newer than the oldest fetched one, as it's most likely that it delimits the gap.
|
||||
// Start the gap *after* that item.
|
||||
const lastIndex = oldIds.findLastIndex(id => id !== null && compareId(id, newIds.last()) >= 0) + 1;
|
||||
const lastIndex = oldIds.findLastIndex(id => !isPlaceholder(id) && compareId(id, newIds.last()) >= 0) + 1;
|
||||
|
||||
// Then, try to find the furthest (if properly sorted, oldest) item in the timeline that
|
||||
// is newer than the most recent fetched one, as it delimits a section comprised of only
|
||||
// items older or within `newIds` (or that were deleted from the server, so should be removed
|
||||
// anyway).
|
||||
// Stop the gap *after* that item.
|
||||
const firstIndex = oldIds.take(lastIndex).findLastIndex(id => id !== null && compareId(id, newIds.first()) > 0) + 1;
|
||||
const firstIndex = oldIds.take(lastIndex).findLastIndex(id => !isPlaceholder(id) && compareId(id, newIds.first()) > 0) + 1;
|
||||
|
||||
let insertedIds = ImmutableOrderedSet(newIds).withMutations(insertedIds => {
|
||||
// It is possible, though unlikely, that the slice we are replacing contains items older
|
||||
// than the elements we got from the API. Get them and add them back at the back of the
|
||||
// slice.
|
||||
const olderIds = oldIds.slice(firstIndex, lastIndex).filter(id => id !== null && compareId(id, newIds.last()) < 0);
|
||||
const olderIds = oldIds.slice(firstIndex, lastIndex).filter(id => !isPlaceholder(id) && compareId(id, newIds.last()) < 0);
|
||||
insertedIds.union(olderIds);
|
||||
|
||||
// Make sure we aren't inserting duplicates
|
||||
|
@ -84,8 +89,8 @@ const expandNormalizedTimeline = (state, timeline, statuses, next, isPartial, is
|
|||
}).toList();
|
||||
|
||||
// Finally, insert a gap marker if the data is marked as partial by the server
|
||||
if (isPartial && (firstIndex === 0 || oldIds.get(firstIndex - 1) !== null)) {
|
||||
insertedIds = insertedIds.unshift(null);
|
||||
if (isPartial && (firstIndex === 0 || oldIds.get(firstIndex - 1) !== TIMELINE_GAP)) {
|
||||
insertedIds = insertedIds.unshift(TIMELINE_GAP);
|
||||
}
|
||||
|
||||
return oldIds.take(firstIndex).concat(
|
||||
|
@ -178,7 +183,7 @@ const reconnectTimeline = (state, usePendingItems) => {
|
|||
}
|
||||
|
||||
return state.withMutations(mMap => {
|
||||
mMap.update(usePendingItems ? 'pendingItems' : 'items', items => items.first() ? items.unshift(null) : items);
|
||||
mMap.update(usePendingItems ? 'pendingItems' : 'items', items => items.first() ? items.unshift(TIMELINE_GAP) : items);
|
||||
mMap.set('online', true);
|
||||
});
|
||||
};
|
||||
|
@ -213,7 +218,7 @@ export default function timelines(state = initialState, action) {
|
|||
return state.update(
|
||||
action.timeline,
|
||||
initialTimeline,
|
||||
map => map.set('online', false).update(action.usePendingItems ? 'pendingItems' : 'items', items => items.first() ? items.unshift(null) : items),
|
||||
map => map.set('online', false).update(action.usePendingItems ? 'pendingItems' : 'items', items => items.first() ? items.unshift(TIMELINE_GAP) : items),
|
||||
);
|
||||
case TIMELINE_MARK_AS_PARTIAL:
|
||||
return state.update(
|
||||
|
@ -221,6 +226,18 @@ export default function timelines(state = initialState, action) {
|
|||
initialTimeline,
|
||||
map => map.set('isPartial', true).set('items', ImmutableList()).set('pendingItems', ImmutableList()).set('unread', 0),
|
||||
);
|
||||
case TIMELINE_INSERT:
|
||||
return state.update(
|
||||
action.timeline,
|
||||
initialTimeline,
|
||||
map => map.update('items', ImmutableList(), list => {
|
||||
if (!list.includes(action.key)) {
|
||||
return list.insert(action.index, action.key);
|
||||
}
|
||||
|
||||
return list;
|
||||
})
|
||||
);
|
||||
default:
|
||||
return state;
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue