mirror of
https://github.com/immich-app/immich.git
synced 2024-12-29 15:11:58 +00:00
fix(web): timeline group date formatting (#11392)
* fix(web): timeline group date formatting * add isValid check * remove duplicate type
This commit is contained in:
parent
0237f9baa3
commit
7445dad0dd
2 changed files with 59 additions and 6 deletions
49
web/src/lib/utils/timeline-util.spec.ts
Normal file
49
web/src/lib/utils/timeline-util.spec.ts
Normal file
|
@ -0,0 +1,49 @@
|
|||
import { formatGroupTitle } from '$lib/utils/timeline-util';
|
||||
import { DateTime } from 'luxon';
|
||||
|
||||
describe('formatGroupTitle', () => {
|
||||
beforeAll(() => {
|
||||
vi.useFakeTimers();
|
||||
vi.setSystemTime(new Date('2024-07-27T12:00:00Z'));
|
||||
});
|
||||
|
||||
afterAll(() => {
|
||||
vi.useRealTimers();
|
||||
});
|
||||
|
||||
it('formats today', () => {
|
||||
const date = DateTime.fromISO('2024-07-27T01:00:00Z');
|
||||
expect(formatGroupTitle(date.setLocale('en'))).toBe('today');
|
||||
expect(formatGroupTitle(date.setLocale('es'))).toBe('hoy');
|
||||
});
|
||||
|
||||
it('formats yesterday', () => {
|
||||
const date = DateTime.fromISO('2024-07-26T23:59:59Z');
|
||||
expect(formatGroupTitle(date.setLocale('en'))).toBe('yesterday');
|
||||
expect(formatGroupTitle(date.setLocale('fr'))).toBe('hier');
|
||||
});
|
||||
|
||||
it('formats last week', () => {
|
||||
const date = DateTime.fromISO('2024-07-21T00:00:00Z');
|
||||
expect(formatGroupTitle(date.setLocale('en'))).toBe('Sunday');
|
||||
expect(formatGroupTitle(date.setLocale('ar-SA'))).toBe('الأحد');
|
||||
});
|
||||
|
||||
it('formats date 7 days ago', () => {
|
||||
const date = DateTime.fromISO('2024-07-20T00:00:00Z');
|
||||
expect(formatGroupTitle(date.setLocale('en'))).toBe('Sat, Jul 20');
|
||||
expect(formatGroupTitle(date.setLocale('de'))).toBe('Sa., 20. Juli');
|
||||
});
|
||||
|
||||
it('formats date this year', () => {
|
||||
const date = DateTime.fromISO('2020-01-01T00:00:00Z');
|
||||
expect(formatGroupTitle(date.setLocale('en'))).toBe('Wed, Jan 1, 2020');
|
||||
expect(formatGroupTitle(date.setLocale('ja'))).toBe('2020年1月1日(水)');
|
||||
});
|
||||
|
||||
it('returns "Invalid DateTime" when date is invalid', () => {
|
||||
const date = DateTime.invalid('test');
|
||||
expect(formatGroupTitle(date.setLocale('en'))).toBe('Invalid DateTime');
|
||||
expect(formatGroupTitle(date.setLocale('es'))).toBe('Invalid DateTime');
|
||||
});
|
||||
});
|
|
@ -1,7 +1,7 @@
|
|||
import { locale } from '$lib/stores/preferences.store';
|
||||
import type { AssetResponseDto } from '@immich/sdk';
|
||||
import { groupBy, sortBy } from 'lodash-es';
|
||||
import { DateTime, Interval } from 'luxon';
|
||||
import { DateTime } from 'luxon';
|
||||
import { get } from 'svelte/store';
|
||||
|
||||
export const fromLocalDateTime = (localDateTime: string) =>
|
||||
|
@ -14,21 +14,25 @@ export const groupDateFormat: Intl.DateTimeFormatOptions = {
|
|||
year: 'numeric',
|
||||
};
|
||||
|
||||
export function formatGroupTitle(date: DateTime): string {
|
||||
export function formatGroupTitle(_date: DateTime): string {
|
||||
if (!_date.isValid) {
|
||||
return _date.toString();
|
||||
}
|
||||
const date = _date as DateTime<true>;
|
||||
const today = DateTime.now().startOf('day');
|
||||
|
||||
// Today
|
||||
if (today.hasSame(date, 'day')) {
|
||||
return 'Today';
|
||||
return date.toRelativeCalendar();
|
||||
}
|
||||
|
||||
// Yesterday
|
||||
if (Interval.fromDateTimes(date, today).length('days') == 1) {
|
||||
return 'Yesterday';
|
||||
if (today.minus({ days: 1 }).hasSame(date, 'day')) {
|
||||
return date.toRelativeCalendar();
|
||||
}
|
||||
|
||||
// Last week
|
||||
if (Interval.fromDateTimes(date, today).length('weeks') < 1) {
|
||||
if (date >= today.minus({ days: 6 })) {
|
||||
return date.toLocaleString({ weekday: 'long' });
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in a new issue