|
@@ -5,6 +5,7 @@ import 'package:flutter_hooks/flutter_hooks.dart';
|
|
import 'package:fluttertoast/fluttertoast.dart';
|
|
import 'package:fluttertoast/fluttertoast.dart';
|
|
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
|
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
|
import 'package:immich_mobile/constants/immich_colors.dart';
|
|
import 'package:immich_mobile/constants/immich_colors.dart';
|
|
|
|
+import 'package:immich_mobile/modules/backup/models/available_album.model.dart';
|
|
import 'package:immich_mobile/modules/backup/providers/backup.provider.dart';
|
|
import 'package:immich_mobile/modules/backup/providers/backup.provider.dart';
|
|
import 'package:immich_mobile/modules/backup/ui/album_info_card.dart';
|
|
import 'package:immich_mobile/modules/backup/ui/album_info_card.dart';
|
|
import 'package:immich_mobile/shared/ui/immich_loading_indicator.dart';
|
|
import 'package:immich_mobile/shared/ui/immich_loading_indicator.dart';
|
|
@@ -14,10 +15,13 @@ class BackupAlbumSelectionPage extends HookConsumerWidget {
|
|
const BackupAlbumSelectionPage({Key? key}) : super(key: key);
|
|
const BackupAlbumSelectionPage({Key? key}) : super(key: key);
|
|
@override
|
|
@override
|
|
Widget build(BuildContext context, WidgetRef ref) {
|
|
Widget build(BuildContext context, WidgetRef ref) {
|
|
- final availableAlbums = ref.watch(backupProvider).availableAlbums;
|
|
|
|
|
|
+ // final availableAlbums = ref.watch(backupProvider).availableAlbums;
|
|
final selectedBackupAlbums = ref.watch(backupProvider).selectedBackupAlbums;
|
|
final selectedBackupAlbums = ref.watch(backupProvider).selectedBackupAlbums;
|
|
final excludedBackupAlbums = ref.watch(backupProvider).excludedBackupAlbums;
|
|
final excludedBackupAlbums = ref.watch(backupProvider).excludedBackupAlbums;
|
|
final isDarkTheme = Theme.of(context).brightness == Brightness.dark;
|
|
final isDarkTheme = Theme.of(context).brightness == Brightness.dark;
|
|
|
|
+ final albums = useState<List<AvailableAlbum>>(
|
|
|
|
+ ref.watch(backupProvider).availableAlbums,
|
|
|
|
+ );
|
|
|
|
|
|
useEffect(
|
|
useEffect(
|
|
() {
|
|
() {
|
|
@@ -28,7 +32,7 @@ class BackupAlbumSelectionPage extends HookConsumerWidget {
|
|
);
|
|
);
|
|
|
|
|
|
buildAlbumSelectionList() {
|
|
buildAlbumSelectionList() {
|
|
- if (availableAlbums.isEmpty) {
|
|
|
|
|
|
+ if (albums.value.isEmpty) {
|
|
return const Center(
|
|
return const Center(
|
|
child: ImmichLoadingIndicator(),
|
|
child: ImmichLoadingIndicator(),
|
|
);
|
|
);
|
|
@@ -38,17 +42,17 @@ class BackupAlbumSelectionPage extends HookConsumerWidget {
|
|
height: 265,
|
|
height: 265,
|
|
child: ListView.builder(
|
|
child: ListView.builder(
|
|
scrollDirection: Axis.horizontal,
|
|
scrollDirection: Axis.horizontal,
|
|
- itemCount: availableAlbums.length,
|
|
|
|
|
|
+ itemCount: albums.value.length,
|
|
physics: const BouncingScrollPhysics(),
|
|
physics: const BouncingScrollPhysics(),
|
|
itemBuilder: ((context, index) {
|
|
itemBuilder: ((context, index) {
|
|
- var thumbnailData = availableAlbums[index].thumbnailData;
|
|
|
|
|
|
+ var thumbnailData = albums.value[index].thumbnailData;
|
|
return Padding(
|
|
return Padding(
|
|
padding: index == 0
|
|
padding: index == 0
|
|
? const EdgeInsets.only(left: 16.00)
|
|
? const EdgeInsets.only(left: 16.00)
|
|
: const EdgeInsets.all(0),
|
|
: const EdgeInsets.all(0),
|
|
child: AlbumInfoCard(
|
|
child: AlbumInfoCard(
|
|
imageData: thumbnailData,
|
|
imageData: thumbnailData,
|
|
- albumInfo: availableAlbums[index],
|
|
|
|
|
|
+ albumInfo: albums.value[index],
|
|
),
|
|
),
|
|
);
|
|
);
|
|
}),
|
|
}),
|
|
@@ -79,15 +83,13 @@ class BackupAlbumSelectionPage extends HookConsumerWidget {
|
|
child: Chip(
|
|
child: Chip(
|
|
visualDensity: VisualDensity.compact,
|
|
visualDensity: VisualDensity.compact,
|
|
shape: RoundedRectangleBorder(
|
|
shape: RoundedRectangleBorder(
|
|
- borderRadius: BorderRadius.circular(5),
|
|
|
|
|
|
+ borderRadius: BorderRadius.circular(10),
|
|
),
|
|
),
|
|
label: Text(
|
|
label: Text(
|
|
album.name,
|
|
album.name,
|
|
style: TextStyle(
|
|
style: TextStyle(
|
|
fontSize: 10,
|
|
fontSize: 10,
|
|
- color: Theme.of(context).brightness == Brightness.dark
|
|
|
|
- ? Colors.black
|
|
|
|
- : Colors.white,
|
|
|
|
|
|
+ color: isDarkTheme ? Colors.black : Colors.white,
|
|
fontWeight: FontWeight.bold,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
@@ -119,7 +121,7 @@ class BackupAlbumSelectionPage extends HookConsumerWidget {
|
|
child: Chip(
|
|
child: Chip(
|
|
visualDensity: VisualDensity.compact,
|
|
visualDensity: VisualDensity.compact,
|
|
shape: RoundedRectangleBorder(
|
|
shape: RoundedRectangleBorder(
|
|
- borderRadius: BorderRadius.circular(5),
|
|
|
|
|
|
+ borderRadius: BorderRadius.circular(10),
|
|
),
|
|
),
|
|
label: Text(
|
|
label: Text(
|
|
album.name,
|
|
album.name,
|
|
@@ -143,6 +145,46 @@ class BackupAlbumSelectionPage extends HookConsumerWidget {
|
|
}).toSet();
|
|
}).toSet();
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+ buildSearchBar() {
|
|
|
|
+ return Padding(
|
|
|
|
+ padding: const EdgeInsets.only(left: 16.0, right: 16, bottom: 8.0),
|
|
|
|
+ child: TextFormField(
|
|
|
|
+ onChanged: (searchValue) {
|
|
|
|
+ albums.value = ref
|
|
|
|
+ .watch(backupProvider)
|
|
|
|
+ .availableAlbums
|
|
|
|
+ .where(
|
|
|
|
+ (album) => album.name
|
|
|
|
+ .toLowerCase()
|
|
|
|
+ .contains(searchValue.toLowerCase()),
|
|
|
|
+ )
|
|
|
|
+ .toList();
|
|
|
|
+ },
|
|
|
|
+ decoration: InputDecoration(
|
|
|
|
+ contentPadding: const EdgeInsets.symmetric(
|
|
|
|
+ horizontal: 8.0,
|
|
|
|
+ vertical: 8.0,
|
|
|
|
+ ),
|
|
|
|
+ hintText: "Search",
|
|
|
|
+ hintStyle: TextStyle(
|
|
|
|
+ color: isDarkTheme ? Colors.white : Colors.grey,
|
|
|
|
+ fontSize: 14.0,
|
|
|
|
+ ),
|
|
|
|
+ prefixIcon: const Icon(
|
|
|
|
+ Icons.search,
|
|
|
|
+ color: Colors.grey,
|
|
|
|
+ ),
|
|
|
|
+ border: OutlineInputBorder(
|
|
|
|
+ borderRadius: BorderRadius.circular(10),
|
|
|
|
+ borderSide: BorderSide.none,
|
|
|
|
+ ),
|
|
|
|
+ filled: true,
|
|
|
|
+ fillColor: isDarkTheme ? Colors.white30 : Colors.grey[200],
|
|
|
|
+ ),
|
|
|
|
+ ),
|
|
|
|
+ );
|
|
|
|
+ }
|
|
|
|
+
|
|
return Scaffold(
|
|
return Scaffold(
|
|
appBar: AppBar(
|
|
appBar: AppBar(
|
|
leading: IconButton(
|
|
leading: IconButton(
|
|
@@ -188,7 +230,7 @@ class BackupAlbumSelectionPage extends HookConsumerWidget {
|
|
child: Card(
|
|
child: Card(
|
|
margin: const EdgeInsets.all(0),
|
|
margin: const EdgeInsets.all(0),
|
|
shape: RoundedRectangleBorder(
|
|
shape: RoundedRectangleBorder(
|
|
- borderRadius: BorderRadius.circular(5),
|
|
|
|
|
|
+ borderRadius: BorderRadius.circular(10),
|
|
side: BorderSide(
|
|
side: BorderSide(
|
|
color: isDarkTheme
|
|
color: isDarkTheme
|
|
? const Color.fromARGB(255, 0, 0, 0)
|
|
? const Color.fromARGB(255, 0, 0, 0)
|
|
@@ -225,8 +267,11 @@ class BackupAlbumSelectionPage extends HookConsumerWidget {
|
|
|
|
|
|
ListTile(
|
|
ListTile(
|
|
title: Text(
|
|
title: Text(
|
|
- "backup_album_selection_page_albums_device"
|
|
|
|
- .tr(args: [availableAlbums.length.toString()]),
|
|
|
|
|
|
+ "backup_album_selection_page_albums_device".tr(
|
|
|
|
+ args: [
|
|
|
|
+ ref.watch(backupProvider).availableAlbums.length.toString()
|
|
|
|
+ ],
|
|
|
|
+ ),
|
|
style: const TextStyle(fontWeight: FontWeight.bold, fontSize: 14),
|
|
style: const TextStyle(fontWeight: FontWeight.bold, fontSize: 14),
|
|
),
|
|
),
|
|
subtitle: Padding(
|
|
subtitle: Padding(
|
|
@@ -254,7 +299,7 @@ class BackupAlbumSelectionPage extends HookConsumerWidget {
|
|
builder: (BuildContext context) {
|
|
builder: (BuildContext context) {
|
|
return AlertDialog(
|
|
return AlertDialog(
|
|
shape: RoundedRectangleBorder(
|
|
shape: RoundedRectangleBorder(
|
|
- borderRadius: BorderRadius.circular(12),
|
|
|
|
|
|
+ borderRadius: BorderRadius.circular(10),
|
|
),
|
|
),
|
|
elevation: 5,
|
|
elevation: 5,
|
|
title: Text(
|
|
title: Text(
|
|
@@ -284,6 +329,8 @@ class BackupAlbumSelectionPage extends HookConsumerWidget {
|
|
),
|
|
),
|
|
),
|
|
),
|
|
|
|
|
|
|
|
+ buildSearchBar(),
|
|
|
|
+
|
|
Padding(
|
|
Padding(
|
|
padding: const EdgeInsets.only(bottom: 16.0),
|
|
padding: const EdgeInsets.only(bottom: 16.0),
|
|
child: buildAlbumSelectionList(),
|
|
child: buildAlbumSelectionList(),
|