feat(mobile): Add support for Basic Authentication (#6840)

mobile/lib/modules/album/ui/album_thumbnail_listtile.dart

@@ -49,7 +49,7 @@ class AlbumThumbnailListTile extends StatelessWidget {
           type: ThumbnailFormat.WEBP,
         ),
         httpHeaders: {
-          "Authorization": "Bearer ${Store.get(StoreKey.accessToken)}",
+          "x-immich-user-token": Store.get(StoreKey.accessToken),
         },
         cacheKey: getAlbumThumbNailCacheKey(album, type: ThumbnailFormat.WEBP),
         errorWidget: (context, url, error) =>

mobile/lib/modules/asset_viewer/views/gallery_viewer.dart

@@ -78,8 +78,7 @@ class GalleryViewerPage extends HookConsumerWidget {
     final isPlayingMotionVideo = useState(false);
     final isPlayingVideo = useState(false);
     Offset? localPosition;
-    final authToken = 'Bearer ${Store.get(StoreKey.accessToken)}';
-    final header = {"Authorization": authToken};
+    final header = {"x-immich-user-token": Store.get(StoreKey.accessToken)};
     final currentIndex = useState(initialIndex);
     final currentAsset = loadAsset(currentIndex.value);
     final isTrashEnabled =
@@ -524,8 +523,7 @@ class GalleryViewerPage extends HookConsumerWidget {
                     imageUrl:
                         '${Store.get(StoreKey.serverEndpoint)}/asset/thumbnail/$assetId',
                     httpHeaders: {
-                      "Authorization":
-                          "Bearer ${Store.get(StoreKey.accessToken)}",
+                      "x-immich-user-token": Store.get(StoreKey.accessToken),
                     },
                     errorWidget: (context, url, error) =>
                         const Icon(Icons.image_not_supported_outlined),

mobile/lib/modules/asset_viewer/views/video_viewer_page.dart

@@ -68,7 +68,7 @@ class VideoViewerPage extends HookConsumerWidget {
       children: [
         VideoPlayer(
           url: videoUrl,
-          jwtToken: Store.get(StoreKey.accessToken),
+          accessToken: Store.get(StoreKey.accessToken),
           isMotionVideo: isMotionVideo,
           onVideoEnded: onVideoEnded,
           onPaused: onPaused,
@@ -99,7 +99,7 @@ final _fileFamily =
 
 class VideoPlayer extends StatefulWidget {
   final String? url;
-  final String? jwtToken;
+  final String? accessToken;
   final File? file;
   final bool isMotionVideo;
   final VoidCallback onVideoEnded;
@@ -114,7 +114,7 @@ class VideoPlayer extends StatefulWidget {
   const VideoPlayer({
     super.key,
     this.url,
-    this.jwtToken,
+    this.accessToken,
     this.file,
     required this.onVideoEnded,
     required this.isMotionVideo,
@@ -160,7 +160,7 @@ class _VideoPlayerState extends State<VideoPlayer> {
       videoPlayerController = widget.file == null
           ? VideoPlayerController.networkUrl(
               Uri.parse(widget.url!),
-              httpHeaders: {"Authorization": "Bearer ${widget.jwtToken}"},
+              httpHeaders: {"x-immich-user-token": widget.accessToken ?? ""},
             )
           : VideoPlayerController.file(widget.file!);
 

mobile/lib/modules/backup/services/backup.service.dart

@@ -302,8 +302,7 @@ class BackupService {
             onProgress: ((bytes, totalBytes) =>
                 uploadProgressCb(bytes, totalBytes)),
           );
-          req.headers["Authorization"] =
-              "Bearer ${Store.get(StoreKey.accessToken)}";
+          req.headers["x-immich-user-token"] = Store.get(StoreKey.accessToken);
           req.headers["Transfer-Encoding"] = "chunked";
 
           req.fields['deviceAssetId'] = entity.id;

mobile/lib/modules/map/widgets/positioned_asset_marker_icon.dart

@@ -89,8 +89,7 @@ class _AssetMarkerIcon extends StatelessWidget {
                     imageUrl,
                     cacheKey: cacheKey,
                     headers: {
-                      "Authorization":
-                          "Bearer ${Store.get(StoreKey.accessToken)}",
+                      "x-immich-user-token": Store.get(StoreKey.accessToken),
                     },
                     errorListener: (_) =>
                         const Icon(Icons.image_not_supported_outlined),

mobile/lib/modules/memories/ui/memory_card.dart

@@ -27,7 +27,7 @@ class MemoryCard extends StatelessWidget {
     super.key,
   });
 
-  String get authToken => 'Bearer ${Store.get(StoreKey.accessToken)}';
+  String get accessToken => Store.get(StoreKey.accessToken);
 
   @override
   Widget build(BuildContext context) {
@@ -55,7 +55,7 @@ class MemoryCard extends StatelessWidget {
                     cacheKey: getThumbnailCacheKey(
                       asset,
                     ),
-                    headers: {"Authorization": authToken},
+                    headers: {"x-immich-user-token": accessToken},
                   ),
                   fit: BoxFit.cover,
                 ),

mobile/lib/modules/search/ui/curated_people_row.dart

@@ -51,7 +51,7 @@ class CuratedPeopleRow extends StatelessWidget {
       itemBuilder: (context, index) {
         final person = content[index];
         final headers = {
-          "Authorization": "Bearer ${Store.get(StoreKey.accessToken)}",
+          "x-immich-user-token": Store.get(StoreKey.accessToken),
         };
         return Padding(
           padding: const EdgeInsets.only(right: 18.0),

mobile/lib/modules/search/ui/thumbnail_with_info.dart

@@ -46,8 +46,7 @@ class ThumbnailWithInfo extends StatelessWidget {
                       fit: BoxFit.cover,
                       imageUrl: imageUrl!,
                       httpHeaders: {
-                        "Authorization":
-                            "Bearer ${Store.get(StoreKey.accessToken)}",
+                        "x-immich-user-token": Store.get(StoreKey.accessToken),
                       },
                       errorWidget: (context, url, error) =>
                           const Icon(Icons.image_not_supported_outlined),

mobile/lib/modules/search/views/person_result_page.dart

@@ -123,8 +123,7 @@ class PersonResultPage extends HookConsumerWidget {
                 backgroundImage: NetworkImage(
                   getFaceThumbnailUrl(personId),
                   headers: {
-                    "Authorization":
-                        "Bearer ${Store.get(StoreKey.accessToken)}",
+                    "x-immich-user-token": Store.get(StoreKey.accessToken),
                   },
                 ),
               ),