From c711bb94195ef84038d637b98d29e2b44ca541e4 Mon Sep 17 00:00:00 2001
From: ryleedavis <rylee@cypherstack.com>
Date: Thu, 3 Nov 2022 09:41:10 -0600
Subject: [PATCH] added search bar to desktop nodes settings
---
.../home/settings_menu/nodes_settings.dart | 211 +++++++++++-------
1 file changed, 130 insertions(+), 81 deletions(-)
diff --git a/lib/pages_desktop_specific/home/settings_menu/nodes_settings.dart b/lib/pages_desktop_specific/home/settings_menu/nodes_settings.dart
index bb60061d8..5f1e70143 100644
--- a/lib/pages_desktop_specific/home/settings_menu/nodes_settings.dart
+++ b/lib/pages_desktop_specific/home/settings_menu/nodes_settings.dart
@@ -11,6 +11,9 @@ import 'package:stackwallet/utilities/enums/coin_enum.dart';
import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/widgets/rounded_white_container.dart';
+import '../../../utilities/util.dart';
+import '../../../widgets/stack_text_field.dart';
+
class NodesSettings extends ConsumerStatefulWidget {
const NodesSettings({Key? key}) : super(key: key);
@@ -23,15 +26,27 @@ class NodesSettings extends ConsumerStatefulWidget {
class _NodesSettings extends ConsumerState<NodesSettings> {
List<Coin> _coins = [...Coin.values];
+ late final TextEditingController searchNodeController;
+ late final FocusNode searchNodeFocusNode;
+
+ String filter = "";
+
@override
void initState() {
_coins = _coins.toList();
_coins.remove(Coin.firoTestNet);
+
+ searchNodeController = TextEditingController();
+ searchNodeFocusNode = FocusNode();
+
super.initState();
}
@override
void dispose() {
+ searchNodeController.dispose();
+ searchNodeFocusNode.dispose();
+
super.dispose();
}
@@ -85,88 +100,122 @@ class _NodesSettings extends ConsumerState<NodesSettings> {
),
],
),
- //TODO: add search bar
- SingleChildScrollView(
- child: Column(
- crossAxisAlignment: CrossAxisAlignment.stretch,
- children: [
- ...coins.map(
- (coin) {
- final count = ref
- .watch(nodeServiceChangeNotifierProvider
- .select((value) => value.getNodesFor(coin)))
- .length;
-
- return Padding(
- padding: const EdgeInsets.all(0),
- child: RawMaterialButton(
- // splashColor: Theme.of(context).extension<StackColors>()!.highlight,
- shape: RoundedRectangleBorder(
- borderRadius: BorderRadius.circular(
- Constants.size.circularBorderRadius,
- ),
- // side: BorderSide(
- // color: Theme.of(context)
- // .extension<StackColors>()!
- // .shadow),
- ),
- materialTapTargetSize:
- MaterialTapTargetSize.shrinkWrap,
- onPressed: () {
- Navigator.of(context).pushNamed(
- CoinNodesView.routeName,
- arguments: coin,
- );
- },
- child: Padding(
- padding: const EdgeInsets.all(
- 12.0,
- ),
- child: Row(
- children: [
- Row(
- children: [
- SvgPicture.asset(
- Assets.svg.iconFor(coin: coin),
- width: 24,
- height: 24,
- ),
- const SizedBox(
- width: 12,
- ),
- Column(
- crossAxisAlignment:
- CrossAxisAlignment.start,
- children: [
- Text(
- "${coin.prettyName} nodes",
- style: STextStyles.titleBold12(
- context),
- ),
- Text(
- count > 1
- ? "$count nodes"
- : "Default",
- style: STextStyles.label(context),
- ),
- ],
- ),
- ],
- ),
- Expanded(
- child: SvgPicture.asset(
- Assets.svg.chevronRight,
- alignment: Alignment.centerRight,
- ),
- ),
- ],
- ),
- ),
- ),
- );
- },
+ Padding(
+ padding: const EdgeInsets.all(10.0),
+ child: ClipRRect(
+ borderRadius: BorderRadius.circular(
+ Constants.size.circularBorderRadius,
+ ),
+ child: TextField(
+ autocorrect: Util.isDesktop ? false : true,
+ enableSuggestions: Util.isDesktop ? false : true,
+ controller: searchNodeController,
+ focusNode: searchNodeFocusNode,
+ onChanged: (newString) {
+ setState(() => filter = newString);
+ },
+ style: STextStyles.field(context),
+ decoration: standardInputDecoration(
+ "Search",
+ searchNodeFocusNode,
+ context,
+ ).copyWith(
+ prefixIcon: Padding(
+ padding: const EdgeInsets.symmetric(
+ horizontal: 10,
+ vertical: 16,
+ ),
+ child: SvgPicture.asset(
+ Assets.svg.search,
+ width: 16,
+ height: 16,
+ ),
+ ),
),
- ],
+ ),
+ ),
+ ),
+ Padding(
+ padding: const EdgeInsets.all(10.0),
+ child: SingleChildScrollView(
+ child: Column(
+ crossAxisAlignment: CrossAxisAlignment.stretch,
+ children: [
+ ...coins.map(
+ (coin) {
+ final count = ref
+ .watch(nodeServiceChangeNotifierProvider
+ .select((value) => value.getNodesFor(coin)))
+ .length;
+
+ return Padding(
+ padding: const EdgeInsets.all(0),
+ child: RawMaterialButton(
+ // splashColor: Theme.of(context).extension<StackColors>()!.highlight,
+ shape: RoundedRectangleBorder(
+ borderRadius: BorderRadius.circular(
+ Constants.size.circularBorderRadius,
+ ),
+ ),
+ materialTapTargetSize:
+ MaterialTapTargetSize.shrinkWrap,
+ onPressed: () {
+ Navigator.of(context).pushNamed(
+ CoinNodesView.routeName,
+ arguments: coin,
+ );
+ },
+ child: Padding(
+ padding: const EdgeInsets.all(
+ 12.0,
+ ),
+ child: Row(
+ children: [
+ Row(
+ children: [
+ SvgPicture.asset(
+ Assets.svg.iconFor(coin: coin),
+ width: 24,
+ height: 24,
+ ),
+ const SizedBox(
+ width: 12,
+ ),
+ Column(
+ crossAxisAlignment:
+ CrossAxisAlignment.start,
+ children: [
+ Text(
+ "${coin.prettyName} nodes",
+ style: STextStyles.titleBold12(
+ context),
+ ),
+ Text(
+ count > 1
+ ? "$count nodes"
+ : "Default",
+ style:
+ STextStyles.label(context),
+ ),
+ ],
+ ),
+ ],
+ ),
+ Expanded(
+ child: SvgPicture.asset(
+ Assets.svg.chevronRight,
+ alignment: Alignment.centerRight,
+ ),
+ ),
+ ],
+ ),
+ ),
+ ),
+ );
+ },
+ ),
+ ],
+ ),
),
),
],