admin/linkding-ios
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

Improved tablet webview

Browse Source
This commit is contained in:
Juan Gilsanz Polo
2024-02-29 12:41:30 +01:00
parent 38f2bfd921
commit 60becf945b
16 changed files with 403 additions and 317 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
lib/screens/bookmarks/model/bookmarks.model.dart
View File

@@ -1,3 +1,5 @@
import 'package:go_router/go_router.dart';
import 'package:linkdy/config/options.dart';
import 'package:linkdy/constants/enums.dart';
import 'package:linkdy/models/data/bookmarks.dart';
@@ -11,6 +13,7 @@ class BookmarksModel {
int maxNumber;
ReadStatus readStatus;
Bookmark? selectedBookmark;
final GoRouter webViewRouter;
BookmarksModel({
this.currentPage = 0,
@@ -21,5 +24,6 @@ class BookmarksModel {
this.maxNumber = 0,
this.readStatus = ReadStatus.all,
this.selectedBookmark,
required this.webViewRouter,
});
}

3
lib/screens/bookmarks/model/search_bookmarks.model.dart
View File

@@ -1,4 +1,5 @@
import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import 'package:linkdy/config/options.dart';
import 'package:linkdy/constants/enums.dart';
@@ -14,6 +15,7 @@ class SearchBookmarksModel {
bool loadingMore;
int maxNumber;
Bookmark? selectedBookmark;
final GoRouter webViewRouter;
SearchBookmarksModel({
required this.searchController,
@@ -25,5 +27,6 @@ class SearchBookmarksModel {
this.loadingMore = false,
this.maxNumber = 0,
this.selectedBookmark,
required this.webViewRouter,
});
}

36
lib/screens/bookmarks/provider/bookmarks.provider.dart
View File

@@ -1,5 +1,8 @@
import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import 'package:riverpod_annotation/riverpod_annotation.dart';
import 'package:linkdy/screens/webview/ui/webview.dart';
import 'package:linkdy/screens/bookmarks/provider/common_functions.dart';
import 'package:linkdy/screens/bookmarks/provider/favicon_loader.provider.dart';
import 'package:linkdy/screens/bookmarks/model/bookmarks.model.dart';
@@ -59,12 +62,29 @@ FutureOr<void> bookmarksRequestLoadMore(BookmarksRequestLoadMoreRef ref) async {
ref.read(bookmarksProvider.notifier).setLoadingMore(false);
}
const _webViewRoute = "wb";
const _webViewRoutePath = "/wb";
@riverpod
class Bookmarks extends _$Bookmarks {
@override
BookmarksModel build() {
final model = BookmarksModel(
bookmarks: [],
webViewRouter: GoRouter(
routes: [
GoRoute(
path: "/",
builder: (context, state) => const SizedBox(),
routes: [
GoRoute(
path: _webViewRoute,
builder: (context, state) => WebViewScreen(bookmark: state.extra as Bookmark),
),
],
),
],
),
);
ref.read(bookmarksRequestProvider(model.readStatus, model.limit));
return model;
@@ -98,11 +118,27 @@ class Bookmarks extends _$Bookmarks {
ref.notifyListeners();
}
void pushRoute(String path, bool splitMode) {
if (splitMode == true && state.webViewRouter.canPop()) {
state.selectedBookmark = null;
ref.notifyListeners();
state.webViewRouter.pop();
}
ref.read(routerProvider).push(path);
}
void clearSelectedBookmark() {
state.selectedBookmark = null;
ref.notifyListeners();
}
void selectBookmark(Bookmark bookmark, double width) {
if (width <= Sizes.tabletBreakpoint && ref.watch(appStatusProvider).useInAppBrowser == true) {
ref.watch(routerProvider).push(RoutesPaths.webview, extra: bookmark);
} else if (width <= Sizes.tabletBreakpoint && ref.watch(appStatusProvider).useInAppBrowser == false) {
openUrl(bookmark.url!);
} else if (bookmark != state.selectedBookmark) {
state.webViewRouter.go(_webViewRoutePath, extra: bookmark);
}
state.selectedBookmark = bookmark;
ref.notifyListeners();

2
lib/screens/bookmarks/provider/bookmarks.provider.g.dart
View File

@@ -189,7 +189,7 @@ final bookmarksRequestLoadMoreProvider =
);
typedef BookmarksRequestLoadMoreRef = AutoDisposeFutureProviderRef<void>;
String _$bookmarksHash() => r'80e94e586950b9072f229958f98c88069086d7ab';
String _$bookmarksHash() => r'84c91bf9112343e4680040bfe25b5e17fb2f92d2';
/// See also [Bookmarks].
@ProviderFor(Bookmarks)

21
lib/screens/bookmarks/provider/search_bookmarks.provider.dart
View File

@@ -1,6 +1,8 @@
import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import 'package:riverpod_annotation/riverpod_annotation.dart';
import 'package:linkdy/screens/webview/ui/webview.dart';
import 'package:linkdy/screens/bookmarks/provider/favicon_loader.provider.dart';
import 'package:linkdy/screens/bookmarks/provider/bookmarks.provider.dart';
import 'package:linkdy/screens/bookmarks/provider/common_functions.dart';
@@ -63,6 +65,9 @@ FutureOr<void> fetchSearchBookmarksLoadMore(FetchSearchBookmarksLoadMoreRef ref)
ref.read(searchBookmarksProvider.notifier).setLoadingMore(false);
}
const _webViewRoute = "wb";
const _webViewRoutePath = "/wb";
@riverpod
class SearchBookmarks extends _$SearchBookmarks {
@override
@@ -70,6 +75,20 @@ class SearchBookmarks extends _$SearchBookmarks {
final model = SearchBookmarksModel(
searchController: TextEditingController(),
bookmarks: [],
webViewRouter: GoRouter(
routes: [
GoRoute(
path: "/",
builder: (context, state) => const SizedBox(),
routes: [
GoRoute(
path: _webViewRoute,
builder: (context, state) => WebViewScreen(bookmark: state.extra as Bookmark),
),
],
),
],
),
);
ref.read(fetchSearchBookmarksProvider(model.limit));
return model;
@@ -109,6 +128,8 @@ class SearchBookmarks extends _$SearchBookmarks {
ref.watch(routerProvider).push(RoutesPaths.webview, extra: bookmark);
} else if (width <= Sizes.tabletBreakpoint && ref.watch(appStatusProvider).useInAppBrowser == false) {
openUrl(bookmark.url!);
} else if (bookmark != state.selectedBookmark) {
state.webViewRouter.go(_webViewRoutePath, extra: bookmark);
}
state.selectedBookmark = bookmark;
ref.notifyListeners();

2
lib/screens/bookmarks/provider/search_bookmarks.provider.g.dart
View File

@@ -174,7 +174,7 @@ final fetchSearchBookmarksLoadMoreProvider =
);
typedef FetchSearchBookmarksLoadMoreRef = AutoDisposeFutureProviderRef<void>;
String _$searchBookmarksHash() => r'3daf460b8389e8bcf8498c4bdf3935e88f4ce156';
String _$searchBookmarksHash() => r'5ebbd8dbfe705cbca9552fc60d251372c771d738';
/// See also [SearchBookmarks].
@ProviderFor(SearchBookmarks)

378
lib/screens/bookmarks/ui/bookmarks.dart
View File

@@ -8,19 +8,19 @@ import 'package:linkdy/screens/bookmarks/ui/bookmark_item.dart';
import 'package:linkdy/screens/bookmarks/ui/bookmark_form_modal.dart';
import 'package:linkdy/screens/bookmarks/ui/delete_bookmark_modal.dart';
import 'package:linkdy/screens/bookmarks/ui/search_bookmarks.dart';
import 'package:linkdy/screens/webview/ui/webview.dart';
import 'package:linkdy/widgets/circle_page_transition.dart';
import 'package:linkdy/widgets/error_screen.dart';
import 'package:linkdy/widgets/no_data_screen.dart';
import 'package:linkdy/config/sizes.dart';
import 'package:linkdy/constants/enums.dart';
import 'package:linkdy/providers/router.provider.dart';
import 'package:linkdy/router/paths.dart';
import 'package:linkdy/constants/global_keys.dart';
import 'package:linkdy/i18n/strings.g.dart';
import 'package:linkdy/widgets/system_overlay_style.dart';
final GlobalKey _searchButtonKey = GlobalKey();
final webviewBookmarksKey = GlobalKey<NavigatorState>();
class BookmarksScreen extends ConsumerWidget {
const BookmarksScreen({super.key});
@@ -35,16 +35,12 @@ class BookmarksScreen extends ConsumerWidget {
return Row(
children: [
const Expanded(flex: 2, child: _List(tabletMode: true)),
if (ref.watch(bookmarksProvider).selectedBookmark != null)
Expanded(
flex: 3,
child: WebViewScreen(bookmark: ref.watch(bookmarksProvider).selectedBookmark!),
),
if (ref.watch(bookmarksProvider).selectedBookmark == null)
const Expanded(
flex: 3,
child: SizedBox(),
Expanded(
flex: 3,
child: Material(
child: Router.withConfig(config: ref.watch(bookmarksProvider).webViewRouter),
),
),
],
);
} else {
@@ -71,6 +67,10 @@ class _List extends ConsumerWidget {
void openSearchModal() {
if (_searchButtonKey.currentContext == null) return;
if (tabletMode == true && ref.read(bookmarksProvider).webViewRouter.canPop()) {
ref.read(bookmarksProvider.notifier).clearSelectedBookmark();
ref.read(bookmarksProvider).webViewRouter.pop();
}
RenderBox box = _searchButtonKey.currentContext!.findRenderObject() as RenderBox;
Offset position = box.localToGlobal(Offset.zero);
Navigator.of(context, rootNavigator: true).push(
@@ -91,200 +91,204 @@ class _List extends ConsumerWidget {
return false;
}
return Scaffold(
body: NestedScrollView(
headerSliverBuilder: (context, innerBoxIsScrolled) => [
SliverOverlapAbsorber(
handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
sliver: SliverAppBar.large(
pinned: true,
floating: true,
centerTitle: false,
forceElevated: innerBoxIsScrolled,
title: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Text(t.bookmarks.bookmarks),
if (bookmarks.readStatus == ReadStatus.read || bookmarks.readStatus == ReadStatus.unread)
Container(
margin: const EdgeInsets.only(left: 8),
padding: const EdgeInsets.symmetric(
horizontal: 8,
vertical: 4,
),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20),
color: Theme.of(context).colorScheme.primaryContainer,
),
child: Row(
children: [
Icon(
bookmarks.readStatus == ReadStatus.read
? Icons.mark_email_read_rounded
: Icons.mark_as_unread_rounded,
size: 14,
color: Theme.of(context).colorScheme.onPrimaryContainer,
),
const SizedBox(width: 4),
Text(
bookmarks.readStatus == ReadStatus.read ? t.bookmarks.read : t.bookmarks.unread,
style: TextStyle(
fontSize: 12,
return OverlayStyle(
child: Scaffold(
body: NestedScrollView(
headerSliverBuilder: (context, innerBoxIsScrolled) => [
SliverOverlapAbsorber(
handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
sliver: SliverAppBar.large(
pinned: true,
floating: true,
centerTitle: false,
forceElevated: innerBoxIsScrolled,
title: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Text(t.bookmarks.bookmarks),
if (bookmarks.readStatus == ReadStatus.read || bookmarks.readStatus == ReadStatus.unread)
Container(
margin: const EdgeInsets.only(left: 8),
padding: const EdgeInsets.symmetric(
horizontal: 8,
vertical: 4,
),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20),
color: Theme.of(context).colorScheme.primaryContainer,
),
child: Row(
children: [
Icon(
bookmarks.readStatus == ReadStatus.read
? Icons.mark_email_read_rounded
: Icons.mark_as_unread_rounded,
size: 14,
color: Theme.of(context).colorScheme.onPrimaryContainer,
fontWeight: FontWeight.w700,
),
),
],
const SizedBox(width: 4),
Text(
bookmarks.readStatus == ReadStatus.read ? t.bookmarks.read : t.bookmarks.unread,
style: TextStyle(
fontSize: 12,
color: Theme.of(context).colorScheme.onPrimaryContainer,
fontWeight: FontWeight.w700,
),
),
],
),
),
],
),
actions: [
IconButton(
key: _searchButtonKey,
onPressed: openSearchModal,
icon: const Icon(Icons.search_rounded),
tooltip: t.bookmarks.search.searchBookmarks,
),
IconButton(
onPressed: () => showModalBottomSheet(
context: context,
useRootNavigator: true,
builder: (context) => const VisualizationModal(),
isScrollControlled: true,
),
icon: const Icon(Icons.sort_rounded),
tooltip: t.bookmarks.filterSort,
),
PopupMenuButton(
itemBuilder: (context) => <PopupMenuEntry>[
PopupMenuItem(
onTap: () =>
ref.read(bookmarksProvider.notifier).pushRoute(RoutesPaths.archivedBookmarks, tabletMode),
child: Row(
children: [
const Icon(Icons.archive_rounded),
const SizedBox(width: 16),
Text(t.bookmarks.archived),
],
),
),
PopupMenuItem(
onTap: () =>
ref.read(bookmarksProvider.notifier).pushRoute(RoutesPaths.sharedBookmarks, tabletMode),
child: Row(
children: [
const Icon(Icons.share_rounded),
const SizedBox(width: 16),
Text(t.bookmarks.shared),
],
),
),
const PopupMenuDivider(height: 1),
PopupMenuItem(
onTap: () => ref.read(bookmarksProvider.notifier).pushRoute(RoutesPaths.tags, tabletMode),
child: Row(
children: [
const Icon(Icons.label_rounded),
const SizedBox(width: 16),
Text(t.tags.tags),
],
),
),
const PopupMenuDivider(height: 1),
PopupMenuItem(
onTap: () => ref.read(bookmarksProvider.notifier).pushRoute(RoutesPaths.settings, tabletMode),
child: Row(
children: [
const Icon(Icons.settings_rounded),
const SizedBox(width: 16),
Text(t.settings.settings),
],
),
),
],
),
const SizedBox(width: 8),
],
),
actions: [
IconButton(
key: _searchButtonKey,
onPressed: openSearchModal,
icon: const Icon(Icons.search_rounded),
tooltip: t.bookmarks.search.searchBookmarks,
),
IconButton(
onPressed: () => showModalBottomSheet(
context: context,
useRootNavigator: true,
builder: (context) => const VisualizationModal(),
isScrollControlled: true,
),
icon: const Icon(Icons.sort_rounded),
tooltip: t.bookmarks.filterSort,
),
PopupMenuButton(
itemBuilder: (context) => <PopupMenuEntry>[
PopupMenuItem(
onTap: () => ref.read(routerProvider).push(RoutesPaths.archivedBookmarks),
child: Row(
children: [
const Icon(Icons.archive_rounded),
const SizedBox(width: 16),
Text(t.bookmarks.archived),
],
),
),
PopupMenuItem(
onTap: () => ref.read(routerProvider).push(RoutesPaths.sharedBookmarks),
child: Row(
children: [
const Icon(Icons.share_rounded),
const SizedBox(width: 16),
Text(t.bookmarks.shared),
],
),
),
const PopupMenuDivider(height: 1),
PopupMenuItem(
onTap: () => ref.read(routerProvider).push(RoutesPaths.tags),
child: Row(
children: [
const Icon(Icons.label_rounded),
const SizedBox(width: 16),
Text(t.tags.tags),
],
),
),
const PopupMenuDivider(height: 1),
PopupMenuItem(
onTap: () => ref.read(routerProvider).push(RoutesPaths.settings),
child: Row(
children: [
const Icon(Icons.settings_rounded),
const SizedBox(width: 16),
Text(t.settings.settings),
],
),
),
],
),
const SizedBox(width: 8),
],
),
),
],
body: SafeArea(
top: false,
bottom: true,
child: Builder(
builder: (context) => RefreshIndicator(
displacement: 120,
onRefresh: () => ref.read(bookmarksProvider.notifier).refresh(),
child: NotificationListener(
onNotification: scrollListener,
child: CustomScrollView(
slivers: [
SliverOverlapInjector(
handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
),
if (bookmarks.inialLoadStatus == LoadStatus.loading)
const SliverFillRemaining(
child: Center(child: CircularProgressIndicator()),
],
body: SafeArea(
top: false,
bottom: true,
child: Builder(
builder: (context) => RefreshIndicator(
displacement: 120,
onRefresh: () => ref.read(bookmarksProvider.notifier).refresh(),
child: NotificationListener(
onNotification: scrollListener,
child: CustomScrollView(
slivers: [
SliverOverlapInjector(
handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
),
if (bookmarks.inialLoadStatus == LoadStatus.error)
SliverFillRemaining(
child: ErrorScreen(
error: t.bookmarks.cannotLoadBookmarks,
if (bookmarks.inialLoadStatus == LoadStatus.loading)
const SliverFillRemaining(
child: Center(child: CircularProgressIndicator()),
),
),
if (bookmarks.bookmarks.isEmpty)
SliverFillRemaining(
child: NoDataScreen(
message: t.bookmarks.noBookmarksAdded,
if (bookmarks.inialLoadStatus == LoadStatus.error)
SliverFillRemaining(
child: ErrorScreen(
error: t.bookmarks.cannotLoadBookmarks,
),
),
),
if (bookmarks.bookmarks.isNotEmpty)
SlidableAutoCloseBehavior(
child: SliverList.builder(
itemCount: bookmarks.bookmarks.length + 1,
itemBuilder: (context, index) {
// index == bookmarks.value!.content!.results!.length -> itemCount + 1
if (index == bookmarks.bookmarks.length) {
if (bookmarks.loadingMore) {
return const SizedBox(
height: 80,
child: Center(
child: CircularProgressIndicator(),
),
);
if (bookmarks.bookmarks.isEmpty)
SliverFillRemaining(
child: NoDataScreen(
message: t.bookmarks.noBookmarksAdded,
),
),
if (bookmarks.bookmarks.isNotEmpty)
SlidableAutoCloseBehavior(
child: SliverList.builder(
itemCount: bookmarks.bookmarks.length + 1,
itemBuilder: (context, index) {
// index == bookmarks.value!.content!.results!.length -> itemCount + 1
if (index == bookmarks.bookmarks.length) {
if (bookmarks.loadingMore) {
return const SizedBox(
height: 80,
child: Center(
child: CircularProgressIndicator(),
),
);
}
// Bottom gap for FAB
return const SizedBox(height: 80);
}
// Bottom gap for FAB
return const SizedBox(height: 80);
}
return BookmarkItem(
bookmark: bookmarks.bookmarks[index],
onSelect: (b) => ref.read(bookmarksProvider.notifier).selectBookmark(b, width),
onReadUnread: ref.read(bookmarksProvider.notifier).markAsReadUnread,
onDelete: (bookmark) => showDialog(
context: context,
builder: (context) => DeleteBookmarkModal(
bookmark: bookmark,
onDelete: ref.read(bookmarksProvider.notifier).deleteBookmark,
return BookmarkItem(
bookmark: bookmarks.bookmarks[index],
onSelect: (b) => ref.read(bookmarksProvider.notifier).selectBookmark(b, width),
onReadUnread: ref.read(bookmarksProvider.notifier).markAsReadUnread,
onDelete: (bookmark) => showDialog(
context: context,
builder: (context) => DeleteBookmarkModal(
bookmark: bookmark,
onDelete: ref.read(bookmarksProvider.notifier).deleteBookmark,
),
),
),
onArchiveUnarchive: ref.read(bookmarksProvider.notifier).archiveUnarchive,
onShareInternally: ref.read(bookmarksProvider.notifier).shareUnshare,
onEdit: (b) => openBookmarkFormModal(context: context, width: width, bookmark: b),
selected: bookmarks.bookmarks[index] == bookmarks.selectedBookmark,
tabletMode: tabletMode,
);
},
onArchiveUnarchive: ref.read(bookmarksProvider.notifier).archiveUnarchive,
onShareInternally: ref.read(bookmarksProvider.notifier).shareUnshare,
onEdit: (b) => openBookmarkFormModal(context: context, width: width, bookmark: b),
selected: bookmarks.bookmarks[index] == bookmarks.selectedBookmark,
tabletMode: tabletMode,
);
},
),
),
),
],
],
),
),
),
),
),
),
),
floatingActionButton: FloatingActionButton(
onPressed: () => openBookmarkFormModal(context: context, width: width),
child: const Icon(Icons.add_rounded),
floatingActionButton: FloatingActionButton(
onPressed: () => openBookmarkFormModal(context: context, width: width),
child: const Icon(Icons.add_rounded),
),
),
);
}

18
lib/screens/bookmarks/ui/search_bookmarks.dart
View File

@@ -6,7 +6,6 @@ import 'package:linkdy/screens/bookmarks/provider/search_bookmarks.provider.dart
import 'package:linkdy/screens/bookmarks/ui/bookmark_form_modal.dart';
import 'package:linkdy/screens/bookmarks/ui/bookmark_item.dart';
import 'package:linkdy/screens/bookmarks/ui/delete_bookmark_modal.dart';
import 'package:linkdy/screens/webview/ui/webview.dart';
import 'package:linkdy/widgets/enter_search_term_screen.dart';
import 'package:linkdy/widgets/no_data_screen.dart';
import 'package:linkdy/widgets/error_screen.dart';
@@ -37,18 +36,13 @@ class SearchBookmarksModal extends ConsumerWidget {
return Row(
children: [
const Expanded(flex: 2, child: _List(tabletMode: true)),
if (ref.watch(searchBookmarksProvider).selectedBookmark != null)
Expanded(
flex: 3,
child: WebViewScreen(bookmark: ref.watch(searchBookmarksProvider).selectedBookmark!),
),
if (ref.watch(searchBookmarksProvider).selectedBookmark == null)
Expanded(
flex: 3,
child: Container(
color: Theme.of(context).colorScheme.primaryContainer.withOpacity(0.2),
),
Expanded(
flex: 3,
child: Material(
color: Theme.of(context).colorScheme.primaryContainer.withOpacity(0.2),
child: Router.withConfig(config: ref.watch(searchBookmarksProvider).webViewRouter),
),
),
],
);
} else {