MrBlake/MrbWebLibre
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 2 Wiki Activity

imporved app bar; added quick actions;

Browse Source
This commit is contained in:
Fabian Freund
2024-07-09 09:26:21 +02:00
parent 28197ef59f
commit a38f50488c
17 changed files with 446 additions and 169 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/lib/features/search_browser/presentation/screens/browser.dart
+168 -34
View File
@@ -1,3 +1,5 @@
import 'dart:async';
import 'package:animations/animations.dart';
import 'package:bang_navigator/core/routing/routes.dart';
import 'package:bang_navigator/features/search_browser/domain/entities/modes.dart';
@@ -26,6 +28,7 @@ import 'package:flutter_material_design_icons/flutter_material_design_icons.dart
import 'package:go_router/go_router.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:share_plus/share_plus.dart';
import 'package:speech_to_text_google_dialog/speech_to_text_google_dialog.dart';
class KagiScreen extends HookConsumerWidget {
const KagiScreen({super.key});
@@ -47,6 +50,21 @@ class KagiScreen extends HookConsumerWidget {
),
);
final quickAction = ref.watch(
settingsRepositoryProvider.select(
(value) => (value.valueOrNull ?? Settings.withDefaults()).quickAction,
),
);
final quickActionVoice = ref.watch(
settingsRepositoryProvider.select(
(value) => (value.valueOrNull ?? Settings.withDefaults())
.quickActionVoiceInput,
),
);
final activeWebView = ref.watch(webViewTabControllerProvider);
final menuController = useMemoized(() => MenuController());
final lastBackButtonPress = useRef<DateTime?>(null);
@@ -54,6 +72,8 @@ class KagiScreen extends HookConsumerWidget {
final overlayController = useOverlayPortalController();
final activeKagiTool = useValueNotifier<KagiTool?>(null, [displayedSheet]);
ref.listen(
overlayDialogProvider,
(previous, next) {
@@ -81,23 +101,130 @@ class KagiScreen extends HookConsumerWidget {
padding: EdgeInsets.zero,
child: AppBar(
automaticallyImplyLeading: false,
title: AppBarTitle(
onTap: () {
final page = ref.read(webViewTabControllerProvider)?.page.value;
titleSpacing: 8.0,
title: (activeWebView != null)
? AppBarTitle(
activeWebView: activeWebView,
onTap: () {
final page = activeWebView.page.value;
if (page != null) {
ref.read(overlayDialogProvider.notifier).show(
WebPageDialog(
page: page,
webViewController: webViewController.value,
onDismiss:
ref.read(overlayDialogProvider.notifier).dismiss,
),
ref.read(overlayDialogProvider.notifier).show(
WebPageDialog(
page: page,
webViewController: webViewController.value,
onDismiss: ref
.read(overlayDialogProvider.notifier)
.dismiss,
),
);
},
)
: HookBuilder(
builder: (context) {
final activeTool = useListenableSelector(
activeKagiTool,
() {
if (displayedSheet is SharedContentSheet) {
return null;
}
return activeKagiTool.value;
},
);
}
},
),
return Row(
children: [
IconButton(
color: (activeTool == KagiTool.search)
? Theme.of(context).colorScheme.primary
: null,
onPressed: () {
ref
.read(createTabStreamProvider.notifier)
.createTab(
CreateTab(preferredTool: KagiTool.search),
);
},
icon: Icon(KagiTool.search.icon),
),
IconButton(
color: (activeTool == KagiTool.summarizer)
? Theme.of(context).colorScheme.primary
: null,
onPressed: () {
ref
.read(createTabStreamProvider.notifier)
.createTab(
CreateTab(preferredTool: KagiTool.summarizer),
);
},
icon: Icon(KagiTool.summarizer.icon),
),
if (showEarlyAccessFeatures)
IconButton(
color: (activeTool == KagiTool.assistant)
? Theme.of(context).colorScheme.primary
: null,
onPressed: () {
ref
.read(createTabStreamProvider.notifier)
.createTab(
CreateTab(
preferredTool: KagiTool.assistant,
),
);
},
icon: Icon(KagiTool.assistant.icon),
),
],
);
},
),
actions: [
if (activeWebView != null && quickAction != null)
InkWell(
onTap: () async {
var tab = CreateTab(
preferredTool: quickAction,
);
if (quickActionVoice) {
final completer = Completer<String>();
final isServiceAvailable =
await SpeechToTextGoogleDialog.getInstance()
.showGoogleDialog(
onTextReceived: (data) {
completer.complete(data.toString());
},
// locale: "en-US",
);
if (!isServiceAvailable) {
if (context.mounted) {
ui_helper.showErrorMessage(
context,
'Service is not available',
);
}
}
tab = CreateTab(
preferredTool: quickAction,
content: await completer.future,
);
}
ref.read(createTabStreamProvider.notifier).createTab(tab);
},
child: Padding(
padding: const EdgeInsets.symmetric(
vertical: 15.0,
horizontal: 8.0,
),
child: Icon(quickActionVoice ? Icons.mic : quickAction.icon),
),
),
TabsActionButton(
onTap: () {
if (displayedSheet case ViewTabs()) {
@@ -110,15 +237,22 @@ class KagiScreen extends HookConsumerWidget {
MenuAnchor(
controller: menuController,
builder: (context, controller, child) {
return IconButton(
onPressed: () {
if (controller.isOpen) {
controller.close();
} else {
controller.open();
}
},
icon: const Icon(Icons.more_vert),
return Padding(
padding: const EdgeInsets.only(right: 4.0),
child: InkWell(
onTap: () {
if (controller.isOpen) {
controller.close();
} else {
controller.open();
}
},
child: const Padding(
padding:
EdgeInsets.symmetric(vertical: 15.0, horizontal: 8.0),
child: Icon(Icons.more_vert),
),
),
);
},
menuChildren: [
@@ -161,7 +295,7 @@ class KagiScreen extends HookConsumerWidget {
CreateTab(preferredTool: KagiTool.assistant),
);
},
leadingIcon: const Icon(MdiIcons.brain),
leadingIcon: Icon(KagiTool.assistant.icon),
child: const Text('Assistant'),
),
MenuItemButton(
@@ -170,7 +304,7 @@ class KagiScreen extends HookConsumerWidget {
CreateTab(preferredTool: KagiTool.summarizer),
);
},
leadingIcon: const Icon(MdiIcons.text),
leadingIcon: Icon(KagiTool.summarizer.icon),
child: const Text('Summarizer'),
),
MenuItemButton(
@@ -179,7 +313,7 @@ class KagiScreen extends HookConsumerWidget {
CreateTab(preferredTool: KagiTool.search),
);
},
leadingIcon: const Icon(MdiIcons.searchWeb),
leadingIcon: Icon(KagiTool.search.icon),
child: const Text('Search'),
),
const Divider(),
@@ -213,10 +347,8 @@ class KagiScreen extends HookConsumerWidget {
child: const Text('Reload'),
),
const Divider(),
HookConsumer(
builder: (context, ref, child) {
final activeWebView =
ref.watch(webViewTabControllerProvider);
HookBuilder(
builder: (context) {
final history = useListenableSelector(
activeWebView?.page,
() =>
@@ -272,7 +404,6 @@ class KagiScreen extends HookConsumerWidget {
child: HookConsumer(
builder: (context, ref, child) {
final webViews = ref.watch(webViewRepositoryProvider);
final activeWebView = ref.watch(webViewTabControllerProvider);
useListenableCallback(activeWebView?.page, () {
webViewController.value = activeWebView?.page.value.controller;
});
@@ -391,7 +522,7 @@ class KagiScreen extends HookConsumerWidget {
},
child: switch (displayedSheet) {
ViewTabs() => DraggableScrollableSheet(
key: ObjectKey(displayedSheet),
key: ValueKey(displayedSheet),
expand: false,
minChildSize: 0.1,
maxChildSize: _realtiveSafeArea(context),
@@ -411,7 +542,7 @@ class KagiScreen extends HookConsumerWidget {
},
),
final CreateTab parameter => DraggableScrollableSheet(
key: ObjectKey(displayedSheet),
key: ValueKey(displayedSheet),
expand: false,
initialChildSize: 0.8,
minChildSize: 0.1,
@@ -420,7 +551,7 @@ class KagiScreen extends HookConsumerWidget {
return SingleChildScrollView(
controller: scrollController,
child: SharedContentSheet(
key: ObjectKey(parameter),
key: ValueKey(parameter),
parameter: parameter,
onSubmit: (url) async {
await ref
@@ -429,6 +560,9 @@ class KagiScreen extends HookConsumerWidget {
ref.read(bottomSheetProvider.notifier).dismiss();
},
onActiveToolChanged: (tool) {
activeKagiTool.value = tool;
},
),
);
},
app/lib/features/search_browser/presentation/widgets/app_bar_title.dart
+6 -10
View File
@@ -1,16 +1,17 @@
import 'package:bang_navigator/features/web_view/domain/entities/web_view_page.dart';
import 'package:bang_navigator/features/web_view/domain/repositories/web_view.dart';
import 'package:bang_navigator/features/web_view/presentation/widgets/favicon.dart';
import 'package:bang_navigator/features/web_view/presentation/widgets/web_view.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:flutter_material_design_icons/flutter_material_design_icons.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:text_scroll/text_scroll.dart';
class AppBarTitle extends HookConsumerWidget {
class AppBarTitle extends HookWidget {
final WebView activeWebView;
final void Function()? onTap;
const AppBarTitle({this.onTap, super.key});
const AppBarTitle({required this.activeWebView, this.onTap, super.key});
Icon _securityStatusIcon(BuildContext context, WebViewPage page) {
if (page.url.isScheme('http')) {
@@ -34,12 +35,7 @@ class AppBarTitle extends HookConsumerWidget {
}
@override
Widget build(BuildContext context, WidgetRef ref) {
final activeWebView = ref.watch(webViewTabControllerProvider);
if (activeWebView == null) {
return const SizedBox.shrink();
}
Widget build(BuildContext context) {
final page = useValueListenable(activeWebView.page);
final theme = Theme.of(context);
app/lib/features/search_browser/presentation/widgets/landing/action.dart
+2 -48
View File
@@ -1,13 +1,8 @@
import 'package:bang_navigator/core/routing/routes.dart';
import 'package:bang_navigator/features/search_browser/domain/entities/modes.dart';
import 'package:bang_navigator/features/search_browser/domain/entities/sheet.dart';
import 'package:bang_navigator/features/search_browser/domain/services/create_tab.dart';
import 'package:bang_navigator/features/search_browser/presentation/widgets/error_container.dart';
import 'package:bang_navigator/features/settings/data/models/settings.dart';
import 'package:bang_navigator/features/settings/data/repositories/settings_repository.dart';
import 'package:flutter/material.dart';
import 'package:flutter_markdown/flutter_markdown.dart';
import 'package:flutter_material_design_icons/flutter_material_design_icons.dart';
import 'package:go_router/go_router.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
@@ -21,16 +16,9 @@ class LandingAction extends HookConsumerWidget {
),
);
final showEarlyAccessFeatures = ref.watch(
settingsRepositoryProvider.select(
(value) => (value.valueOrNull ?? Settings.withDefaults())
.showEarlyAccessFeatures,
),
);
return Visibility(
visible: sessionTokenAvailable,
replacement: ErrorContainer(
visible: !sessionTokenAvailable,
child: ErrorContainer(
content: Markdown(
shrinkWrap: true,
onTapLink: (text, href, title) async {
@@ -43,40 +31,6 @@ class LandingAction extends HookConsumerWidget {
"You must provide a valid session in order to use Kagi's features.",
),
),
child: Wrap(
spacing: 8.0,
alignment: WrapAlignment.spaceEvenly,
children: [
OutlinedButton.icon(
onPressed: () {
ref.read(createTabStreamProvider.notifier).createTab(
CreateTab(preferredTool: KagiTool.search),
);
},
icon: const Icon(MdiIcons.searchWeb),
label: const Text('Search'),
),
OutlinedButton.icon(
onPressed: () {
ref.read(createTabStreamProvider.notifier).createTab(
CreateTab(preferredTool: KagiTool.summarizer),
);
},
icon: const Icon(MdiIcons.text),
label: const Text('Summarizer'),
),
if (showEarlyAccessFeatures)
OutlinedButton.icon(
onPressed: () {
ref.read(createTabStreamProvider.notifier).createTab(
CreateTab(preferredTool: KagiTool.assistant),
);
},
icon: const Icon(MdiIcons.brain),
label: const Text('Assistant'),
),
],
),
);
}
}
app/lib/features/search_browser/presentation/widgets/sheets/shared_content_sheet.dart
+35 -11
View File
@@ -10,7 +10,6 @@ import 'package:bang_navigator/presentation/hooks/sync_page_tab.dart';
import 'package:expandable_page_view/expandable_page_view.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:flutter_material_design_icons/flutter_material_design_icons.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
typedef OnSubmitUri = void Function(Uri url);
@@ -18,10 +17,12 @@ typedef OnSubmitUri = void Function(Uri url);
class SharedContentSheet extends HookConsumerWidget {
final CreateTab parameter;
final OnSubmitUri onSubmit;
final void Function(KagiTool tool)? onActiveToolChanged;
const SharedContentSheet({
required this.parameter,
required this.onSubmit,
this.onActiveToolChanged,
super.key,
});
@override
@@ -37,11 +38,12 @@ class SharedContentSheet extends HookConsumerWidget {
() => (parameter.content != null)
? SharedContent.parse(parameter.content!)
: null,
[parameter],
);
final tabController = useTabController(
initialLength: KagiTool.values.length - (showEarlyAccessFeatures ? 0 : 1),
initialIndex: parameter.preferredTool?.index ??
final initialIndex = useMemoized(
() =>
parameter.preferredTool?.index ??
switch (sharedContent) {
SharedText(text: final text) =>
(showEarlyAccessFeatures && text.length > 25)
@@ -52,10 +54,32 @@ class SharedContentSheet extends HookConsumerWidget {
? KagiTool.assistant.index
: KagiTool.search.index,
},
[sharedContent],
);
final tabController = useTabController(
initialLength: KagiTool.values.length - (showEarlyAccessFeatures ? 0 : 1),
initialIndex: initialIndex,
);
final pageController = usePageController(initialPage: tabController.index);
useSyncPageWithTab(tabController, pageController);
useSyncPageWithTab(
tabController,
pageController,
onIndexChanged: (index) {
onActiveToolChanged?.call(KagiTool.values[index]);
},
);
useEffect(
() {
WidgetsBinding.instance.addPostFrameCallback((_) {
onActiveToolChanged?.call(KagiTool.values[initialIndex]);
});
return null;
},
[initialIndex],
);
return Column(
mainAxisSize: MainAxisSize.min,
@@ -63,17 +87,17 @@ class SharedContentSheet extends HookConsumerWidget {
TabBar(
controller: tabController,
tabs: [
const Tab(
icon: Icon(MdiIcons.searchWeb),
Tab(
icon: Icon(KagiTool.search.icon),
text: 'Search',
),
const Tab(
icon: Icon(MdiIcons.text),
Tab(
icon: Icon(KagiTool.summarizer.icon),
text: 'Summarize',
),
if (showEarlyAccessFeatures)
const Tab(
icon: Icon(MdiIcons.brain),
Tab(
icon: Icon(KagiTool.assistant.icon),
text: 'Assistant',
),
],
app/lib/features/search_browser/presentation/widgets/tabs_action_button.dart
+3 -5
View File
@@ -15,11 +15,9 @@ class TabsActionButton extends HookConsumerWidget {
return InkWell(
onTap: onTap,
child: Padding(
padding: const EdgeInsets.only(
left: 10.0,
top: 15.0,
right: 10.0,
bottom: 15.0,
padding: const EdgeInsets.symmetric(
horizontal: 8.0,
vertical: 15.0,
),
child: Container(
decoration: BoxDecoration(