Cutlery/immich
1
0
Fork 1
mirror of https://github.com/immich-app/immich.git synced 2025-07-09 03:04:16 -04:00
Code Issues Packages Projects Releases Wiki Activity

feat: new create album page

Browse Source
This commit is contained in:
Alex 2025-07-04 15:25:34 -05:00
parent 73733370a2
commit adf7064b2c
No known key found for this signature in database
GPG Key ID: 53CD082B3A5E1082
11 changed files with 496 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
mobile/lib/domain/models/album/album.model.dart
View File

@ -11,7 +11,7 @@ enum AlbumUserRole {
}
// Model for an album stored in the server
class Album {
class RemoteAlbum {
final String id;
final String name;
final String ownerId;
@ -24,7 +24,7 @@ class Album {
final int assetCount;
final String ownerName;
const Album({
const RemoteAlbum({
required this.id,
required this.name,
required this.ownerId,
@ -57,7 +57,7 @@ class Album {
@override
bool operator ==(Object other) {
if (other is! Album) return false;
if (other is! RemoteAlbum) return false;
if (identical(this, other)) return true;
return id == other.id &&
name == other.name &&

32
mobile/lib/domain/services/remote_album.service.dart
View File

@ -1,33 +1,35 @@
import 'package:immich_mobile/domain/models/album/album.model.dart';
import 'package:immich_mobile/infrastructure/repositories/remote_album.repository.dart';
import 'package:immich_mobile/models/albums/album_search.model.dart';
import 'package:immich_mobile/repositories/album_api.repository.dart';
import 'package:immich_mobile/utils/remote_album.utils.dart';
class RemoteAlbumService {
final DriftRemoteAlbumRepository _repository;
final AlbumApiRepository _albumApiRepository;
const RemoteAlbumService(this._repository);
const RemoteAlbumService(this._repository, this._albumApiRepository);
Future<List<Album>> getAll() {
Future<List<RemoteAlbum>> getAll() {
return _repository.getAll();
}
List<Album> sortAlbums(
List<Album> albums,
List<RemoteAlbum> sortAlbums(
List<RemoteAlbum> albums,
RemoteAlbumSortMode sortMode, {
bool isReverse = false,
}) {
return sortMode.sortFn(albums, isReverse);
}
List<Album> searchAlbums(
List<Album> albums,
List<RemoteAlbum> searchAlbums(
List<RemoteAlbum> albums,
String query,
String? userId, [
QuickFilterMode filterMode = QuickFilterMode.all,
]) {
final lowerQuery = query.toLowerCase();
List<Album> filtered = albums;
List<RemoteAlbum> filtered = albums;
// Apply text search filter
if (query.isNotEmpty) {
@ -57,4 +59,20 @@ class RemoteAlbumService {
return filtered;
}
Future<RemoteAlbum> createAlbum({
required String title,
required List<String> assetIds,
String? description,
}) async {
final album = await _albumApiRepository.createDriftAlbum(
title,
description: description,
assetIds: assetIds,
);
await _repository.create(album);
return album;
}
}

24
mobile/lib/infrastructure/repositories/remote_album.repository.dart
View File

@ -9,7 +9,9 @@ class DriftRemoteAlbumRepository extends DriftDatabaseRepository {
final Drift _db;
const DriftRemoteAlbumRepository(this._db) : super(_db);
Future<List<Album>> getAll({Set<SortRemoteAlbumsBy> sortBy = const {}}) {
Future<List<RemoteAlbum>> getAll({
Set<SortRemoteAlbumsBy> sortBy = const {},
}) {
final assetCount = _db.remoteAlbumAssetEntity.assetId.count();
final query = _db.remoteAlbumEntity.select().join([
@ -48,11 +50,27 @@ class DriftRemoteAlbumRepository extends DriftDatabaseRepository {
)
.get();
}
Future<void> create(RemoteAlbum album) {
final entity = RemoteAlbumEntityCompanion(
id: Value(album.id),
name: Value(album.name),
ownerId: Value(album.ownerId),
createdAt: Value(album.createdAt),
updatedAt: Value(album.updatedAt),
description: Value(album.description),
thumbnailAssetId: Value(album.thumbnailAssetId),
isActivityEnabled: Value(album.isActivityEnabled),
order: Value(album.order),
);
return _db.into(_db.remoteAlbumEntity).insert(entity);
}
}
extension on RemoteAlbumEntityData {
Album toDto({int assetCount = 0, required String ownerName}) {
return Album(
RemoteAlbum toDto({int assetCount = 0, required String ownerName}) {
return RemoteAlbum(
id: id,
name: name,
ownerId: ownerId,

21
mobile/lib/presentation/pages/drift_album.page.dart
View File

@ -97,7 +97,20 @@ class _DriftAlbumsPageState extends ConsumerState<DriftAlbumsPage> {
onRefresh: onRefresh,
child: CustomScrollView(
slivers: [
const ImmichSliverAppBar(),
ImmichSliverAppBar(
actions: [
IconButton(
icon: const Icon(
Icons.add_rounded,
size: 28,
),
onPressed: () => context.pushRoute(
DriftCreateAlbumRoute(),
),
),
],
showUploadButton: false,
),
_SearchBar(
searchController: searchController,
searchFocusNode: searchFocusNode,
@ -475,7 +488,7 @@ class _AlbumList extends StatelessWidget {
final bool isLoading;
final String? error;
final List<Album> albums;
final List<RemoteAlbum> albums;
final String? userId;
@override
@ -599,7 +612,7 @@ class _AlbumGrid extends StatelessWidget {
required this.error,
});
final List<Album> albums;
final List<RemoteAlbum> albums;
final String? userId;
final bool isLoading;
final String? error;
@ -674,7 +687,7 @@ class _GridAlbumCard extends StatelessWidget {
required this.userId,
});
final Album album;
final RemoteAlbum album;
final String? userId;
@override

280
mobile/lib/presentation/pages/drift_create_album.page.dart Normal file
View File

@ -0,0 +1,280 @@
import 'package:auto_route/auto_route.dart';
import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:immich_mobile/domain/models/asset/base_asset.model.dart';
import 'package:immich_mobile/entities/asset.entity.dart';
import 'package:immich_mobile/extensions/build_context_extensions.dart';
import 'package:immich_mobile/models/albums/asset_selection_page_result.model.dart';
import 'package:immich_mobile/providers/album/album.provider.dart';
import 'package:immich_mobile/providers/album/album_title.provider.dart';
import 'package:immich_mobile/providers/album/album_viewer.provider.dart';
import 'package:immich_mobile/providers/infrastructure/album.provider.dart';
import 'package:immich_mobile/routing/router.dart';
import 'package:immich_mobile/widgets/album/album_action_filled_button.dart';
import 'package:immich_mobile/widgets/album/album_title_text_field.dart';
import 'package:immich_mobile/widgets/album/album_viewer_editable_description.dart';
import 'package:immich_mobile/widgets/album/shared_album_thumbnail_image.dart';
@RoutePage()
class DriftCreateAlbumPage extends HookConsumerWidget {
final List<RemoteAsset>? assets;
const DriftCreateAlbumPage({super.key, this.assets});
@override
Widget build(BuildContext context, WidgetRef ref) {
final albumTitleController =
useTextEditingController.fromValue(TextEditingValue.empty);
final albumTitleTextFieldFocusNode = useFocusNode();
final albumDescriptionTextFieldFocusNode = useFocusNode();
final isAlbumTitleTextFieldFocus = useState(false);
final isAlbumTitleEmpty = useState(true);
final selectedAssets = useState<Set<RemoteAsset>>(
assets != null ? Set.from(assets!) : const {},
);
void onBackgroundTapped() {
albumTitleTextFieldFocusNode.unfocus();
albumDescriptionTextFieldFocusNode.unfocus();
isAlbumTitleTextFieldFocus.value = false;
if (albumTitleController.text.isEmpty) {
albumTitleController.text = 'create_album_page_untitled'.tr();
isAlbumTitleEmpty.value = false;
ref
.watch(albumTitleProvider.notifier)
.setAlbumTitle('create_album_page_untitled'.tr());
}
}
onSelectPhotosButtonPressed() async {
// AssetSelectionPageResult? selectedAsset =
// await context.pushRoute<AssetSelectionPageResult?>(
// AlbumAssetSelectionRoute(
// existingAssets: selectedAssets.value,
// canDeselect: true,
// ),
// );
// if (selectedAsset == null) {
// selectedAssets.value = const {};
// } else {
// selectedAssets.value = selectedAsset.selectedAssets;
// }
}
buildTitleInputField() {
return Padding(
padding: const EdgeInsets.only(
right: 10,
left: 10,
),
child: AlbumTitleTextField(
isAlbumTitleEmpty: isAlbumTitleEmpty,
albumTitleTextFieldFocusNode: albumTitleTextFieldFocusNode,
albumTitleController: albumTitleController,
isAlbumTitleTextFieldFocus: isAlbumTitleTextFieldFocus,
),
);
}
buildDescriptionInputField() {
return Padding(
padding: const EdgeInsets.only(
right: 10,
left: 10,
),
child: AlbumViewerEditableDescription(
albumDescription: '',
descriptionFocusNode: albumDescriptionTextFieldFocusNode,
),
);
}
buildTitle() {
if (selectedAssets.value.isEmpty) {
return SliverToBoxAdapter(
child: Padding(
padding: const EdgeInsets.only(top: 200, left: 18),
child: Text(
'create_shared_album_page_share_add_assets',
style: context.textTheme.labelLarge,
).tr(),
),
);
}
return const SliverToBoxAdapter();
}
buildSelectPhotosButton() {
if (selectedAssets.value.isEmpty) {
return SliverToBoxAdapter(
child: Padding(
padding: const EdgeInsets.only(top: 16, left: 16, right: 16),
child: FilledButton.icon(
style: FilledButton.styleFrom(
alignment: Alignment.centerLeft,
padding:
const EdgeInsets.symmetric(vertical: 24, horizontal: 16),
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.all(
Radius.circular(10),
),
),
backgroundColor: context.colorScheme.surfaceContainerHigh,
),
onPressed: onSelectPhotosButtonPressed,
icon: Icon(
Icons.add_rounded,
color: context.primaryColor,
),
label: Padding(
padding: const EdgeInsets.only(left: 8.0),
child: Text(
'create_shared_album_page_share_select_photos',
style: context.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.w600,
color: context.primaryColor,
),
).tr(),
),
),
),
);
}
return const SliverToBoxAdapter();
}
buildControlButton() {
return Padding(
padding: const EdgeInsets.only(left: 12.0, top: 16, bottom: 16),
child: SizedBox(
height: 42,
child: ListView(
scrollDirection: Axis.horizontal,
children: [
AlbumActionFilledButton(
iconData: Icons.add_photo_alternate_outlined,
onPressed: onSelectPhotosButtonPressed,
labelText: "add_photos".tr(),
),
],
),
),
);
}
buildSelectedImageGrid() {
// if (selectedAssets.value.isNotEmpty) {
// return SliverPadding(
// padding: const EdgeInsets.only(top: 16),
// sliver: SliverGrid(
// gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
// crossAxisCount: 3,
// crossAxisSpacing: 5.0,
// mainAxisSpacing: 5,
// ),
// delegate: SliverChildBuilderDelegate(
// (BuildContext context, int index) {
// return GestureDetector(
// onTap: onBackgroundTapped,
// child: SharedAlbumThumbnailImage(
// asset: selectedAssets.value.elementAt(index),
// ),
// );
// },
// childCount: selectedAssets.value.length,
// ),
// ),
// );
// }
return const SliverToBoxAdapter();
}
Future<void> createAlbum() async {
onBackgroundTapped();
final description =
ref.read(albumViewerProvider.select((s) => s.editDescriptionText));
final newAlbum =
await ref.watch(remoteAlbumProvider.notifier).createAlbum(
title: ref.read(albumTitleProvider),
description: description,
// selectedAssets.value.map((e) => e.id).toList(),
);
if (newAlbum != null) {
ref.read(albumProvider.notifier).refreshRemoteAlbums();
selectedAssets.value = {};
ref.read(albumTitleProvider.notifier).clearAlbumTitle();
ref.read(albumViewerProvider.notifier).disableEditAlbum();
// context.replaceRoute(AlbumViewerRoute(albumId: newAlbum.id));
}
}
return Scaffold(
appBar: AppBar(
elevation: 0,
centerTitle: false,
backgroundColor: context.scaffoldBackgroundColor,
leading: IconButton(
onPressed: () {
selectedAssets.value = {};
context.maybePop();
},
icon: const Icon(Icons.close_rounded),
),
title: const Text(
'create_album',
).tr(),
actions: [
TextButton(
onPressed:
albumTitleController.text.isNotEmpty ? createAlbum : null,
child: Text(
'create'.tr(),
style: TextStyle(
fontWeight: FontWeight.bold,
color: albumTitleController.text.isNotEmpty
? context.primaryColor
: context.themeData.disabledColor,
),
),
),
],
),
body: GestureDetector(
onTap: onBackgroundTapped,
child: CustomScrollView(
slivers: [
SliverAppBar(
backgroundColor: context.scaffoldBackgroundColor,
elevation: 5,
automaticallyImplyLeading: false,
pinned: true,
floating: false,
bottom: PreferredSize(
preferredSize: const Size.fromHeight(125.0),
child: Column(
children: [
buildTitleInputField(),
buildDescriptionInputField(),
if (selectedAssets.value.isNotEmpty) buildControlButton(),
],
),
),
),
buildTitle(),
buildSelectPhotosButton(),
buildSelectedImageGrid(),
],
),
),
);
}
}

6
mobile/lib/providers/infrastructure/album.provider.dart
View File

@ -4,6 +4,7 @@ import 'package:immich_mobile/infrastructure/repositories/local_album.repository
import 'package:immich_mobile/infrastructure/repositories/remote_album.repository.dart';
import 'package:immich_mobile/providers/infrastructure/db.provider.dart';
import 'package:immich_mobile/providers/infrastructure/remote_album.provider.dart';
import 'package:immich_mobile/repositories/album_api.repository.dart';
final localAlbumRepository = Provider<DriftLocalAlbumRepository>(
(ref) => DriftLocalAlbumRepository(ref.watch(driftProvider)),
@ -14,7 +15,10 @@ final remoteAlbumRepository = Provider<DriftRemoteAlbumRepository>(
);
final remoteAlbumServiceProvider = Provider<RemoteAlbumService>(
(ref) => RemoteAlbumService(ref.watch(remoteAlbumRepository)),
(ref) => RemoteAlbumService(
ref.watch(remoteAlbumRepository),
ref.watch(albumApiRepositoryProvider),
),
dependencies: [remoteAlbumRepository],
);

39
mobile/lib/providers/infrastructure/remote_album.provider.dart
View File

@ -8,21 +8,21 @@ import 'package:riverpod_annotation/riverpod_annotation.dart';
import 'album.provider.dart';
class RemoteAlbumState {
final List<Album> albums;
final List<Album> filteredAlbums;
final List<RemoteAlbum> albums;
final List<RemoteAlbum> filteredAlbums;
final bool isLoading;
final String? error;
const RemoteAlbumState({
required this.albums,
List<Album>? filteredAlbums,
List<RemoteAlbum>? filteredAlbums,
this.isLoading = false,
this.error,
}) : filteredAlbums = filteredAlbums ?? albums;
RemoteAlbumState copyWith({
List<Album>? albums,
List<Album>? filteredAlbums,
List<RemoteAlbum>? albums,
List<RemoteAlbum>? filteredAlbums,
bool? isLoading,
String? error,
}) {
@ -66,7 +66,7 @@ class RemoteAlbumNotifier extends Notifier<RemoteAlbumState> {
return const RemoteAlbumState(albums: [], filteredAlbums: []);
}
Future<List<Album>> getAll() async {
Future<List<RemoteAlbum>> getAll() async {
state = state.copyWith(isLoading: true, error: null);
try {
@ -118,4 +118,31 @@ class RemoteAlbumNotifier extends Notifier<RemoteAlbumState> {
.sortAlbums(state.filteredAlbums, sortMode, isReverse: isReverse);
state = state.copyWith(filteredAlbums: sortedAlbums);
}
Future<RemoteAlbum?> createAlbum({
required String title,
String? description,
List<String> assetIds = const [],
}) async {
state = state.copyWith(isLoading: true, error: null);
try {
final album = await _remoteAlbumService.createAlbum(
title: title,
description: description,
assetIds: assetIds,
);
state = state.copyWith(
albums: [...state.albums, album],
filteredAlbums: [...state.filteredAlbums, album],
);
state = state.copyWith(isLoading: false);
return album;
} catch (e) {
state = state.copyWith(isLoading: false, error: e.toString());
rethrow;
}
}
}

39
mobile/lib/repositories/album_api.repository.dart
View File

@ -1,5 +1,7 @@
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:immich_mobile/constants/enums.dart';
import 'package:immich_mobile/domain/models/album/album.model.dart'
show AlbumAssetOrder, RemoteAlbum;
import 'package:immich_mobile/entities/album.entity.dart';
import 'package:immich_mobile/entities/asset.entity.dart';
import 'package:immich_mobile/infrastructure/entities/user.entity.dart'
@ -50,6 +52,25 @@ class AlbumApiRepository extends ApiRepository {
return _toAlbum(responseDto);
}
// TODO: Change name after removing old method
Future<RemoteAlbum> createDriftAlbum(
String name, {
required Iterable<String> assetIds,
String? description,
}) async {
final responseDto = await checkNull(
_api.createAlbum(
CreateAlbumDto(
albumName: name,
description: description,
assetIds: assetIds.toList(),
),
),
);
return _toRemoteAlbum(responseDto);
}
Future<Album> update(
String albumId, {
String? name,
@ -170,4 +191,22 @@ class AlbumApiRepository extends ApiRepository {
return album;
}
static RemoteAlbum _toRemoteAlbum(AlbumResponseDto dto) {
return RemoteAlbum(
id: dto.id,
name: dto.albumName,
ownerId: dto.owner.id,
description: dto.description,
createdAt: dto.createdAt,
updatedAt: dto.updatedAt,
thumbnailAssetId: dto.albumThumbnailAssetId,
isActivityEnabled: dto.isActivityEnabled,
order: dto.order == AssetOrder.asc
? AlbumAssetOrder.asc
: AlbumAssetOrder.desc,
assetCount: dto.assetCount,
ownerName: dto.owner.name,
);
}
}

6
mobile/lib/routing/router.dart
View File

@ -1,6 +1,7 @@
import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:immich_mobile/domain/models/asset/base_asset.model.dart';
import 'package:immich_mobile/domain/models/log.model.dart';
import 'package:immich_mobile/domain/models/memory.model.dart';
import 'package:immich_mobile/domain/models/user.model.dart';
@ -72,6 +73,7 @@ import 'package:immich_mobile/presentation/pages/dev/main_timeline.page.dart';
import 'package:immich_mobile/presentation/pages/dev/media_stat.page.dart';
import 'package:immich_mobile/presentation/pages/dev/remote_timeline.page.dart';
import 'package:immich_mobile/presentation/pages/drift_album.page.dart';
import 'package:immich_mobile/presentation/pages/drift_create_album.page.dart';
import 'package:immich_mobile/presentation/pages/drift_memory.page.dart';
import 'package:immich_mobile/presentation/widgets/asset_viewer/asset_viewer.page.dart';
import 'package:immich_mobile/providers/api.provider.dart';
@ -392,6 +394,10 @@ class AppRouter extends RootStackRouter {
page: DriftMemoryRoute.page,
guards: [_authGuard, _duplicateGuard],
),
AutoRoute(
page: DriftCreateAlbumRoute.page,
guards: [_authGuard, _duplicateGuard],
),
// required to handle all deeplinks in deep_link.service.dart
// auto_route_library#1722

39
mobile/lib/routing/router.gr.dart
View File

@ -618,6 +618,45 @@ class DriftAlbumsRoute extends PageRouteInfo<void> {
);
}
/// generated route for
/// [DriftCreateAlbumPage]
class DriftCreateAlbumRoute extends PageRouteInfo<DriftCreateAlbumRouteArgs> {
DriftCreateAlbumRoute({
Key? key,
List<RemoteAsset>? assets,
List<PageRouteInfo>? children,
}) : super(
DriftCreateAlbumRoute.name,
args: DriftCreateAlbumRouteArgs(key: key, assets: assets),
initialChildren: children,
);
static const String name = 'DriftCreateAlbumRoute';
static PageInfo page = PageInfo(
name,
builder: (data) {
final args = data.argsAs<DriftCreateAlbumRouteArgs>(
orElse: () => const DriftCreateAlbumRouteArgs(),
);
return DriftCreateAlbumPage(key: args.key, assets: args.assets);
},
);
}
class DriftCreateAlbumRouteArgs {
const DriftCreateAlbumRouteArgs({this.key, this.assets});
final Key? key;
final List<RemoteAsset>? assets;
@override
String toString() {
return 'DriftCreateAlbumRouteArgs{key: $key, assets: $assets}';
}
}
/// generated route for
/// [DriftMemoryPage]
class DriftMemoryRoute extends PageRouteInfo<DriftMemoryRouteArgs> {

35
mobile/lib/utils/remote_album.utils.dart
View File

@ -1,38 +1,56 @@
import 'package:collection/collection.dart';
import 'package:immich_mobile/domain/models/album/album.model.dart';
typedef AlbumSortFn = List<Album> Function(List<Album> albums, bool isReverse);
typedef AlbumSortFn = List<RemoteAlbum> Function(
List<RemoteAlbum> albums,
bool isReverse,
);
class _RemoteAlbumSortHandlers {
const _RemoteAlbumSortHandlers._();
static const AlbumSortFn created = _sortByCreated;
static List<Album> _sortByCreated(List<Album> albums, bool isReverse) {
static List<RemoteAlbum> _sortByCreated(
List<RemoteAlbum> albums,
bool isReverse,
) {
final sorted = albums.sortedBy((album) => album.createdAt);
return (isReverse ? sorted.reversed : sorted).toList();
}
static const AlbumSortFn title = _sortByTitle;
static List<Album> _sortByTitle(List<Album> albums, bool isReverse) {
static List<RemoteAlbum> _sortByTitle(
List<RemoteAlbum> albums,
bool isReverse,
) {
final sorted = albums.sortedBy((album) => album.name);
return (isReverse ? sorted.reversed : sorted).toList();
}
static const AlbumSortFn lastModified = _sortByLastModified;
static List<Album> _sortByLastModified(List<Album> albums, bool isReverse) {
static List<RemoteAlbum> _sortByLastModified(
List<RemoteAlbum> albums,
bool isReverse,
) {
final sorted = albums.sortedBy((album) => album.updatedAt);
return (isReverse ? sorted.reversed : sorted).toList();
}
static const AlbumSortFn assetCount = _sortByAssetCount;
static List<Album> _sortByAssetCount(List<Album> albums, bool isReverse) {
static List<RemoteAlbum> _sortByAssetCount(
List<RemoteAlbum> albums,
bool isReverse,
) {
final sorted =
albums.sorted((a, b) => a.assetCount.compareTo(b.assetCount));
return (isReverse ? sorted.reversed : sorted).toList();
}
static const AlbumSortFn mostRecent = _sortByMostRecent;
static List<Album> _sortByMostRecent(List<Album> albums, bool isReverse) {
static List<RemoteAlbum> _sortByMostRecent(
List<RemoteAlbum> albums,
bool isReverse,
) {
final sorted = albums.sorted((a, b) {
// For most recent, we sort by updatedAt in descending order
return b.updatedAt.compareTo(a.updatedAt);
@ -41,7 +59,10 @@ class _RemoteAlbumSortHandlers {
}
static const AlbumSortFn mostOldest = _sortByMostOldest;
static List<Album> _sortByMostOldest(List<Album> albums, bool isReverse) {
static List<RemoteAlbum> _sortByMostOldest(
List<RemoteAlbum> albums,
bool isReverse,
) {
final sorted = albums.sorted((a, b) {
// For oldest, we sort by createdAt in ascending order
return a.createdAt.compareTo(b.createdAt);