Refactor mobile to use OpenApi generated SDK (#336)

2025-10-29 17:40:28 +00:00 · 2022-07-13 07:23:48 -05:00
parent d69470e207
commit ae7e582ec8
276 changed files with 14513 additions and 3003 deletions
--- a/mobile/lib/modules/home/models/delete_asset_response.model.dart
+++ b/mobile/lib/modules/home/models/delete_asset_response.model.dart
@@ -1,55 +0,0 @@
-import 'dart:convert';
-
-class DeleteAssetResponse {
-  final String id;
-  final String status;
-
-  DeleteAssetResponse({
-    required this.id,
-    required this.status,
-  });
-
-  DeleteAssetResponse copyWith({
-    String? id,
-    String? status,
-  }) {
-    return DeleteAssetResponse(
-      id: id ?? this.id,
-      status: status ?? this.status,
-    );
-  }
-
-  Map<String, dynamic> toMap() {
-    return {
-      'id': id,
-      'status': status,
-    };
-  }
-
-  factory DeleteAssetResponse.fromMap(Map<String, dynamic> map) {
-    return DeleteAssetResponse(
-      id: map['id'] ?? '',
-      status: map['status'] ?? '',
-    );
-  }
-
-  String toJson() => json.encode(toMap());
-
-  factory DeleteAssetResponse.fromJson(String source) =>
-      DeleteAssetResponse.fromMap(json.decode(source));
-
-  @override
-  String toString() => 'DeleteAssetResponse(id: $id, status: $status)';
-
-  @override
-  bool operator ==(Object other) {
-    if (identical(this, other)) return true;
-
-    return other is DeleteAssetResponse &&
-        other.id == id &&
-        other.status == status;
-  }
-
-  @override
-  int get hashCode => id.hashCode ^ status.hashCode;
-}
--- a/mobile/lib/modules/home/models/get_all_asset_response.model.dart
+++ b/mobile/lib/modules/home/models/get_all_asset_response.model.dart
@@ -1,11 +1,9 @@
-import 'dart:convert';
-
 import 'package:flutter/foundation.dart';
-import 'package:immich_mobile/shared/models/immich_asset.model.dart';
+import 'package:openapi/api.dart';

 class ImmichAssetGroupByDate {
  final String date;
-  List<ImmichAsset> assets;
+  List<AssetResponseDto> assets;
  ImmichAssetGroupByDate({
    required this.date,
    required this.assets,
@@ -13,7 +11,7 @@ class ImmichAssetGroupByDate {

  ImmichAssetGroupByDate copyWith({
    String? date,
-    List<ImmichAsset>? assets,
+    List<AssetResponseDto>? assets,
  }) {
    return ImmichAssetGroupByDate(
      date: date ?? this.date,
@@ -21,26 +19,6 @@ class ImmichAssetGroupByDate {
    );
  }

-  Map<String, dynamic> toMap() {
-    return {
-      'date': date,
-      'assets': assets.map((x) => x.toMap()).toList(),
-    };
-  }
-
-  factory ImmichAssetGroupByDate.fromMap(Map<String, dynamic> map) {
-    return ImmichAssetGroupByDate(
-      date: map['date'] ?? '',
-      assets: List<ImmichAsset>.from(
-          map['assets']?.map((x) => ImmichAsset.fromMap(x))),
-    );
-  }
-
-  String toJson() => json.encode(toMap());
-
-  factory ImmichAssetGroupByDate.fromJson(String source) =>
-      ImmichAssetGroupByDate.fromMap(json.decode(source));
-
  @override
  String toString() => 'ImmichAssetGroupByDate(date: $date, assets: $assets)';

@@ -79,28 +57,6 @@ class GetAllAssetResponse {
    );
  }

-  Map<String, dynamic> toMap() {
-    return {
-      'count': count,
-      'data': data.map((x) => x.toMap()).toList(),
-      'nextPageKey': nextPageKey,
-    };
-  }
-
-  factory GetAllAssetResponse.fromMap(Map<String, dynamic> map) {
-    return GetAllAssetResponse(
-      count: map['count']?.toInt() ?? 0,
-      data: List<ImmichAssetGroupByDate>.from(
-          map['data']?.map((x) => ImmichAssetGroupByDate.fromMap(x))),
-      nextPageKey: map['nextPageKey'] ?? '',
-    );
-  }
-
-  String toJson() => json.encode(toMap());
-
-  factory GetAllAssetResponse.fromJson(String source) =>
-      GetAllAssetResponse.fromMap(json.decode(source));
-
  @override
  String toString() =>
      'GetAllAssetResponse(count: $count, data: $data, nextPageKey: $nextPageKey)';
--- a/mobile/lib/modules/home/models/home_page_state.model.dart
+++ b/mobile/lib/modules/home/models/home_page_state.model.dart
@@ -1,12 +1,10 @@
-import 'dart:convert';
-
 import 'package:collection/collection.dart';

-import 'package:immich_mobile/shared/models/immich_asset.model.dart';
+import 'package:openapi/api.dart';

 class HomePageState {
  final bool isMultiSelectEnable;
-  final Set<ImmichAsset> selectedItems;
+  final Set<AssetResponseDto> selectedItems;
  final Set<String> selectedDateGroup;
  HomePageState({
    required this.isMultiSelectEnable,
@@ -16,7 +14,7 @@ class HomePageState {

  HomePageState copyWith({
    bool? isMultiSelectEnable,
-    Set<ImmichAsset>? selectedItems,
+    Set<AssetResponseDto>? selectedItems,
    Set<String>? selectedDateGroup,
  }) {
    return HomePageState(
@@ -26,28 +24,6 @@ class HomePageState {
    );
  }

-  Map<String, dynamic> toMap() {
-    return {
-      'isMultiSelectEnable': isMultiSelectEnable,
-      'selectedItems': selectedItems.map((x) => x.toMap()).toList(),
-      'selectedDateGroup': selectedDateGroup.toList(),
-    };
-  }
-
-  factory HomePageState.fromMap(Map<String, dynamic> map) {
-    return HomePageState(
-      isMultiSelectEnable: map['isMultiSelectEnable'] ?? false,
-      selectedItems: Set<ImmichAsset>.from(
-          map['selectedItems']?.map((x) => ImmichAsset.fromMap(x))),
-      selectedDateGroup: Set<String>.from(map['selectedDateGroup']),
-    );
-  }
-
-  String toJson() => json.encode(toMap());
-
-  factory HomePageState.fromJson(String source) =>
-      HomePageState.fromMap(json.decode(source));
-
  @override
  String toString() =>
      'HomePageState(isMultiSelectEnable: $isMultiSelectEnable, selectedItems: $selectedItems, selectedDateGroup: $selectedDateGroup)';
--- a/mobile/lib/modules/home/providers/home_page_state.provider.dart
+++ b/mobile/lib/modules/home/providers/home_page_state.provider.dart
@@ -1,6 +1,6 @@
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:immich_mobile/modules/home/models/home_page_state.model.dart';
-import 'package:immich_mobile/shared/models/immich_asset.model.dart';
+import 'package:openapi/api.dart';

 class HomePageStateNotifier extends StateNotifier<HomePageState> {
  HomePageStateNotifier()
@@ -14,7 +14,8 @@ class HomePageStateNotifier extends StateNotifier<HomePageState> {

  void addSelectedDateGroup(String dateGroupTitle) {
    state = state.copyWith(
-        selectedDateGroup: {...state.selectedDateGroup, dateGroupTitle});
+      selectedDateGroup: {...state.selectedDateGroup, dateGroupTitle},
+    );
  }

  void removeSelectedDateGroup(String dateGroupTitle) {
@@ -25,36 +26,39 @@ class HomePageStateNotifier extends StateNotifier<HomePageState> {
    state = state.copyWith(selectedDateGroup: currentDateGroup);
  }

-  void enableMultiSelect(Set<ImmichAsset> selectedItems) {
+  void enableMultiSelect(Set<AssetResponseDto> selectedItems) {
    state =
        state.copyWith(isMultiSelectEnable: true, selectedItems: selectedItems);
  }

  void disableMultiSelect() {
    state = state.copyWith(
-        isMultiSelectEnable: false, selectedItems: {}, selectedDateGroup: {});
+      isMultiSelectEnable: false,
+      selectedItems: {},
+      selectedDateGroup: {},
+    );
  }

-  void addSingleSelectedItem(ImmichAsset asset) {
+  void addSingleSelectedItem(AssetResponseDto asset) {
    state = state.copyWith(selectedItems: {...state.selectedItems, asset});
  }

-  void addMultipleSelectedItems(List<ImmichAsset> assets) {
+  void addMultipleSelectedItems(List<AssetResponseDto> assets) {
    state = state.copyWith(selectedItems: {...state.selectedItems, ...assets});
  }

-  void removeSingleSelectedItem(ImmichAsset asset) {
-    Set<ImmichAsset> currentList = state.selectedItems;
+  void removeSingleSelectedItem(AssetResponseDto asset) {
+    Set<AssetResponseDto> currentList = state.selectedItems;

    currentList.removeWhere((e) => e.id == asset.id);

    state = state.copyWith(selectedItems: currentList);
  }

-  void removeMultipleSelectedItem(List<ImmichAsset> assets) {
-    Set<ImmichAsset> currentList = state.selectedItems;
+  void removeMultipleSelectedItem(List<AssetResponseDto> assets) {
+    Set<AssetResponseDto> currentList = state.selectedItems;

-    for (ImmichAsset asset in assets) {
+    for (AssetResponseDto asset in assets) {
      currentList.removeWhere((e) => e.id == asset.id);
    }

@@ -64,4 +68,5 @@ class HomePageStateNotifier extends StateNotifier<HomePageState> {

 final homePageStateProvider =
    StateNotifierProvider<HomePageStateNotifier, HomePageState>(
-        ((ref) => HomePageStateNotifier()));
+  ((ref) => HomePageStateNotifier()),
+);
--- a/mobile/lib/modules/home/providers/upload_profile_image.provider.dart
+++ b/mobile/lib/modules/home/providers/upload_profile_image.provider.dart
@@ -73,10 +73,12 @@ class UploadProfileImageState {
 class UploadProfileImageNotifier
    extends StateNotifier<UploadProfileImageState> {
  UploadProfileImageNotifier(this._userSErvice)
-      : super(UploadProfileImageState(
-          profileImagePath: '',
-          status: UploadProfileStatus.idle,
-        ));
+      : super(
+          UploadProfileImageState(
+            profileImagePath: '',
+            status: UploadProfileStatus.idle,
+          ),
+        );

  final UserService _userSErvice;

@@ -88,8 +90,9 @@ class UploadProfileImageNotifier
    if (res != null) {
      debugPrint("Succesfully upload profile image");
      state = state.copyWith(
-          status: UploadProfileStatus.success,
-          profileImagePath: res.profileImagePath);
+        status: UploadProfileStatus.success,
+        profileImagePath: res.profileImagePath,
+      );
      return true;
    }

@@ -100,4 +103,5 @@ class UploadProfileImageNotifier

 final uploadProfileImageProvider =
    StateNotifierProvider<UploadProfileImageNotifier, UploadProfileImageState>(
-        ((ref) => UploadProfileImageNotifier(ref.watch(userServiceProvider))));
+  ((ref) => UploadProfileImageNotifier(ref.watch(userServiceProvider))),
+);
--- a/mobile/lib/modules/home/services/asset.service.dart
+++ b/mobile/lib/modules/home/services/asset.service.dart
@@ -1,120 +1,51 @@
-import 'dart:convert';
+import 'dart:async';

 import 'package:flutter/material.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
-import 'package:immich_mobile/modules/home/models/delete_asset_response.model.dart';
-import 'package:immich_mobile/modules/home/models/get_all_asset_response.model.dart';
-import 'package:immich_mobile/shared/models/immich_asset.model.dart';
-import 'package:immich_mobile/shared/models/immich_asset_with_exif.model.dart';
-import 'package:immich_mobile/shared/services/network.service.dart';
+import 'package:immich_mobile/shared/services/api.service.dart';
+import 'package:openapi/api.dart';

-final assetServiceProvider =
-    Provider((ref) => AssetService(ref.watch(networkServiceProvider)));
+final assetServiceProvider = Provider(
+  (ref) => AssetService(
+    ref.watch(apiServiceProvider),
+  ),
+);

 class AssetService {
-  final NetworkService _networkService;
-  AssetService(this._networkService);
+  final ApiService _apiService;

-  Future<List<ImmichAsset>?> getAllAsset() async {
-    var res = await _networkService.getRequest(url: "asset/");
+  AssetService(this._apiService);
+
+  Future<List<AssetResponseDto>?> getAllAsset() async {
    try {
-      List<dynamic> decodedData = jsonDecode(res.toString());
-
-      List<ImmichAsset> result =
-          List.from(decodedData.map((a) => ImmichAsset.fromMap(a)));
-      return result;
+      return await _apiService.assetApi.getAllAssets();
    } catch (e) {
-      debugPrint("Error getAllAsset  ${e.toString()}");
-    }
-    return null;
-  }
-
-  Future<GetAllAssetResponse?> getAllAssetWithPagination() async {
-    var res = await _networkService.getRequest(url: "asset/all");
-    try {
-      Map<String, dynamic> decodedData = jsonDecode(res.toString());
-
-      GetAllAssetResponse result = GetAllAssetResponse.fromMap(decodedData);
-      return result;
-    } catch (e) {
-      debugPrint("Error getAllAsset  ${e.toString()}");
-    }
-    return null;
-  }
-
-  Future<GetAllAssetResponse?> getOlderAsset(String? nextPageKey) async {
-    try {
-      var res = await _networkService.getRequest(
-        url: "asset/all?nextPageKey=$nextPageKey",
-      );
-
-      Map<String, dynamic> decodedData = jsonDecode(res.toString());
-
-      GetAllAssetResponse result = GetAllAssetResponse.fromMap(decodedData);
-      if (result.count != 0) {
-        return result;
-      }
-    } catch (e) {
-      debugPrint("Error getAllAsset  ${e.toString()}");
-    }
-    return null;
-  }
-
-  Future<List<ImmichAsset>> getNewAsset(String latestDate) async {
-    try {
-      var res = await _networkService.getRequest(
-        url: "asset/new?latestDate=$latestDate",
-      );
-
-      List<dynamic> decodedData = jsonDecode(res.toString());
-
-      List<ImmichAsset> result =
-          List.from(decodedData.map((a) => ImmichAsset.fromMap(a)));
-      if (result.isNotEmpty) {
-        return result;
-      }
-
-      return [];
-    } catch (e) {
-      debugPrint("Error getAllAsset  ${e.toString()}");
-      return [];
-    }
-  }
-
-  Future<ImmichAssetWithExif?> getAssetById(String assetId) async {
-    try {
-      var res = await _networkService.getRequest(
-        url: "asset/assetById/$assetId",
-      );
-
-      Map<String, dynamic> decodedData = jsonDecode(res.toString());
-
-      ImmichAssetWithExif result = ImmichAssetWithExif.fromMap(decodedData);
-      return result;
-    } catch (e) {
-      debugPrint("Error getAllAsset  ${e.toString()}");
+      debugPrint("Error [getAllAsset]  ${e.toString()}");
      return null;
    }
  }

-  Future<List<DeleteAssetResponse>?> deleteAssets(
-      Set<ImmichAsset> deleteAssets) async {
+  Future<AssetResponseDto?> getAssetById(String assetId) async {
    try {
-      var payload = [];
+      return await _apiService.assetApi.getAssetById(assetId);
+    } catch (e) {
+      debugPrint("Error [getAssetById]  ${e.toString()}");
+      return null;
+    }
+  }
+
+  Future<List<DeleteAssetResponseDto>?> deleteAssets(
+    Set<AssetResponseDto> deleteAssets,
+  ) async {
+    try {
+      List<String> payload = [];

      for (var asset in deleteAssets) {
        payload.add(asset.id);
      }

-      var res = await _networkService
-          .deleteRequest(url: "asset/", data: {"ids": payload});
-
-      List<dynamic> decodedData = jsonDecode(res.toString());
-
-      List<DeleteAssetResponse> result =
-          List.from(decodedData.map((a) => DeleteAssetResponse.fromMap(a)));
-
-      return result;
+      return await _apiService.assetApi
+          .deleteAsset(DeleteAssetDto(ids: payload));
    } catch (e) {
      debugPrint("Error getAllAsset  ${e.toString()}");
      return null;
--- a/mobile/lib/modules/home/ui/control_bottom_app_bar.dart
+++ b/mobile/lib/modules/home/ui/control_bottom_app_bar.dart
@@ -15,7 +15,9 @@ class ControlBottomAppBar extends StatelessWidget {
        height: MediaQuery.of(context).size.height * 0.15,
        decoration: BoxDecoration(
          borderRadius: const BorderRadius.only(
-              topLeft: Radius.circular(15), topRight: Radius.circular(15)),
+            topLeft: Radius.circular(15),
+            topRight: Radius.circular(15),
+          ),
          color: Colors.grey[300]?.withOpacity(0.98),
        ),
        child: Column(
@@ -48,12 +50,12 @@ class ControlBottomAppBar extends StatelessWidget {
 }

 class ControlBoxButton extends StatelessWidget {
-  const ControlBoxButton(
-      {Key? key,
-      required this.label,
-      required this.iconData,
-      required this.onPressed})
-      : super(key: key);
+  const ControlBoxButton({
+    Key? key,
+    required this.label,
+    required this.iconData,
+    required this.onPressed,
+  }) : super(key: key);

  final String label;
  final IconData iconData;
--- a/mobile/lib/modules/home/ui/daily_title_text.dart
+++ b/mobile/lib/modules/home/ui/daily_title_text.dart
@@ -2,8 +2,7 @@ import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:immich_mobile/modules/home/providers/home_page_state.provider.dart';
-import 'package:immich_mobile/shared/models/immich_asset.model.dart';
-import 'package:intl/intl.dart';
+import 'package:openapi/api.dart';

 class DailyTitleText extends ConsumerWidget {
  const DailyTitleText({
@@ -13,14 +12,15 @@ class DailyTitleText extends ConsumerWidget {
  }) : super(key: key);

  final String isoDate;
-  final List<ImmichAsset> assetGroup;
+  final List<AssetResponseDto> assetGroup;

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    var currentYear = DateTime.now().year;
    var groupYear = DateTime.parse(isoDate).year;
-    var formatDateTemplate =
-        currentYear == groupYear ? "daily_title_text_date".tr() : "daily_title_text_date_year".tr();
+    var formatDateTemplate = currentYear == groupYear
+        ? "daily_title_text_date".tr()
+        : "daily_title_text_date_year".tr();
    var dateText =
        DateFormat(formatDateTemplate).format(DateTime.parse(isoDate));
    var isMultiSelectEnable =
@@ -74,7 +74,11 @@ class DailyTitleText extends ConsumerWidget {
    return SliverToBoxAdapter(
      child: Padding(
        padding: const EdgeInsets.only(
-            top: 29.0, bottom: 29.0, left: 12.0, right: 12.0),
+          top: 29.0,
+          bottom: 29.0,
+          left: 12.0,
+          right: 12.0,
+        ),
        child: Row(
          children: [
            Text(
--- a/mobile/lib/modules/home/ui/disable_multi_select_button.dart
+++ b/mobile/lib/modules/home/ui/disable_multi_select_button.dart
@@ -29,15 +29,18 @@ class DisableMultiSelectButton extends ConsumerWidget {
            child: Padding(
              padding: const EdgeInsets.symmetric(horizontal: 4.0),
              child: TextButton.icon(
-                  onPressed: () {
-                    onPressed();
-                  },
-                  icon: const Icon(Icons.close_rounded),
-                  label: Text(
-                    '$selectedItemCount',
-                    style: const TextStyle(
-                        fontWeight: FontWeight.w600, fontSize: 18),
-                  )),
+                onPressed: () {
+                  onPressed();
+                },
+                icon: const Icon(Icons.close_rounded),
+                label: Text(
+                  '$selectedItemCount',
+                  style: const TextStyle(
+                    fontWeight: FontWeight.w600,
+                    fontSize: 18,
+                  ),
+                ),
+              ),
            ),
          ),
        ),
--- a/mobile/lib/modules/home/ui/draggable_scrollbar.dart
+++ b/mobile/lib/modules/home/ui/draggable_scrollbar.dart
@@ -118,20 +118,24 @@ class DraggableScrollbar extends StatefulWidget {
    this.labelConstraints,
  })  : assert(child.scrollDirection == Axis.vertical),
        scrollThumbBuilder = _thumbSemicircleBuilder(
-            heightScrollThumb * 0.6, scrollThumbKey, alwaysVisibleScrollThumb),
+          heightScrollThumb * 0.6,
+          scrollThumbKey,
+          alwaysVisibleScrollThumb,
+        ),
        super(key: key);

  @override
  DraggableScrollbarState createState() => DraggableScrollbarState();

-  static buildScrollThumbAndLabel(
-      {required Widget scrollThumb,
-      required Color backgroundColor,
-      required Animation<double>? thumbAnimation,
-      required Animation<double>? labelAnimation,
-      required Text? labelText,
-      required BoxConstraints? labelConstraints,
-      required bool alwaysVisibleScrollThumb}) {
+  static buildScrollThumbAndLabel({
+    required Widget scrollThumb,
+    required Color backgroundColor,
+    required Animation<double>? thumbAnimation,
+    required Animation<double>? labelAnimation,
+    required Text? labelText,
+    required BoxConstraints? labelConstraints,
+    required bool alwaysVisibleScrollThumb,
+  }) {
    var scrollThumbAndLabel = labelText == null
        ? scrollThumb
        : Row(
@@ -158,7 +162,10 @@ class DraggableScrollbar extends StatefulWidget {
  }

  static ScrollThumbBuilder _thumbSemicircleBuilder(
-      double width, Key? scrollThumbKey, bool alwaysVisibleScrollThumb) {
+    double width,
+    Key? scrollThumbKey,
+    bool alwaysVisibleScrollThumb,
+  ) {
    return (
      Color backgroundColor,
      Animation<double> thumbAnimation,
@@ -198,7 +205,9 @@ class DraggableScrollbar extends StatefulWidget {
  }

  static ScrollThumbBuilder _thumbArrowBuilder(
-      Key? scrollThumbKey, bool alwaysVisibleScrollThumb) {
+    Key? scrollThumbKey,
+    bool alwaysVisibleScrollThumb,
+  ) {
    return (
      Color backgroundColor,
      Animation<double> thumbAnimation,
@@ -234,7 +243,9 @@ class DraggableScrollbar extends StatefulWidget {
  }

  static ScrollThumbBuilder _thumbRRectBuilder(
-      Key? scrollThumbKey, bool alwaysVisibleScrollThumb) {
+    Key? scrollThumbKey,
+    bool alwaysVisibleScrollThumb,
+  ) {
    return (
      Color backgroundColor,
      Animation<double> thumbAnimation,
@@ -372,42 +383,44 @@ class DraggableScrollbarState extends State<DraggableScrollbar>
    }

    return LayoutBuilder(
-        builder: (BuildContext context, BoxConstraints constraints) {
-      //print("LayoutBuilder constraints=$constraints");
+      builder: (BuildContext context, BoxConstraints constraints) {
+        //print("LayoutBuilder constraints=$constraints");

-      return NotificationListener<ScrollNotification>(
-        onNotification: (ScrollNotification notification) {
-          changePosition(notification);
-          return false;
-        },
-        child: Stack(
-          children: <Widget>[
-            RepaintBoundary(
-              child: widget.child,
-            ),
-            RepaintBoundary(
+        return NotificationListener<ScrollNotification>(
+          onNotification: (ScrollNotification notification) {
+            changePosition(notification);
+            return false;
+          },
+          child: Stack(
+            children: <Widget>[
+              RepaintBoundary(
+                child: widget.child,
+              ),
+              RepaintBoundary(
                child: GestureDetector(
-              onVerticalDragStart: _onVerticalDragStart,
-              onVerticalDragUpdate: _onVerticalDragUpdate,
-              onVerticalDragEnd: _onVerticalDragEnd,
-              child: Container(
-                alignment: Alignment.topRight,
-                margin: EdgeInsets.only(top: _barOffset),
-                padding: widget.padding,
-                child: widget.scrollThumbBuilder(
-                  widget.backgroundColor,
-                  _thumbAnimation,
-                  _labelAnimation,
-                  widget.heightScrollThumb,
-                  labelText: labelText,
-                  labelConstraints: widget.labelConstraints,
+                  onVerticalDragStart: _onVerticalDragStart,
+                  onVerticalDragUpdate: _onVerticalDragUpdate,
+                  onVerticalDragEnd: _onVerticalDragEnd,
+                  child: Container(
+                    alignment: Alignment.topRight,
+                    margin: EdgeInsets.only(top: _barOffset),
+                    padding: widget.padding,
+                    child: widget.scrollThumbBuilder(
+                      widget.backgroundColor,
+                      _thumbAnimation,
+                      _labelAnimation,
+                      widget.heightScrollThumb,
+                      labelText: labelText,
+                      labelConstraints: widget.labelConstraints,
+                    ),
+                  ),
                ),
              ),
-            )),
-          ],
-        ),
-      );
-    });
+            ],
+          ),
+        );
+      },
+    );
  }

  //scroll bar has received notification that it's view was scrolled
@@ -498,7 +511,10 @@ class DraggableScrollbarState extends State<DraggableScrollbar>
        }

        double viewDelta = getScrollViewDelta(
-            details.delta.dy, barMaxScrollExtent, viewMaxScrollExtent);
+          details.delta.dy,
+          barMaxScrollExtent,
+          viewMaxScrollExtent,
+        );

        _viewOffset = widget.controller.position.pixels + viewDelta;
        if (_viewOffset < widget.controller.position.minScrollExtent) {
@@ -579,7 +595,9 @@ class ArrowClipper extends CustomClipper<Path> {
    path.lineTo(startPointX + arrowWidth, startPointY);
    path.lineTo(startPointX + arrowWidth, startPointY + 1.0);
    path.lineTo(
-        startPointX + arrowWidth / 2, startPointY - arrowWidth / 2 + 1.0);
+      startPointX + arrowWidth / 2,
+      startPointY - arrowWidth / 2 + 1.0,
+    );
    path.lineTo(startPointX, startPointY + 1.0);
    path.close();

@@ -589,7 +607,9 @@ class ArrowClipper extends CustomClipper<Path> {
    path.lineTo(startPointX, startPointY);
    path.lineTo(startPointX, startPointY - 1.0);
    path.lineTo(
-        startPointX + arrowWidth / 2, startPointY + arrowWidth / 2 - 1.0);
+      startPointX + arrowWidth / 2,
+      startPointY + arrowWidth / 2 - 1.0,
+    );
    path.lineTo(startPointX + arrowWidth, startPointY - 1.0);
    path.close();

--- a/mobile/lib/modules/home/ui/image_grid.dart
+++ b/mobile/lib/modules/home/ui/image_grid.dart
@@ -1,10 +1,10 @@
 import 'package:flutter/material.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:immich_mobile/modules/home/ui/thumbnail_image.dart';
-import 'package:immich_mobile/shared/models/immich_asset.model.dart';
+import 'package:openapi/api.dart';

 class ImageGrid extends ConsumerWidget {
-  final List<ImmichAsset> assetGroup;
+  final List<AssetResponseDto> assetGroup;

  const ImageGrid({Key? key, required this.assetGroup}) : super(key: key);

@@ -25,7 +25,7 @@ class ImageGrid extends ConsumerWidget {
            child: Stack(
              children: [
                ThumbnailImage(asset: assetGroup[index]),
-                if (assetType != 'IMAGE')
+                if (assetType != AssetTypeEnum.IMAGE)
                  Positioned(
                    top: 5,
                    right: 5,
--- a/mobile/lib/modules/home/ui/immich_sliver_appbar.dart
+++ b/mobile/lib/modules/home/ui/immich_sliver_appbar.dart
@@ -31,7 +31,8 @@ class ImmichSliverAppBar extends ConsumerWidget {
      pinned: false,
      snap: false,
      shape: const RoundedRectangleBorder(
-          borderRadius: BorderRadius.all(Radius.circular(5))),
+        borderRadius: BorderRadius.all(Radius.circular(5)),
+      ),
      leading: Builder(
        builder: (BuildContext context) {
          return Stack(
@@ -99,7 +100,8 @@ class ImmichSliverAppBar extends ConsumerWidget {
                  child: CircularProgressIndicator(
                    strokeWidth: 1,
                    valueColor: AlwaysStoppedAnimation<Color>(
-                        Theme.of(context).primaryColor),
+                      Theme.of(context).primaryColor,
+                    ),
                  ),
                ),
              ),
@@ -117,7 +119,8 @@ class ImmichSliverAppBar extends ConsumerWidget {
                        Icons.cloud_off_rounded,
                        size: 8,
                      ),
-                      child: const Icon(Icons.backup_rounded)),
+                      child: const Icon(Icons.backup_rounded),
+                    ),
              onPressed: () async {
                var onPop = await AutoRouter.of(context)
                    .push(const BackupControllerRoute());
--- a/mobile/lib/modules/home/ui/monthly_title_text.dart
+++ b/mobile/lib/modules/home/ui/monthly_title_text.dart
@@ -1,6 +1,5 @@
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
-import 'package:intl/intl.dart';

 class MonthlyTitleText extends StatelessWidget {
  const MonthlyTitleText({
@@ -12,7 +11,8 @@ class MonthlyTitleText extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
-    var monthTitleText = DateFormat("monthly_title_text_date_format".tr()).format(DateTime.parse(isoDate));
+    var monthTitleText = DateFormat("monthly_title_text_date_format".tr())
+        .format(DateTime.parse(isoDate));

    return SliverToBoxAdapter(
      child: Padding(
--- a/mobile/lib/modules/home/ui/profile_drawer.dart
+++ b/mobile/lib/modules/home/ui/profile_drawer.dart
@@ -55,7 +55,8 @@ class ProfileDrawer extends HookConsumerWidget {
          return CircleAvatar(
            radius: 35,
            backgroundImage: NetworkImage(
-                '$endpoint/user/profile-image/${authState.userId}?d=${dummmy++}'),
+              '$endpoint/user/profile-image/${authState.userId}?d=${dummmy++}',
+            ),
            backgroundColor: Colors.transparent,
          );
        } else {
@@ -71,7 +72,8 @@ class ProfileDrawer extends HookConsumerWidget {
        return CircleAvatar(
          radius: 35,
          backgroundImage: NetworkImage(
-              '$endpoint/user/profile-image/${authState.userId}?d=${dummmy++}'),
+            '$endpoint/user/profile-image/${authState.userId}?d=${dummmy++}',
+          ),
          backgroundColor: Colors.transparent,
        );
      }
@@ -93,7 +95,10 @@ class ProfileDrawer extends HookConsumerWidget {

    _pickUserProfileImage() async {
      final XFile? image = await ImagePicker().pickImage(
-          source: ImageSource.gallery, maxHeight: 1024, maxWidth: 1024);
+        source: ImageSource.gallery,
+        maxHeight: 1024,
+        maxWidth: 1024,
+      );

      if (image != null) {
        var success =
@@ -101,16 +106,20 @@ class ProfileDrawer extends HookConsumerWidget {

        if (success) {
          ref.watch(authenticationProvider.notifier).updateUserProfileImagePath(
-              ref.read(uploadProfileImageProvider).profileImagePath);
+                ref.read(uploadProfileImageProvider).profileImagePath,
+              );
        }
      }
    }

-    useEffect(() {
-      _getPackageInfo();
-      _buildUserProfileImage();
-      return null;
-    }, []);
+    useEffect(
+      () {
+        _getPackageInfo();
+        _buildUserProfileImage();
+        return null;
+      },
+      [],
+    );
    return Drawer(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
@@ -186,9 +195,10 @@ class ProfileDrawer extends HookConsumerWidget {
                title: const Text(
                  "profile_drawer_sign_out",
                  style: TextStyle(
-                      color: Colors.black54,
-                      fontSize: 14,
-                      fontWeight: FontWeight.bold),
+                    color: Colors.black54,
+                    fontSize: 14,
+                    fontWeight: FontWeight.bold,
+                  ),
                ).tr(),
                onTap: () async {
                  bool res =
@@ -231,9 +241,10 @@ class ProfileDrawer extends HookConsumerWidget {
                            : "profile_drawer_client_server_up_to_date".tr(),
                        textAlign: TextAlign.center,
                        style: TextStyle(
-                            fontSize: 11,
-                            color: Theme.of(context).primaryColor,
-                            fontWeight: FontWeight.w600),
+                          fontSize: 11,
+                          color: Theme.of(context).primaryColor,
+                          fontWeight: FontWeight.w600,
+                        ),
                      ),
                    ),
                    const Divider(),
@@ -271,7 +282,7 @@ class ProfileDrawer extends HookConsumerWidget {
                          ),
                        ),
                        Text(
-                          "${serverInfoState.serverVersion.major}.${serverInfoState.serverVersion.minor}.${serverInfoState.serverVersion.patch}",
+                          "${serverInfoState.serverVersion.major}.${serverInfoState.serverVersion.minor}.${serverInfoState.serverVersion.patch_}",
                          style: TextStyle(
                            fontSize: 11,
                            color: Colors.grey[500],
--- a/mobile/lib/modules/home/ui/thumbnail_image.dart
+++ b/mobile/lib/modules/home/ui/thumbnail_image.dart
@@ -8,11 +8,11 @@ import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:immich_mobile/constants/hive_box.dart';
 import 'package:immich_mobile/modules/home/providers/home_page_state.provider.dart';
 import 'package:immich_mobile/modules/login/providers/authentication.provider.dart';
-import 'package:immich_mobile/shared/models/immich_asset.model.dart';
 import 'package:immich_mobile/routing/router.dart';
+import 'package:openapi/api.dart';

 class ThumbnailImage extends HookConsumerWidget {
-  final ImmichAsset asset;
+  final AssetResponseDto asset;

  const ThumbnailImage({Key? key, required this.asset}) : super(key: key);

@@ -22,14 +22,13 @@ class ThumbnailImage extends HookConsumerWidget {

    var box = Hive.box(userInfoBox);
    var thumbnailRequestUrl =
-        '${box.get(serverEndpointKey)}/asset/file?aid=${asset.deviceAssetId}&did=${asset.deviceId}&isThumb=true';
-
+        '${box.get(serverEndpointKey)}/asset/thumbnail/${asset.id}';
    var selectedAsset = ref.watch(homePageStateProvider).selectedItems;
    var isMultiSelectEnable =
        ref.watch(homePageStateProvider).isMultiSelectEnable;
    var deviceId = ref.watch(authenticationProvider).deviceId;

-    Widget _buildSelectionIcon(ImmichAsset asset) {
+    Widget _buildSelectionIcon(AssetResponseDto asset) {
      if (selectedAsset.contains(asset)) {
        return Icon(
          Icons.check_circle,
@@ -61,7 +60,7 @@ class ThumbnailImage extends HookConsumerWidget {
              .watch(homePageStateProvider.notifier)
              .addSingleSelectedItem(asset);
        } else {
-          if (asset.type == 'IMAGE') {
+          if (asset.type == AssetTypeEnum.IMAGE) {
            AutoRouter.of(context).push(
              ImageViewerRoute(
                imageUrl:
@@ -74,9 +73,10 @@ class ThumbnailImage extends HookConsumerWidget {
          } else {
            AutoRouter.of(context).push(
              VideoViewerRoute(
-                  videoUrl:
-                      '${box.get(serverEndpointKey)}/asset/file?aid=${asset.deviceAssetId}&did=${asset.deviceId}',
-                  asset: asset),
+                videoUrl:
+                    '${box.get(serverEndpointKey)}/asset/file?aid=${asset.deviceAssetId}&did=${asset.deviceId}',
+                asset: asset,
+              ),
            );
          }
        }
@@ -94,14 +94,16 @@ class ThumbnailImage extends HookConsumerWidget {
              decoration: BoxDecoration(
                border: isMultiSelectEnable && selectedAsset.contains(asset)
                    ? Border.all(
-                        color: Theme.of(context).primaryColorLight, width: 10)
+                        color: Theme.of(context).primaryColorLight,
+                        width: 10,
+                      )
                    : const Border(),
              ),
              child: CachedNetworkImage(
                cacheKey: "${asset.id}-${cacheKey.value}",
                width: 300,
                height: 300,
-                memCacheHeight: asset.type == 'IMAGE' ? 250 : 400,
+                memCacheHeight: asset.type == AssetTypeEnum.IMAGE ? 250 : 400,
                fit: BoxFit.cover,
                imageUrl: thumbnailRequestUrl,
                httpHeaders: {
@@ -112,9 +114,11 @@ class ThumbnailImage extends HookConsumerWidget {
                    Transform.scale(
                  scale: 0.2,
                  child: CircularProgressIndicator(
-                      value: downloadProgress.progress),
+                    value: downloadProgress.progress,
+                  ),
                ),
                errorWidget: (context, url, error) {
+                  debugPrint("Error getting thumbnail $url = $error");
                  return Icon(
                    Icons.image_not_supported_outlined,
                    color: Theme.of(context).primaryColor,
--- a/mobile/lib/modules/home/views/home_page.dart
+++ b/mobile/lib/modules/home/views/home_page.dart
@@ -26,12 +26,15 @@ class HomePage extends HookConsumerWidget {
        ref.watch(homePageStateProvider).isMultiSelectEnable;
    var homePageState = ref.watch(homePageStateProvider);

-    useEffect(() {
-      ref.read(websocketProvider.notifier).connect();
-      ref.read(assetProvider.notifier).getAllAsset();
-      ref.watch(serverInfoProvider.notifier).getServerVersion();
-      return null;
-    }, []);
+    useEffect(
+      () {
+        ref.read(websocketProvider.notifier).connect();
+        ref.read(assetProvider.notifier).getAllAsset();
+        ref.watch(serverInfoProvider.notifier).getServerVersion();
+        return null;
+      },
+      [],
+    );

    void reloadAllAsset() {
      ref.read(assetProvider.notifier).getAllAsset();