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

first implementation finished

Browse Source
This commit is contained in:
Fabian Freund
2024-04-22 11:21:01 +02:00
parent 1a13ca0795
commit 0e1972242a
102 changed files with 7192 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/lib/features/search_browser/presentation/widgets/app_bar_title.dart
+96
View File
@@ -0,0 +1,96 @@
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:kagi_bang_bang/features/web_view/domain/entities/web_view_page.dart';
import 'package:kagi_bang_bang/features/web_view/domain/repositories/web_view.dart';
import 'package:kagi_bang_bang/features/web_view/presentation/widgets/favicon.dart';
import 'package:text_scroll/text_scroll.dart';
class AppBarTitle extends HookConsumerWidget {
final void Function()? onTap;
const AppBarTitle({this.onTap, super.key});
Icon _securityStatusIcon(BuildContext context, WebViewPage page) {
if (page.url.isScheme('http')) {
return Icon(
MdiIcons.lockOff,
color: Theme.of(context).colorScheme.error,
size: 14,
);
} else if (page.sslError != null) {
return Icon(
MdiIcons.lockAlert,
color: Theme.of(context).colorScheme.errorContainer,
size: 14,
);
} else {
return const Icon(
MdiIcons.lock,
size: 14,
);
}
}
@override
Widget build(BuildContext context, WidgetRef ref) {
final activeWebView = ref.watch(webViewTabControllerProvider);
if (activeWebView == null) {
return SizedBox.shrink();
}
final page = useValueListenable(activeWebView.page);
final theme = Theme.of(context);
return GestureDetector(
onTap: onTap,
child: Row(
children: [
FaviconImage(
webPageInfo: page,
),
const SizedBox(
width: 8,
),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
TextScroll(
key: ValueKey(page.title),
page.title ?? 'New Tab',
style: theme.textTheme.bodyLarge
?.copyWith(color: theme.colorScheme.onSurface),
// mode: TextScrollMode.bouncing,
velocity: const Velocity(pixelsPerSecond: Offset(75, 0)),
delayBefore: const Duration(milliseconds: 500),
pauseBetween: const Duration(milliseconds: 5000),
fadedBorder: true,
fadeBorderSide: FadeBorderSide.right,
fadedBorderWidth: 0.05,
intervalSpaces: 4,
numberOfReps: 2,
),
Row(
children: [
_securityStatusIcon(context, page),
const SizedBox(
width: 4,
),
Text(
page.url.authority,
style: theme.textTheme.bodyMedium
?.copyWith(color: theme.colorScheme.onSurface),
),
],
),
],
),
),
],
),
);
}
}
app/lib/features/search_browser/presentation/widgets/sheets/shared_content_sheet.dart
+91
View File
@@ -0,0 +1,91 @@
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';
import 'package:kagi_bang_bang/features/search_browser/domain/entities/modes.dart';
import 'package:kagi_bang_bang/features/search_browser/domain/entities/sheet.dart';
import 'package:kagi_bang_bang/features/search_browser/presentation/widgets/tabs/assistant_tab.dart';
import 'package:kagi_bang_bang/features/search_browser/presentation/widgets/tabs/search_tab.dart';
import 'package:kagi_bang_bang/features/search_browser/presentation/widgets/tabs/summarize_tab.dart';
import 'package:kagi_bang_bang/features/share_intent/domain/entities/shared_content.dart';
import 'package:kagi_bang_bang/presentation/hooks/sync_page_tab.dart';
typedef OnSubmitUri = void Function(Uri url);
class SharedContentSheet extends HookConsumerWidget {
final CreateTab parameter;
final OnSubmitUri onSubmit;
const SharedContentSheet({
required this.parameter,
required this.onSubmit,
super.key,
});
@override
Widget build(BuildContext context, WidgetRef ref) {
final sharedContent = useMemoized(
() => (parameter.content != null)
? SharedContent.parse(parameter.content!)
: null,
);
final tabController = useTabController(
initialLength: KagiTool.values.length,
initialIndex: parameter.preferredTool?.index ??
switch (sharedContent) {
SharedText(text: final text) => (text.length > 25)
? KagiTool.assistant.index
: KagiTool.search.index,
SharedUrl() => KagiTool.summarizer.index,
null => KagiTool.assistant.index,
},
);
final pageController = usePageController(initialPage: tabController.index);
useSyncPageWithTab(tabController, pageController);
return Column(
mainAxisSize: MainAxisSize.min,
children: [
TabBar(
controller: tabController,
tabs: const [
Tab(
icon: Icon(MdiIcons.searchWeb),
text: 'Search',
),
Tab(
icon: Icon(MdiIcons.brain),
text: 'Assistant',
),
Tab(
icon: Icon(MdiIcons.text),
text: 'Summarize',
),
],
),
Padding(
padding: const EdgeInsets.symmetric(vertical: 8.0, horizontal: 12.0),
child: ExpandablePageView(
controller: pageController,
children: [
SearchTab(
sharedContent: sharedContent,
onSubmit: onSubmit,
),
AssistantTab(
sharedContent: sharedContent,
onSubmit: onSubmit,
),
SummarizeTab(
sharedContent: sharedContent,
onSubmit: onSubmit,
),
],
),
),
],
);
}
}
app/lib/features/search_browser/presentation/widgets/sheets/view_tabs_sheet.dart
+76
View File
@@ -0,0 +1,76 @@
import 'package:flutter/material.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:kagi_bang_bang/features/web_view/domain/repositories/web_view.dart';
import 'package:kagi_bang_bang/features/web_view/presentation/controllers/switch_new_tab.dart';
import 'package:kagi_bang_bang/features/web_view/presentation/widgets/web_view_tab.dart';
class ViewTabsSheet extends HookConsumerWidget {
final VoidCallback onClose;
const ViewTabsSheet({required this.onClose, super.key});
@override
Widget build(BuildContext context, WidgetRef ref) {
return Column(
mainAxisSize: MainAxisSize.min,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
TextButton.icon(
onPressed: () async {
await ref
.read(switchNewTabControllerProvider.notifier)
.add(Uri.https('kagi.com'));
onClose();
},
icon: const Icon(Icons.add),
label: const Text('New Tab'),
),
TextButton.icon(
onPressed: () async {
await ref
.read(webViewRepositoryProvider.notifier)
.closeAllTabs();
},
icon: const Icon(Icons.delete),
label: const Text('Close All'),
),
],
),
Consumer(
builder: (context, ref, child) {
final tabs = ref.watch(
webViewRepositoryProvider.select((tabs) => tabs.values),
);
final activeTab = ref.watch(
webViewTabControllerProvider.select(
(webView) => webView?.page.value.key,
),
);
return GridView.count(
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
childAspectRatio: 0.75,
padding: const EdgeInsets.symmetric(horizontal: 4.0),
mainAxisSpacing: 8.0,
crossAxisSpacing: 8.0,
crossAxisCount: 2,
children: tabs
.map(
(webView) => WebViewTab(
webView: webView,
isActive: webView.key == activeTab,
onClose: onClose,
),
)
.toList(),
);
},
),
],
);
}
}
app/lib/features/search_browser/presentation/widgets/tabs/assistant_tab.dart
+168
View File
@@ -0,0 +1,168 @@
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';
import 'package:kagi_bang_bang/features/search_browser/domain/entities/modes.dart';
import 'package:kagi_bang_bang/features/search_browser/presentation/widgets/sheets/shared_content_sheet.dart';
import 'package:kagi_bang_bang/features/search_browser/utils/url_builder.dart'
as uri_builder;
import 'package:kagi_bang_bang/features/share_intent/domain/entities/shared_content.dart';
import 'package:kagi_bang_bang/presentation/hooks/sync_page_tab.dart';
class AssistantTab extends HookConsumerWidget {
final SharedContent? sharedContent;
final OnSubmitUri onSubmit;
const AssistantTab({
required this.sharedContent,
required this.onSubmit,
super.key,
});
@override
Widget build(BuildContext context, WidgetRef ref) {
useAutomaticKeepAlive();
final formKey = useMemoized(() => GlobalKey<FormState>());
final textController =
useTextEditingController(text: sharedContent?.toString());
final tabController =
useTabController(initialLength: AssistantMode.values.length);
final pageController = usePageController(initialPage: tabController.index);
useSyncPageWithTab(tabController, pageController);
final researchVariant = useState(ResearchVariant.expert);
final chatModel = useState(ChatModel.gpt4Turbo);
return Form(
key: formKey,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
TabBar.secondary(
controller: tabController,
tabs: const [
Tab(
text: 'Research',
icon: Icon(MdiIcons.cloudSearch),
),
Tab(
text: 'Code',
icon: Icon(MdiIcons.codeJson),
),
Tab(
text: 'Chat',
icon: Icon(MdiIcons.commentTextMultiple),
),
Tab(
text: 'Custom',
icon: Icon(MdiIcons.creation),
),
],
),
ExpandablePageView(
controller: pageController,
children: [
Column(
mainAxisSize: MainAxisSize.min,
children: [
const SizedBox(
height: 12,
),
SegmentedButton<ResearchVariant>(
segments: const [
ButtonSegment(
value: ResearchVariant.expert,
icon: Icon(MdiIcons.textSearch),
label: Text('Research'),
),
ButtonSegment(
value: ResearchVariant.fast,
icon: Icon(MdiIcons.invoiceTextFast),
label: Text('Fast'),
),
],
selected: {researchVariant.value},
onSelectionChanged: (value) {
researchVariant.value = value.first;
},
),
],
),
const SizedBox.shrink(),
Column(
mainAxisSize: MainAxisSize.min,
children: [
const SizedBox(
height: 12,
),
DropdownMenu<ChatModel>(
initialSelection: chatModel.value,
expandedInsets: EdgeInsets.zero,
label: const Text('Model'),
inputDecorationTheme: const InputDecorationTheme(),
dropdownMenuEntries: ChatModel.values
.map(
(model) => DropdownMenuEntry(
value: model,
label: model.label,
),
)
.toList(),
onSelected: (value) {
chatModel.value = value!;
},
),
],
),
const SizedBox.shrink(),
],
),
const SizedBox(
height: 12,
),
TextFormField(
controller: textController,
decoration: const InputDecoration(
// border: OutlineInputBorder(),
label: Text('Prompt'),
),
maxLines: null,
validator: (value) {
if (value?.isEmpty ?? true) {
return '';
}
return null;
},
),
const SizedBox(
height: 12,
),
SizedBox(
width: double.infinity,
child: FilledButton.icon(
onPressed: () {
if (formKey.currentState?.validate() ?? false) {
onSubmit(
uri_builder.assistantUri(
prompt: textController.text,
assistantMode: AssistantMode.values[tabController.index],
researchVariant: researchVariant.value,
chatModel: chatModel.value,
),
);
}
},
label: const Text('Submit'),
icon: const Icon(MdiIcons.invoiceTextSend),
),
),
],
),
);
}
}
app/lib/features/search_browser/presentation/widgets/tabs/search_tab.dart
+247
View File
@@ -0,0 +1,247 @@
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:kagi_bang_bang/features/kagi/domain/repositories/autosuggest.dart';
import 'package:kagi_bang_bang/features/search_browser/presentation/widgets/sheets/shared_content_sheet.dart';
import 'package:kagi_bang_bang/features/search_browser/utils/url_builder.dart'
as uri_builder;
import 'package:kagi_bang_bang/features/share_intent/domain/entities/shared_content.dart';
import 'package:kagi_bang_bang/presentation/widgets/autocomplete.dart';
import 'package:kagi_bang_bang/utils/ui_helper.dart' as ui_helper;
import 'package:speech_to_text_google_dialog/speech_to_text_google_dialog.dart';
// The default Material-style Autocomplete options.
class _AutocompleteOptions<T extends Object> extends StatelessWidget {
const _AutocompleteOptions({
super.key,
required this.displayStringForOption,
required this.onSelected,
required this.openDirection,
required this.options,
required this.maxOptionsHeight,
});
final AutocompleteOptionToString<T> displayStringForOption;
final AutocompleteOnSelected<T> onSelected;
final OptionsViewOpenDirection openDirection;
final Iterable<T> options;
final double maxOptionsHeight;
@override
Widget build(BuildContext context) {
final AlignmentDirectional optionsAlignment = switch (openDirection) {
OptionsViewOpenDirection.up => AlignmentDirectional.bottomStart,
OptionsViewOpenDirection.down => AlignmentDirectional.topStart,
};
return Align(
alignment: optionsAlignment,
child: Material(
elevation: 4.0,
child: ConstrainedBox(
constraints: BoxConstraints(maxHeight: maxOptionsHeight),
child: ListView.builder(
padding: EdgeInsets.zero,
shrinkWrap: true,
reverse: switch (openDirection) {
OptionsViewOpenDirection.up => true,
OptionsViewOpenDirection.down => false,
},
itemCount: options.length,
itemBuilder: (BuildContext context, int index) {
final T option = options.elementAt(index);
return InkWell(
onTap: () {
onSelected(option);
},
child: Builder(
builder: (BuildContext context) {
final bool highlight =
AutocompleteHighlightedOption.of(context) == index;
// if (highlight) {
// SchedulerBinding.instance.addPostFrameCallback(
// (Duration timeStamp) async {
// await Scrollable.ensureVisible(
// context,
// alignment: 0.5,
// );
// },
// debugLabel: 'AutocompleteOptions.ensureVisible',
// );
// }
return Container(
color: highlight ? Theme.of(context).focusColor : null,
padding: const EdgeInsets.all(16.0),
child: Text(displayStringForOption(option)),
);
},
),
);
},
),
),
),
);
}
}
class SearchTab extends HookConsumerWidget {
final SharedContent? sharedContent;
final OnSubmitUri onSubmit;
const SearchTab({
required this.sharedContent,
required this.onSubmit,
super.key,
});
@override
Widget build(BuildContext context, WidgetRef ref) {
useAutomaticKeepAlive();
final formKey = useMemoized(() => GlobalKey<FormState>());
final focusNode = useFocusNode();
final textController =
useTextEditingController(text: sharedContent?.toString());
final quickAnswer = useListenableSelector(
textController,
() => textController.text.endsWith('?'),
);
return Form(
key: formKey,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
const SizedBox(height: 4),
Consumer(
builder: (context, ref, child) {
final optionsStream = ref.watch(autosuggestRepositoryProvider);
return ExternalResultsAutocomplete<String>(
textEditingController: textController,
optionsStream: optionsStream,
focusNode: focusNode,
optionsViewOpenDirection: OptionsViewOpenDirection.up,
displayStringForOption:
// ignore: avoid_redundant_argument_values
RawAutocomplete.defaultStringForOption,
optionsViewBuilder: (context, onSelected, options) {
return _AutocompleteOptions(
//Must match RawAutocomplete parent
displayStringForOption:
RawAutocomplete.defaultStringForOption,
onSelected: onSelected,
options: options,
//Must match RawAutocomplete parent
openDirection: OptionsViewOpenDirection.up,
maxOptionsHeight: 200.0,
);
},
onTextChanged: (textEditingValue) {
ref
.read(autosuggestRepositoryProvider.notifier)
.addQuery(textEditingValue.text);
},
fieldViewBuilder: (
context,
textEditingController,
focusNode,
onFieldSubmitted,
) {
return TextFormField(
controller: textEditingController,
focusNode: focusNode,
decoration: InputDecoration(
// border: OutlineInputBorder(),
label: const Text('Query'),
suffixIcon: IconButton(
onPressed: () async {
final isServiceAvailable =
await SpeechToTextGoogleDialog.getInstance()
.showGoogleDialog(
onTextReceived: (data) {
textEditingController.text = data.toString();
},
// locale: "en-US",
);
if (!isServiceAvailable) {
if (context.mounted) {
ui_helper.showErrorMessage(
context,
'Service is not available',
);
}
}
},
icon: const Icon(Icons.mic),
),
),
autovalidateMode: AutovalidateMode.onUserInteraction,
validator: (value) {
if (value?.isEmpty ?? true) {
return '';
}
return null;
},
onTapOutside: (event) {
focusNode.unfocus();
},
onFieldSubmitted: (value) {
if (formKey.currentState?.validate() ?? false) {
onSubmit(
uri_builder.searchUri(
searchQuery: textController.text,
),
);
}
// onFieldSubmitted();
},
);
},
);
},
),
SwitchListTile(
value: quickAnswer,
onChanged: (_) {
if (textController.text.endsWith('?')) {
textController.text = textController.text
.substring(0, textController.text.length - 1);
} else {
textController.text = '${textController.text}?';
}
},
contentPadding: EdgeInsets.zero,
title: const Text('Quick Answer'),
secondary: const Icon(MdiIcons.lightningBolt),
),
const SizedBox(
height: 12,
),
SizedBox(
width: double.infinity,
child: FilledButton.icon(
onPressed: () {
if (formKey.currentState?.validate() ?? false) {
onSubmit(
uri_builder.searchUri(
searchQuery: textController.text,
),
);
}
},
label: const Text('Search'),
icon: const Icon(MdiIcons.invoiceTextSend),
),
),
],
),
);
}
}
app/lib/features/search_browser/presentation/widgets/tabs/summarize_tab.dart
+153
View File
@@ -0,0 +1,153 @@
import 'dart:async';
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:kagi_bang_bang/features/search_browser/domain/entities/modes.dart';
import 'package:kagi_bang_bang/features/search_browser/presentation/widgets/sheets/shared_content_sheet.dart';
import 'package:kagi_bang_bang/features/search_browser/utils/url_builder.dart'
as uri_builder;
import 'package:kagi_bang_bang/features/share_intent/domain/entities/shared_content.dart';
import 'package:kagi_bang_bang/presentation/widgets/website_title_tile.dart';
import 'package:kagi_bang_bang/utils/uri_parser.dart' as uri_parser;
class SummarizeTab extends HookConsumerWidget {
final SharedContent? sharedContent;
final OnSubmitUri onSubmit;
const SummarizeTab({
required this.sharedContent,
required this.onSubmit,
super.key,
});
@override
Widget build(BuildContext context, WidgetRef ref) {
useAutomaticKeepAlive();
final formKey = useMemoized(() => GlobalKey<FormState>());
final selectedMode = useState(SummarizerMode.keyMoments);
final textController =
useTextEditingController(text: sharedContent?.toString());
return Form(
key: formKey,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
SegmentedButton<SummarizerMode>(
segments: const [
ButtonSegment(
value: SummarizerMode.keyMoments,
icon: Icon(MdiIcons.scriptTextKey),
label: Text('Key Moments'),
),
ButtonSegment(
value: SummarizerMode.summary,
icon: Icon(MdiIcons.invoiceTextMinus),
label: Text('Summary'),
),
],
selected: {selectedMode.value},
onSelectionChanged: (value) {
selectedMode.value = value.first;
},
),
const SizedBox(
height: 12,
),
...switch (sharedContent) {
SharedUrl() => [
TextFormField(
controller: textController,
decoration: const InputDecoration(
// border: OutlineInputBorder(),
label: Text('Document'),
),
autovalidateMode: AutovalidateMode.onUserInteraction,
validator: (value) {
if (value?.isEmpty ?? true) {
return '';
}
return null;
},
),
HookBuilder(
builder: (context) {
final url =
useState(uri_parser.tryParseUrl(textController.text));
useEffect(
() {
Timer? timer;
void debounce() {
timer?.cancel();
timer = Timer(const Duration(milliseconds: 250), () {
url.value =
uri_parser.tryParseUrl(textController.text);
});
}
textController.addListener(debounce);
return () => textController.removeListener(debounce);
},
[textController],
);
return Column(
mainAxisSize: MainAxisSize.min,
children: [
if (url.value != null) WebsiteTitleTile(url.value!),
],
);
},
),
const SizedBox(
height: 12,
),
],
SharedText() || null => [
TextFormField(
controller: textController,
decoration: const InputDecoration(
// border: OutlineInputBorder(),
label: Text('Document'),
),
maxLines: null,
autovalidateMode: AutovalidateMode.onUserInteraction,
validator: (value) {
if (value?.isEmpty ?? true) {
return '';
}
return null;
},
),
const SizedBox(
height: 12,
),
],
},
SizedBox(
width: double.infinity,
child: FilledButton.icon(
onPressed: () {
if (formKey.currentState?.validate() ?? false) {
onSubmit(
uri_builder.summarizerUri(
document: SharedContent.parse(textController.text),
mode: selectedMode.value,
),
);
}
},
label: const Text('Summarize'),
icon: const Icon(MdiIcons.invoiceTextSend),
),
),
],
),
);
}
}
app/lib/features/search_browser/presentation/widgets/tabs_action_button.dart
+44
View File
@@ -0,0 +1,44 @@
import 'package:flutter/material.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:kagi_bang_bang/features/web_view/domain/repositories/web_view.dart';
class TabsActionButton extends HookConsumerWidget {
final VoidCallback onTap;
const TabsActionButton({required this.onTap, super.key});
@override
Widget build(BuildContext context, WidgetRef ref) {
final tabCount =
ref.watch(webViewRepositoryProvider.select((tabs) => tabs.length));
return InkWell(
onTap: onTap,
child: Padding(
padding: const EdgeInsets.only(
left: 10.0,
top: 15.0,
right: 10.0,
bottom: 15.0,
),
child: Container(
decoration: BoxDecoration(
border: Border.all(width: 2.0, color: Colors.white),
borderRadius: BorderRadius.circular(5.0),
),
constraints: const BoxConstraints(minWidth: 25.0),
child: Center(
child: Text(
tabCount.toString(),
style: const TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 14.0,
),
),
),
),
),
);
}
}