Media Gallery: Scroll down and into the past
Co-authored-by: Fedor Indutny <79877362+indutny-signal@users.noreply.github.com>
This commit is contained in:
Scott Nonnenberg
GitHub
parent
6f83043eb4
commit
0d5a480c1b
32 changed files with 844 additions and 887 deletions
|
|
@ -0,0 +1,97 @@
|
|||
// Copyright 2024 Signal Messenger, LLC
|
||||
// SPDX-License-Identifier: AGPL-3.0-only
|
||||
|
||||
import { assert } from 'chai';
|
||||
import { shuffle } from 'lodash';
|
||||
|
||||
import { IMAGE_JPEG } from '../../../types/MIME';
|
||||
import { groupMediaItemsByDate } from '../../../components/conversation/media-gallery/groupMediaItemsByDate';
|
||||
import type { MediaItemType } from '../../../types/MediaItem';
|
||||
import { fakeAttachment } from '../../../test-both/helpers/fakeAttachment';
|
||||
|
||||
const testDate = (
|
||||
year: number,
|
||||
month: number,
|
||||
day: number,
|
||||
hour: number,
|
||||
minute: number,
|
||||
second = 0
|
||||
): Date => new Date(year, month - 1, day, hour, minute, second, 0);
|
||||
|
||||
const toMediaItem = (id: string, date: Date): MediaItemType => {
|
||||
return {
|
||||
objectURL: id,
|
||||
index: 0,
|
||||
message: {
|
||||
conversationId: '1234',
|
||||
id: 'id',
|
||||
receivedAt: date.getTime(),
|
||||
receivedAtMs: date.getTime(),
|
||||
attachments: [],
|
||||
sentAt: date.getTime(),
|
||||
},
|
||||
attachment: fakeAttachment({
|
||||
fileName: 'fileName',
|
||||
contentType: IMAGE_JPEG,
|
||||
url: 'url',
|
||||
}),
|
||||
};
|
||||
};
|
||||
|
||||
describe('groupMediaItemsByDate', () => {
|
||||
it('should group mediaItems', () => {
|
||||
const referenceTime = testDate(2024, 4, 12, 18, 0, 0).getTime(); // Friday
|
||||
const input: Array<MediaItemType> = shuffle([
|
||||
toMediaItem('today-1', testDate(2024, 4, 12, 17, 59)), // Friday, one minute ago
|
||||
toMediaItem('today-2', testDate(2024, 4, 12, 0, 1)), // Friday early morning
|
||||
toMediaItem('yesterday-1', testDate(2024, 4, 11, 18, 0)), // Thursday
|
||||
toMediaItem('yesterday-2', testDate(2024, 4, 11, 0, 1)), // Thursday early morning
|
||||
toMediaItem('thisWeek-1', testDate(2024, 4, 10, 18, 0)), // Wednesday
|
||||
toMediaItem('thisWeek-2', testDate(2024, 4, 8, 18, 0)), // Monday
|
||||
toMediaItem('thisWeek-3', testDate(2024, 4, 5, 18, 0)), // Last Friday
|
||||
toMediaItem('thisWeek-4', testDate(2024, 4, 5, 0, 1)), // Last Friday early morning
|
||||
toMediaItem('thisMonth-1', testDate(2024, 4, 2, 18, 0)), // Second day of moth
|
||||
toMediaItem('thisMonth-2', testDate(2024, 4, 1, 18, 0)), // First day of month
|
||||
toMediaItem('mar2024-1', testDate(2024, 3, 31, 23, 59)),
|
||||
toMediaItem('mar2024-2', testDate(2024, 3, 1, 0, 1)),
|
||||
toMediaItem('feb2011-1', testDate(2011, 2, 28, 23, 59)),
|
||||
toMediaItem('feb2011-2', testDate(2011, 2, 1, 0, 1)),
|
||||
]);
|
||||
|
||||
const actual = groupMediaItemsByDate(referenceTime, input);
|
||||
|
||||
assert.strictEqual(actual[0].type, 'today');
|
||||
assert.strictEqual(actual[0].mediaItems.length, 2, 'today');
|
||||
assert.strictEqual(actual[0].mediaItems[0].objectURL, 'today-1');
|
||||
assert.strictEqual(actual[0].mediaItems[1].objectURL, 'today-2');
|
||||
|
||||
assert.strictEqual(actual[1].type, 'yesterday');
|
||||
assert.strictEqual(actual[1].mediaItems.length, 2, 'yesterday');
|
||||
assert.strictEqual(actual[1].mediaItems[0].objectURL, 'yesterday-1');
|
||||
assert.strictEqual(actual[1].mediaItems[1].objectURL, 'yesterday-2');
|
||||
|
||||
assert.strictEqual(actual[2].type, 'thisWeek');
|
||||
assert.strictEqual(actual[2].mediaItems.length, 4, 'thisWeek');
|
||||
assert.strictEqual(actual[2].mediaItems[0].objectURL, 'thisWeek-1');
|
||||
assert.strictEqual(actual[2].mediaItems[1].objectURL, 'thisWeek-2');
|
||||
assert.strictEqual(actual[2].mediaItems[2].objectURL, 'thisWeek-3');
|
||||
assert.strictEqual(actual[2].mediaItems[3].objectURL, 'thisWeek-4');
|
||||
|
||||
assert.strictEqual(actual[3].type, 'thisMonth');
|
||||
assert.strictEqual(actual[3].mediaItems.length, 2, 'thisMonth');
|
||||
assert.strictEqual(actual[3].mediaItems[0].objectURL, 'thisMonth-1');
|
||||
assert.strictEqual(actual[3].mediaItems[1].objectURL, 'thisMonth-2');
|
||||
|
||||
assert.strictEqual(actual[4].type, 'yearMonth');
|
||||
assert.strictEqual(actual[4].mediaItems.length, 2, 'mar2024');
|
||||
assert.strictEqual(actual[4].mediaItems[0].objectURL, 'mar2024-1');
|
||||
assert.strictEqual(actual[4].mediaItems[1].objectURL, 'mar2024-2');
|
||||
|
||||
assert.strictEqual(actual[5].type, 'yearMonth');
|
||||
assert.strictEqual(actual[5].mediaItems.length, 2, 'feb2011');
|
||||
assert.strictEqual(actual[5].mediaItems[0].objectURL, 'feb2011-1');
|
||||
assert.strictEqual(actual[5].mediaItems[1].objectURL, 'feb2011-2');
|
||||
|
||||
assert.strictEqual(actual.length, 6, 'total sections');
|
||||
});
|
||||
});
|
||||
|
|
@ -1,271 +0,0 @@
|
|||
// Copyright 2018 Signal Messenger, LLC
|
||||
// SPDX-License-Identifier: AGPL-3.0-only
|
||||
|
||||
import { assert } from 'chai';
|
||||
import { shuffle } from 'lodash';
|
||||
|
||||
import { IMAGE_JPEG } from '../../../types/MIME';
|
||||
import type { Section } from '../../../components/conversation/media-gallery/groupMediaItemsByDate';
|
||||
import { groupMediaItemsByDate } from '../../../components/conversation/media-gallery/groupMediaItemsByDate';
|
||||
import type { MediaItemType } from '../../../types/MediaItem';
|
||||
import { fakeAttachment } from '../../../test-both/helpers/fakeAttachment';
|
||||
|
||||
const testDate = (
|
||||
year: number,
|
||||
month: number,
|
||||
day: number,
|
||||
hour: number,
|
||||
minute: number,
|
||||
second = 0
|
||||
): Date => new Date(Date.UTC(year, month - 1, day, hour, minute, second, 0));
|
||||
|
||||
const toMediaItem = (date: Date): MediaItemType => ({
|
||||
objectURL: date.toUTCString(),
|
||||
index: 0,
|
||||
message: {
|
||||
conversationId: '1234',
|
||||
id: 'id',
|
||||
received_at: date.getTime(),
|
||||
received_at_ms: date.getTime(),
|
||||
attachments: [],
|
||||
sent_at: date.getTime(),
|
||||
},
|
||||
attachment: fakeAttachment({
|
||||
fileName: 'fileName',
|
||||
contentType: IMAGE_JPEG,
|
||||
url: 'url',
|
||||
}),
|
||||
});
|
||||
|
||||
describe('groupMediaItemsByDate', () => {
|
||||
it('should group mediaItems', () => {
|
||||
const referenceTime = testDate(2018, 4, 12, 18, 0, 0).getTime(); // Thu
|
||||
const input: Array<MediaItemType> = shuffle([
|
||||
// Today
|
||||
toMediaItem(testDate(2018, 4, 12, 12, 0)), // Thu
|
||||
toMediaItem(testDate(2018, 4, 12, 0, 1)), // Thu
|
||||
// This week
|
||||
toMediaItem(testDate(2018, 4, 11, 23, 59)), // Wed
|
||||
toMediaItem(testDate(2018, 4, 9, 0, 1)), // Mon
|
||||
// This month
|
||||
toMediaItem(testDate(2018, 4, 8, 23, 59)), // Sun
|
||||
toMediaItem(testDate(2018, 4, 1, 0, 1)),
|
||||
// March 2018
|
||||
toMediaItem(testDate(2018, 3, 31, 23, 59)),
|
||||
toMediaItem(testDate(2018, 3, 1, 14, 0)),
|
||||
// February 2011
|
||||
toMediaItem(testDate(2011, 2, 28, 23, 59)),
|
||||
toMediaItem(testDate(2011, 2, 1, 10, 0)),
|
||||
]);
|
||||
|
||||
const expected: Array<Section> = [
|
||||
{
|
||||
type: 'today',
|
||||
mediaItems: [
|
||||
{
|
||||
objectURL: 'Thu, 12 Apr 2018 12:00:00 GMT',
|
||||
index: 0,
|
||||
message: {
|
||||
conversationId: '1234',
|
||||
id: 'id',
|
||||
received_at: 1523534400000,
|
||||
received_at_ms: 1523534400000,
|
||||
attachments: [],
|
||||
sent_at: 1523534400000,
|
||||
},
|
||||
attachment: fakeAttachment({
|
||||
fileName: 'fileName',
|
||||
contentType: IMAGE_JPEG,
|
||||
url: 'url',
|
||||
}),
|
||||
},
|
||||
{
|
||||
objectURL: 'Thu, 12 Apr 2018 00:01:00 GMT',
|
||||
index: 0,
|
||||
message: {
|
||||
conversationId: '1234',
|
||||
id: 'id',
|
||||
received_at: 1523491260000,
|
||||
received_at_ms: 1523491260000,
|
||||
attachments: [],
|
||||
sent_at: 1523491260000,
|
||||
},
|
||||
attachment: fakeAttachment({
|
||||
fileName: 'fileName',
|
||||
contentType: IMAGE_JPEG,
|
||||
url: 'url',
|
||||
}),
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
type: 'yesterday',
|
||||
mediaItems: [
|
||||
{
|
||||
objectURL: 'Wed, 11 Apr 2018 23:59:00 GMT',
|
||||
index: 0,
|
||||
message: {
|
||||
conversationId: '1234',
|
||||
id: 'id',
|
||||
received_at: 1523491140000,
|
||||
received_at_ms: 1523491140000,
|
||||
attachments: [],
|
||||
sent_at: 1523491140000,
|
||||
},
|
||||
attachment: fakeAttachment({
|
||||
fileName: 'fileName',
|
||||
contentType: IMAGE_JPEG,
|
||||
url: 'url',
|
||||
}),
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
type: 'thisWeek',
|
||||
mediaItems: [
|
||||
{
|
||||
objectURL: 'Mon, 09 Apr 2018 00:01:00 GMT',
|
||||
index: 0,
|
||||
message: {
|
||||
conversationId: '1234',
|
||||
id: 'id',
|
||||
received_at: 1523232060000,
|
||||
received_at_ms: 1523232060000,
|
||||
attachments: [],
|
||||
sent_at: 1523232060000,
|
||||
},
|
||||
attachment: fakeAttachment({
|
||||
fileName: 'fileName',
|
||||
contentType: IMAGE_JPEG,
|
||||
url: 'url',
|
||||
}),
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
type: 'thisMonth',
|
||||
mediaItems: [
|
||||
{
|
||||
objectURL: 'Sun, 08 Apr 2018 23:59:00 GMT',
|
||||
index: 0,
|
||||
message: {
|
||||
conversationId: '1234',
|
||||
id: 'id',
|
||||
received_at: 1523231940000,
|
||||
received_at_ms: 1523231940000,
|
||||
attachments: [],
|
||||
sent_at: 1523231940000,
|
||||
},
|
||||
attachment: fakeAttachment({
|
||||
fileName: 'fileName',
|
||||
contentType: IMAGE_JPEG,
|
||||
url: 'url',
|
||||
}),
|
||||
},
|
||||
{
|
||||
objectURL: 'Sun, 01 Apr 2018 00:01:00 GMT',
|
||||
index: 0,
|
||||
message: {
|
||||
conversationId: '1234',
|
||||
id: 'id',
|
||||
received_at: 1522540860000,
|
||||
received_at_ms: 1522540860000,
|
||||
attachments: [],
|
||||
sent_at: 1522540860000,
|
||||
},
|
||||
attachment: fakeAttachment({
|
||||
fileName: 'fileName',
|
||||
contentType: IMAGE_JPEG,
|
||||
url: 'url',
|
||||
}),
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
type: 'yearMonth',
|
||||
year: 2018,
|
||||
month: 2,
|
||||
mediaItems: [
|
||||
{
|
||||
objectURL: 'Sat, 31 Mar 2018 23:59:00 GMT',
|
||||
index: 0,
|
||||
message: {
|
||||
conversationId: '1234',
|
||||
id: 'id',
|
||||
received_at: 1522540740000,
|
||||
received_at_ms: 1522540740000,
|
||||
attachments: [],
|
||||
sent_at: 1522540740000,
|
||||
},
|
||||
attachment: fakeAttachment({
|
||||
fileName: 'fileName',
|
||||
contentType: IMAGE_JPEG,
|
||||
url: 'url',
|
||||
}),
|
||||
},
|
||||
{
|
||||
objectURL: 'Thu, 01 Mar 2018 14:00:00 GMT',
|
||||
index: 0,
|
||||
message: {
|
||||
conversationId: '1234',
|
||||
id: 'id',
|
||||
received_at: 1519912800000,
|
||||
received_at_ms: 1519912800000,
|
||||
attachments: [],
|
||||
sent_at: 1519912800000,
|
||||
},
|
||||
attachment: fakeAttachment({
|
||||
fileName: 'fileName',
|
||||
contentType: IMAGE_JPEG,
|
||||
url: 'url',
|
||||
}),
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
type: 'yearMonth',
|
||||
year: 2011,
|
||||
month: 1,
|
||||
mediaItems: [
|
||||
{
|
||||
objectURL: 'Mon, 28 Feb 2011 23:59:00 GMT',
|
||||
index: 0,
|
||||
message: {
|
||||
conversationId: '1234',
|
||||
id: 'id',
|
||||
received_at: 1298937540000,
|
||||
received_at_ms: 1298937540000,
|
||||
attachments: [],
|
||||
sent_at: 1298937540000,
|
||||
},
|
||||
attachment: fakeAttachment({
|
||||
fileName: 'fileName',
|
||||
contentType: IMAGE_JPEG,
|
||||
url: 'url',
|
||||
}),
|
||||
},
|
||||
{
|
||||
objectURL: 'Tue, 01 Feb 2011 10:00:00 GMT',
|
||||
index: 0,
|
||||
message: {
|
||||
conversationId: '1234',
|
||||
id: 'id',
|
||||
received_at: 1296554400000,
|
||||
received_at_ms: 1296554400000,
|
||||
attachments: [],
|
||||
sent_at: 1296554400000,
|
||||
},
|
||||
attachment: fakeAttachment({
|
||||
fileName: 'fileName',
|
||||
contentType: IMAGE_JPEG,
|
||||
url: 'url',
|
||||
}),
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
const actual = groupMediaItemsByDate(referenceTime, input);
|
||||
assert.deepEqual(actual, expected);
|
||||
});
|
||||
});
|
||||
Loading…
Add table
Add a link
Reference in a new issue