feat: recently added assets page (#28272)

* feat(server): add ordering date option to time buckets

* feat(web): add recently added page

* feat(server): recently created assets in explore data

* feat(web): recently added in explore tab

* fix: recently added assets ordering

* fix(server): failing bucket test

* feat(web): improve recently added preview

* chore: update e2e explore/timeline tests

* chore: rename and refactor timeline ordering dates

* fix(web): invalid timeline option

* feat(mobile): recently added page

* fix(server): sync tests

* fix(mobile): resync assets to get uploadedAt column

* chore: rename assetorderby enum

* chore(mobile): formatting

* minor fixes

* stylings

---------

Co-authored-by: Alex <alex.tran1502@gmail.com>

mobile/openapi/lib/model/asset_order_by.dart

@@ -0,0 +1,85 @@
+//
+// AUTO-GENERATED FILE, DO NOT MODIFY!
+//
+// @dart=2.18
+
+// ignore_for_file: unused_element, unused_import
+// ignore_for_file: always_put_required_named_parameters_first
+// ignore_for_file: constant_identifier_names
+// ignore_for_file: lines_longer_than_80_chars
+
+part of openapi.api;
+
+/// Asset sorting property
+class AssetOrderBy {
+  /// Instantiate a new enum with the provided [value].
+  const AssetOrderBy._(this.value);
+
+  /// The underlying value of this enum member.
+  final String value;
+
+  @override
+  String toString() => value;
+
+  String toJson() => value;
+
+  static const takenAt = AssetOrderBy._(r'takenAt');
+  static const createdAt = AssetOrderBy._(r'createdAt');
+
+  /// List of all possible values in this [enum][AssetOrderBy].
+  static const values = <AssetOrderBy>[
+    takenAt,
+    createdAt,
+  ];
+
+  static AssetOrderBy? fromJson(dynamic value) => AssetOrderByTypeTransformer().decode(value);
+
+  static List<AssetOrderBy> listFromJson(dynamic json, {bool growable = false,}) {
+    final result = <AssetOrderBy>[];
+    if (json is List && json.isNotEmpty) {
+      for (final row in json) {
+        final value = AssetOrderBy.fromJson(row);
+        if (value != null) {
+          result.add(value);
+        }
+      }
+    }
+    return result.toList(growable: growable);
+  }
+}
+
+/// Transformation class that can [encode] an instance of [AssetOrderBy] to String,
+/// and [decode] dynamic data back to [AssetOrderBy].
+class AssetOrderByTypeTransformer {
+  factory AssetOrderByTypeTransformer() => _instance ??= const AssetOrderByTypeTransformer._();
+
+  const AssetOrderByTypeTransformer._();
+
+  String encode(AssetOrderBy data) => data.value;
+
+  /// Decodes a [dynamic value][data] to a AssetOrderBy.
+  ///
+  /// If [allowNull] is true and the [dynamic value][data] cannot be decoded successfully,
+  /// then null is returned. However, if [allowNull] is false and the [dynamic value][data]
+  /// cannot be decoded successfully, then an [UnimplementedError] is thrown.
+  ///
+  /// The [allowNull] is very handy when an API changes and a new enum value is added or removed,
+  /// and users are still using an old app with the old code.
+  AssetOrderBy? decode(dynamic data, {bool allowNull = true}) {
+    if (data != null) {
+      switch (data) {
+        case r'takenAt': return AssetOrderBy.takenAt;
+        case r'createdAt': return AssetOrderBy.createdAt;
+        default:
+          if (!allowNull) {
+            throw ArgumentError('Unknown enum value to decode: $data');
+          }
+      }
+    }
+    return null;
+  }
+
+  /// Singleton [AssetOrderByTypeTransformer] instance.
+  static AssetOrderByTypeTransformer? _instance;
+}
+

mobile/openapi/lib/model/sync_asset_v1.dart

@@ -14,6 +14,7 @@ class SyncAssetV1 {
   /// Returns a new [SyncAssetV1] instance.
   SyncAssetV1({
     required this.checksum,
+    required this.createdAt,
     required this.deletedAt,
     required this.duration,
     required this.fileCreatedAt,
@@ -37,6 +38,9 @@ class SyncAssetV1 {
   /// Checksum
   String checksum;
 
+  /// Uploaded to Immich at
+  DateTime? createdAt;
+
   /// Deleted at
   DateTime? deletedAt;
 
@@ -98,6 +102,7 @@ class SyncAssetV1 {
   @override
   bool operator ==(Object other) => identical(this, other) || other is SyncAssetV1 &&
     other.checksum == checksum &&
+    other.createdAt == createdAt &&
     other.deletedAt == deletedAt &&
     other.duration == duration &&
     other.fileCreatedAt == fileCreatedAt &&
@@ -121,6 +126,7 @@ class SyncAssetV1 {
   int get hashCode =>
     // ignore: unnecessary_parenthesis
     (checksum.hashCode) +
+    (createdAt == null ? 0 : createdAt!.hashCode) +
     (deletedAt == null ? 0 : deletedAt!.hashCode) +
     (duration == null ? 0 : duration!.hashCode) +
     (fileCreatedAt == null ? 0 : fileCreatedAt!.hashCode) +
@@ -141,11 +147,18 @@ class SyncAssetV1 {
     (width == null ? 0 : width!.hashCode);
 
   @override
-  String toString() => 'SyncAssetV1[checksum=$checksum, deletedAt=$deletedAt, duration=$duration, fileCreatedAt=$fileCreatedAt, fileModifiedAt=$fileModifiedAt, height=$height, id=$id, isEdited=$isEdited, isFavorite=$isFavorite, libraryId=$libraryId, livePhotoVideoId=$livePhotoVideoId, localDateTime=$localDateTime, originalFileName=$originalFileName, ownerId=$ownerId, stackId=$stackId, thumbhash=$thumbhash, type=$type, visibility=$visibility, width=$width]';
+  String toString() => 'SyncAssetV1[checksum=$checksum, createdAt=$createdAt, deletedAt=$deletedAt, duration=$duration, fileCreatedAt=$fileCreatedAt, fileModifiedAt=$fileModifiedAt, height=$height, id=$id, isEdited=$isEdited, isFavorite=$isFavorite, libraryId=$libraryId, livePhotoVideoId=$livePhotoVideoId, localDateTime=$localDateTime, originalFileName=$originalFileName, ownerId=$ownerId, stackId=$stackId, thumbhash=$thumbhash, type=$type, visibility=$visibility, width=$width]';
 
   Map<String, dynamic> toJson() {
     final json = <String, dynamic>{};
       json[r'checksum'] = this.checksum;
+    if (this.createdAt != null) {
+      json[r'createdAt'] = _isEpochMarker(r'/^(?:(?:\\d\\d[2468][048]|\\d\\d[13579][26]|\\d\\d0[48]|[02468][048]00|[13579][26]00)-02-29|\\d{4}-(?:(?:0[13578]|1[02])-(?:0[1-9]|[12]\\d|3[01])|(?:0[469]|11)-(?:0[1-9]|[12]\\d|30)|(?:02)-(?:0[1-9]|1\\d|2[0-8])))T(?:(?:[01]\\d|2[0-3]):[0-5]\\d(?::[0-5]\\d(?:\\.\\d+)?)?(?:Z))$/')
+        ? this.createdAt!.millisecondsSinceEpoch
+        : this.createdAt!.toUtc().toIso8601String();
+    } else {
+    //  json[r'createdAt'] = null;
+    }
     if (this.deletedAt != null) {
       json[r'deletedAt'] = _isEpochMarker(r'/^(?:(?:\\d\\d[2468][048]|\\d\\d[13579][26]|\\d\\d0[48]|[02468][048]00|[13579][26]00)-02-29|\\d{4}-(?:(?:0[13578]|1[02])-(?:0[1-9]|[12]\\d|3[01])|(?:0[469]|11)-(?:0[1-9]|[12]\\d|30)|(?:02)-(?:0[1-9]|1\\d|2[0-8])))T(?:(?:[01]\\d|2[0-3]):[0-5]\\d(?::[0-5]\\d(?:\\.\\d+)?)?(?:Z))$/')
         ? this.deletedAt!.millisecondsSinceEpoch
@@ -229,6 +242,7 @@ class SyncAssetV1 {
 
       return SyncAssetV1(
         checksum: mapValueOfType<String>(json, r'checksum')!,
+        createdAt: mapDateTime(json, r'createdAt', r'/^(?:(?:\\d\\d[2468][048]|\\d\\d[13579][26]|\\d\\d0[48]|[02468][048]00|[13579][26]00)-02-29|\\d{4}-(?:(?:0[13578]|1[02])-(?:0[1-9]|[12]\\d|3[01])|(?:0[469]|11)-(?:0[1-9]|[12]\\d|30)|(?:02)-(?:0[1-9]|1\\d|2[0-8])))T(?:(?:[01]\\d|2[0-3]):[0-5]\\d(?::[0-5]\\d(?:\\.\\d+)?)?(?:Z))$/'),
         deletedAt: mapDateTime(json, r'deletedAt', r'/^(?:(?:\\d\\d[2468][048]|\\d\\d[13579][26]|\\d\\d0[48]|[02468][048]00|[13579][26]00)-02-29|\\d{4}-(?:(?:0[13578]|1[02])-(?:0[1-9]|[12]\\d|3[01])|(?:0[469]|11)-(?:0[1-9]|[12]\\d|30)|(?:02)-(?:0[1-9]|1\\d|2[0-8])))T(?:(?:[01]\\d|2[0-3]):[0-5]\\d(?::[0-5]\\d(?:\\.\\d+)?)?(?:Z))$/'),
         duration: mapValueOfType<String>(json, r'duration'),
         fileCreatedAt: mapDateTime(json, r'fileCreatedAt', r'/^(?:(?:\\d\\d[2468][048]|\\d\\d[13579][26]|\\d\\d0[48]|[02468][048]00|[13579][26]00)-02-29|\\d{4}-(?:(?:0[13578]|1[02])-(?:0[1-9]|[12]\\d|3[01])|(?:0[469]|11)-(?:0[1-9]|[12]\\d|30)|(?:02)-(?:0[1-9]|1\\d|2[0-8])))T(?:(?:[01]\\d|2[0-3]):[0-5]\\d(?::[0-5]\\d(?:\\.\\d+)?)?(?:Z))$/'),
@@ -295,6 +309,7 @@ class SyncAssetV1 {
   /// The list of required keys that must be present in a JSON.
   static const requiredKeys = <String>{
     'checksum',
+    'createdAt',
     'deletedAt',
     'duration',
     'fileCreatedAt',

mobile/openapi/lib/model/sync_asset_v2.dart

@@ -14,6 +14,7 @@ class SyncAssetV2 {
   /// Returns a new [SyncAssetV2] instance.
   SyncAssetV2({
     required this.checksum,
+    required this.createdAt,
     required this.deletedAt,
     required this.duration,
     required this.fileCreatedAt,
@@ -37,6 +38,9 @@ class SyncAssetV2 {
   /// Checksum
   String checksum;
 
+  /// Uploaded to Immich at
+  DateTime? createdAt;
+
   /// Deleted at
   DateTime? deletedAt;
 
@@ -101,6 +105,7 @@ class SyncAssetV2 {
   @override
   bool operator ==(Object other) => identical(this, other) || other is SyncAssetV2 &&
     other.checksum == checksum &&
+    other.createdAt == createdAt &&
     other.deletedAt == deletedAt &&
     other.duration == duration &&
     other.fileCreatedAt == fileCreatedAt &&
@@ -124,6 +129,7 @@ class SyncAssetV2 {
   int get hashCode =>
     // ignore: unnecessary_parenthesis
     (checksum.hashCode) +
+    (createdAt == null ? 0 : createdAt!.hashCode) +
     (deletedAt == null ? 0 : deletedAt!.hashCode) +
     (duration == null ? 0 : duration!.hashCode) +
     (fileCreatedAt == null ? 0 : fileCreatedAt!.hashCode) +
@@ -144,11 +150,18 @@ class SyncAssetV2 {
     (width == null ? 0 : width!.hashCode);
 
   @override
-  String toString() => 'SyncAssetV2[checksum=$checksum, deletedAt=$deletedAt, duration=$duration, fileCreatedAt=$fileCreatedAt, fileModifiedAt=$fileModifiedAt, height=$height, id=$id, isEdited=$isEdited, isFavorite=$isFavorite, libraryId=$libraryId, livePhotoVideoId=$livePhotoVideoId, localDateTime=$localDateTime, originalFileName=$originalFileName, ownerId=$ownerId, stackId=$stackId, thumbhash=$thumbhash, type=$type, visibility=$visibility, width=$width]';
+  String toString() => 'SyncAssetV2[checksum=$checksum, createdAt=$createdAt, deletedAt=$deletedAt, duration=$duration, fileCreatedAt=$fileCreatedAt, fileModifiedAt=$fileModifiedAt, height=$height, id=$id, isEdited=$isEdited, isFavorite=$isFavorite, libraryId=$libraryId, livePhotoVideoId=$livePhotoVideoId, localDateTime=$localDateTime, originalFileName=$originalFileName, ownerId=$ownerId, stackId=$stackId, thumbhash=$thumbhash, type=$type, visibility=$visibility, width=$width]';
 
   Map<String, dynamic> toJson() {
     final json = <String, dynamic>{};
       json[r'checksum'] = this.checksum;
+    if (this.createdAt != null) {
+      json[r'createdAt'] = _isEpochMarker(r'/^(?:(?:\\d\\d[2468][048]|\\d\\d[13579][26]|\\d\\d0[48]|[02468][048]00|[13579][26]00)-02-29|\\d{4}-(?:(?:0[13578]|1[02])-(?:0[1-9]|[12]\\d|3[01])|(?:0[469]|11)-(?:0[1-9]|[12]\\d|30)|(?:02)-(?:0[1-9]|1\\d|2[0-8])))T(?:(?:[01]\\d|2[0-3]):[0-5]\\d(?::[0-5]\\d(?:\\.\\d+)?)?(?:Z))$/')
+        ? this.createdAt!.millisecondsSinceEpoch
+        : this.createdAt!.toUtc().toIso8601String();
+    } else {
+    //  json[r'createdAt'] = null;
+    }
     if (this.deletedAt != null) {
       json[r'deletedAt'] = _isEpochMarker(r'/^(?:(?:\\d\\d[2468][048]|\\d\\d[13579][26]|\\d\\d0[48]|[02468][048]00|[13579][26]00)-02-29|\\d{4}-(?:(?:0[13578]|1[02])-(?:0[1-9]|[12]\\d|3[01])|(?:0[469]|11)-(?:0[1-9]|[12]\\d|30)|(?:02)-(?:0[1-9]|1\\d|2[0-8])))T(?:(?:[01]\\d|2[0-3]):[0-5]\\d(?::[0-5]\\d(?:\\.\\d+)?)?(?:Z))$/')
         ? this.deletedAt!.millisecondsSinceEpoch
@@ -232,6 +245,7 @@ class SyncAssetV2 {
 
       return SyncAssetV2(
         checksum: mapValueOfType<String>(json, r'checksum')!,
+        createdAt: mapDateTime(json, r'createdAt', r'/^(?:(?:\\d\\d[2468][048]|\\d\\d[13579][26]|\\d\\d0[48]|[02468][048]00|[13579][26]00)-02-29|\\d{4}-(?:(?:0[13578]|1[02])-(?:0[1-9]|[12]\\d|3[01])|(?:0[469]|11)-(?:0[1-9]|[12]\\d|30)|(?:02)-(?:0[1-9]|1\\d|2[0-8])))T(?:(?:[01]\\d|2[0-3]):[0-5]\\d(?::[0-5]\\d(?:\\.\\d+)?)?(?:Z))$/'),
         deletedAt: mapDateTime(json, r'deletedAt', r'/^(?:(?:\\d\\d[2468][048]|\\d\\d[13579][26]|\\d\\d0[48]|[02468][048]00|[13579][26]00)-02-29|\\d{4}-(?:(?:0[13578]|1[02])-(?:0[1-9]|[12]\\d|3[01])|(?:0[469]|11)-(?:0[1-9]|[12]\\d|30)|(?:02)-(?:0[1-9]|1\\d|2[0-8])))T(?:(?:[01]\\d|2[0-3]):[0-5]\\d(?::[0-5]\\d(?:\\.\\d+)?)?(?:Z))$/'),
         duration: mapValueOfType<int>(json, r'duration'),
         fileCreatedAt: mapDateTime(json, r'fileCreatedAt', r'/^(?:(?:\\d\\d[2468][048]|\\d\\d[13579][26]|\\d\\d0[48]|[02468][048]00|[13579][26]00)-02-29|\\d{4}-(?:(?:0[13578]|1[02])-(?:0[1-9]|[12]\\d|3[01])|(?:0[469]|11)-(?:0[1-9]|[12]\\d|30)|(?:02)-(?:0[1-9]|1\\d|2[0-8])))T(?:(?:[01]\\d|2[0-3]):[0-5]\\d(?::[0-5]\\d(?:\\.\\d+)?)?(?:Z))$/'),
@@ -298,6 +312,7 @@ class SyncAssetV2 {
   /// The list of required keys that must be present in a JSON.
   static const requiredKeys = <String>{
     'checksum',
+    'createdAt',
     'deletedAt',
     'duration',
     'fileCreatedAt',

mobile/openapi/lib/model/time_bucket_asset_response_dto.dart

@@ -15,6 +15,7 @@ class TimeBucketAssetResponseDto {
   TimeBucketAssetResponseDto({
     this.city = const [],
     this.country = const [],
+    this.createdAt = const [],
     this.duration = const [],
     this.fileCreatedAt = const [],
     this.id = const [],
@@ -39,6 +40,9 @@ class TimeBucketAssetResponseDto {
   /// Array of country names extracted from EXIF GPS data
   List<String?> country;
 
+  /// Array of UTC timestamps when each asset was originally uploaded to Immich
+  List<String> createdAt;
+
   /// Array of video/gif durations in milliseconds (null for static images)
   List<int?> duration;
 
@@ -91,6 +95,7 @@ class TimeBucketAssetResponseDto {
   bool operator ==(Object other) => identical(this, other) || other is TimeBucketAssetResponseDto &&
     _deepEquality.equals(other.city, city) &&
     _deepEquality.equals(other.country, country) &&
+    _deepEquality.equals(other.createdAt, createdAt) &&
     _deepEquality.equals(other.duration, duration) &&
     _deepEquality.equals(other.fileCreatedAt, fileCreatedAt) &&
     _deepEquality.equals(other.id, id) &&
@@ -113,6 +118,7 @@ class TimeBucketAssetResponseDto {
     // ignore: unnecessary_parenthesis
     (city.hashCode) +
     (country.hashCode) +
+    (createdAt.hashCode) +
     (duration.hashCode) +
     (fileCreatedAt.hashCode) +
     (id.hashCode) +
@@ -131,12 +137,13 @@ class TimeBucketAssetResponseDto {
     (visibility.hashCode);
 
   @override
-  String toString() => 'TimeBucketAssetResponseDto[city=$city, country=$country, duration=$duration, fileCreatedAt=$fileCreatedAt, id=$id, isFavorite=$isFavorite, isImage=$isImage, isTrashed=$isTrashed, latitude=$latitude, livePhotoVideoId=$livePhotoVideoId, localOffsetHours=$localOffsetHours, longitude=$longitude, ownerId=$ownerId, projectionType=$projectionType, ratio=$ratio, stack=$stack, thumbhash=$thumbhash, visibility=$visibility]';
+  String toString() => 'TimeBucketAssetResponseDto[city=$city, country=$country, createdAt=$createdAt, duration=$duration, fileCreatedAt=$fileCreatedAt, id=$id, isFavorite=$isFavorite, isImage=$isImage, isTrashed=$isTrashed, latitude=$latitude, livePhotoVideoId=$livePhotoVideoId, localOffsetHours=$localOffsetHours, longitude=$longitude, ownerId=$ownerId, projectionType=$projectionType, ratio=$ratio, stack=$stack, thumbhash=$thumbhash, visibility=$visibility]';
 
   Map<String, dynamic> toJson() {
     final json = <String, dynamic>{};
       json[r'city'] = this.city;
       json[r'country'] = this.country;
+      json[r'createdAt'] = this.createdAt;
       json[r'duration'] = this.duration;
       json[r'fileCreatedAt'] = this.fileCreatedAt;
       json[r'id'] = this.id;
@@ -171,6 +178,9 @@ class TimeBucketAssetResponseDto {
         country: json[r'country'] is Iterable
             ? (json[r'country'] as Iterable).cast<String>().toList(growable: false)
             : const [],
+        createdAt: json[r'createdAt'] is Iterable
+            ? (json[r'createdAt'] as Iterable).cast<String>().toList(growable: false)
+            : const [],
         duration: json[r'duration'] is Iterable
             ? (json[r'duration'] as Iterable).cast<int>().toList(growable: false)
             : const [],
@@ -268,6 +278,7 @@ class TimeBucketAssetResponseDto {
   static const requiredKeys = <String>{
     'city',
     'country',
+    'createdAt',
     'duration',
     'fileCreatedAt',
     'id',