mirror of
https://github.com/cypherstack/stack_wallet.git
synced 2025-03-21 22:58:49 +00:00
desktop address book filter dialog
This commit is contained in:
ryleedavis
parent
7798ed39a0
commit
ca6578d367
2 changed files with 229 additions and 148 deletions
|
|
@ -5,7 +5,12 @@ import 'package:stackwallet/providers/ui/address_book_providers/address_book_fil
|
||||||
import 'package:stackwallet/utilities/enums/coin_enum.dart';
|
import 'package:stackwallet/utilities/enums/coin_enum.dart';
|
||||||
import 'package:stackwallet/utilities/text_styles.dart';
|
import 'package:stackwallet/utilities/text_styles.dart';
|
||||||
import 'package:stackwallet/utilities/theme/stack_colors.dart';
|
import 'package:stackwallet/utilities/theme/stack_colors.dart';
|
||||||
|
import 'package:stackwallet/utilities/util.dart';
|
||||||
|
import 'package:stackwallet/widgets/conditional_parent.dart';
|
||||||
import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart';
|
import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart';
|
||||||
|
import 'package:stackwallet/widgets/desktop/desktop_dialog_close_button.dart';
|
||||||
|
import 'package:stackwallet/widgets/desktop/primary_button.dart';
|
||||||
|
import 'package:stackwallet/widgets/desktop/secondary_button.dart';
|
||||||
import 'package:stackwallet/widgets/rounded_white_container.dart';
|
import 'package:stackwallet/widgets/rounded_white_container.dart';
|
||||||
|
|
||||||
class AddressBookFilterView extends ConsumerStatefulWidget {
|
class AddressBookFilterView extends ConsumerStatefulWidget {
|
||||||
|
|
@ -41,167 +46,224 @@ class _AddressBookFilterViewState extends ConsumerState<AddressBookFilterView> {
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return Scaffold(
|
final isDesktop = Util.isDesktop;
|
||||||
backgroundColor: Theme.of(context).extension<StackColors>()!.background,
|
return ConditionalParent(
|
||||||
appBar: AppBar(
|
condition: !isDesktop,
|
||||||
backgroundColor: Theme.of(context).extension<StackColors>()!.background,
|
builder: (child) {
|
||||||
leading: AppBarBackButton(
|
return Scaffold(
|
||||||
onPressed: () async {
|
backgroundColor:
|
||||||
Navigator.of(context).pop();
|
Theme.of(context).extension<StackColors>()!.background,
|
||||||
},
|
appBar: AppBar(
|
||||||
),
|
backgroundColor:
|
||||||
title: Text(
|
Theme.of(context).extension<StackColors>()!.background,
|
||||||
"Filter addresses",
|
leading: AppBarBackButton(
|
||||||
style: STextStyles.navBarTitle(context),
|
onPressed: () async {
|
||||||
),
|
Navigator.of(context).pop();
|
||||||
),
|
},
|
||||||
body: Padding(
|
),
|
||||||
padding: const EdgeInsets.all(12),
|
title: Text(
|
||||||
child: LayoutBuilder(builder: (builderContext, constraints) {
|
"Filter addresses",
|
||||||
return SingleChildScrollView(
|
style: STextStyles.navBarTitle(context),
|
||||||
child: ConstrainedBox(
|
),
|
||||||
constraints: BoxConstraints(
|
),
|
||||||
minHeight: constraints.maxHeight,
|
body: Padding(
|
||||||
|
padding: const EdgeInsets.all(12),
|
||||||
|
child: LayoutBuilder(builder: (builderContext, constraints) {
|
||||||
|
return SingleChildScrollView(
|
||||||
|
child: ConstrainedBox(
|
||||||
|
constraints: BoxConstraints(
|
||||||
|
minHeight: constraints.maxHeight,
|
||||||
|
),
|
||||||
|
child: IntrinsicHeight(
|
||||||
|
child: Padding(
|
||||||
|
padding: const EdgeInsets.all(4),
|
||||||
|
child: Column(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||||
|
children: [
|
||||||
|
RoundedWhiteContainer(
|
||||||
|
child: Text(
|
||||||
|
"Only selected cryptocurrency addresses will be displayed.",
|
||||||
|
style: STextStyles.itemSubtitle(context),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
const SizedBox(
|
||||||
|
height: 12,
|
||||||
|
),
|
||||||
|
Text(
|
||||||
|
"Select cryptocurrency",
|
||||||
|
style: STextStyles.smallMed12(context),
|
||||||
|
),
|
||||||
|
const SizedBox(
|
||||||
|
height: 12,
|
||||||
|
),
|
||||||
|
child,
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
},
|
||||||
|
child: ConditionalParent(
|
||||||
|
condition: isDesktop,
|
||||||
|
builder: (child) {
|
||||||
|
return Column(
|
||||||
|
children: [
|
||||||
|
Row(
|
||||||
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||||
|
children: [
|
||||||
|
Padding(
|
||||||
|
padding: const EdgeInsets.all(32),
|
||||||
|
child: Text(
|
||||||
|
"Select cryptocurrency",
|
||||||
|
style: STextStyles.desktopH3(context),
|
||||||
|
textAlign: TextAlign.center,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
const DesktopDialogCloseButton(),
|
||||||
|
],
|
||||||
),
|
),
|
||||||
child: IntrinsicHeight(
|
Expanded(
|
||||||
child: Padding(
|
child: LayoutBuilder(
|
||||||
padding: const EdgeInsets.all(4),
|
builder: (context, constraints) {
|
||||||
child: Column(
|
return SingleChildScrollView(
|
||||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
scrollDirection: Axis.vertical,
|
||||||
children: [
|
child: ConstrainedBox(
|
||||||
RoundedWhiteContainer(
|
constraints: BoxConstraints(
|
||||||
child: Text(
|
minHeight: constraints.maxHeight,
|
||||||
"Only selected cryptocurrency addresses will be displayed.",
|
),
|
||||||
style: STextStyles.itemSubtitle(context),
|
child: IntrinsicHeight(
|
||||||
|
child: Column(
|
||||||
|
children: [
|
||||||
|
Padding(
|
||||||
|
padding:
|
||||||
|
const EdgeInsets.symmetric(horizontal: 32),
|
||||||
|
child: child,
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
const SizedBox(
|
);
|
||||||
height: 12,
|
},
|
||||||
),
|
),
|
||||||
Text(
|
),
|
||||||
"Select cryptocurrency",
|
Padding(
|
||||||
style: STextStyles.smallMed12(context),
|
padding:
|
||||||
),
|
const EdgeInsets.symmetric(horizontal: 32, vertical: 32),
|
||||||
const SizedBox(
|
child: Row(
|
||||||
height: 12,
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||||
),
|
children: [
|
||||||
RoundedWhiteContainer(
|
SecondaryButton(
|
||||||
padding: const EdgeInsets.all(0),
|
width: 248,
|
||||||
child: Wrap(
|
desktopMed: true,
|
||||||
children: [
|
enabled: true,
|
||||||
..._coins.map(
|
label: "Cancel",
|
||||||
(coin) => Row(
|
onPressed: () {
|
||||||
children: [
|
Navigator.of(context).pop();
|
||||||
GestureDetector(
|
},
|
||||||
onTap: () {
|
),
|
||||||
if (ref
|
// const SizedBox(width: 16),
|
||||||
.read(addressBookFilterProvider)
|
PrimaryButton(
|
||||||
.coins
|
width: 248,
|
||||||
.contains(coin)) {
|
desktopMed: true,
|
||||||
ref
|
enabled: true,
|
||||||
.read(addressBookFilterProvider)
|
label: "Apply",
|
||||||
.remove(coin, true);
|
onPressed: () {
|
||||||
} else {
|
Navigator.of(context).pop();
|
||||||
|
},
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
);
|
||||||
|
},
|
||||||
|
child: RoundedWhiteContainer(
|
||||||
|
padding: const EdgeInsets.all(0),
|
||||||
|
child: Wrap(
|
||||||
|
children: [
|
||||||
|
..._coins.map(
|
||||||
|
(coin) => Row(
|
||||||
|
children: [
|
||||||
|
GestureDetector(
|
||||||
|
onTap: () {
|
||||||
|
if (ref
|
||||||
|
.read(addressBookFilterProvider)
|
||||||
|
.coins
|
||||||
|
.contains(coin)) {
|
||||||
|
ref
|
||||||
|
.read(addressBookFilterProvider)
|
||||||
|
.remove(coin, true);
|
||||||
|
} else {
|
||||||
|
ref.read(addressBookFilterProvider).add(coin, true);
|
||||||
|
}
|
||||||
|
setState(() {});
|
||||||
|
},
|
||||||
|
child: Container(
|
||||||
|
color: Colors.transparent,
|
||||||
|
child: Padding(
|
||||||
|
padding: const EdgeInsets.all(12),
|
||||||
|
child: Row(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
children: [
|
||||||
|
SizedBox(
|
||||||
|
height: 20,
|
||||||
|
width: 20,
|
||||||
|
child: Checkbox(
|
||||||
|
value: ref
|
||||||
|
.watch(addressBookFilterProvider
|
||||||
|
.select((value) => value.coins))
|
||||||
|
.contains(coin),
|
||||||
|
onChanged: (value) {
|
||||||
|
if (value is bool) {
|
||||||
|
if (value) {
|
||||||
ref
|
ref
|
||||||
.read(addressBookFilterProvider)
|
.read(addressBookFilterProvider)
|
||||||
.add(coin, true);
|
.add(coin, true);
|
||||||
|
} else {
|
||||||
|
ref
|
||||||
|
.read(addressBookFilterProvider)
|
||||||
|
.remove(coin, true);
|
||||||
}
|
}
|
||||||
setState(() {});
|
setState(() {});
|
||||||
},
|
}
|
||||||
child: Container(
|
},
|
||||||
color: Colors.transparent,
|
),
|
||||||
child: Padding(
|
),
|
||||||
padding: const EdgeInsets.all(12),
|
const SizedBox(
|
||||||
child: Row(
|
width: 12,
|
||||||
crossAxisAlignment:
|
),
|
||||||
CrossAxisAlignment.start,
|
Column(
|
||||||
children: [
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
SizedBox(
|
children: [
|
||||||
height: 20,
|
Text(
|
||||||
width: 20,
|
coin.prettyName,
|
||||||
child: Checkbox(
|
style: STextStyles.largeMedium14(context),
|
||||||
value: ref
|
),
|
||||||
.watch(
|
const SizedBox(
|
||||||
addressBookFilterProvider
|
height: 2,
|
||||||
.select((value) =>
|
),
|
||||||
value.coins))
|
Text(
|
||||||
.contains(coin),
|
coin.ticker,
|
||||||
onChanged: (value) {
|
style: STextStyles.itemSubtitle(context),
|
||||||
if (value is bool) {
|
|
||||||
if (value) {
|
|
||||||
ref
|
|
||||||
.read(
|
|
||||||
addressBookFilterProvider)
|
|
||||||
.add(coin, true);
|
|
||||||
} else {
|
|
||||||
ref
|
|
||||||
.read(
|
|
||||||
addressBookFilterProvider)
|
|
||||||
.remove(coin, true);
|
|
||||||
}
|
|
||||||
setState(() {});
|
|
||||||
}
|
|
||||||
},
|
|
||||||
),
|
|
||||||
),
|
|
||||||
const SizedBox(
|
|
||||||
width: 12,
|
|
||||||
),
|
|
||||||
Column(
|
|
||||||
crossAxisAlignment:
|
|
||||||
CrossAxisAlignment.start,
|
|
||||||
children: [
|
|
||||||
Text(
|
|
||||||
coin.prettyName,
|
|
||||||
style:
|
|
||||||
STextStyles.largeMedium14(
|
|
||||||
context),
|
|
||||||
),
|
|
||||||
const SizedBox(
|
|
||||||
height: 2,
|
|
||||||
),
|
|
||||||
Text(
|
|
||||||
coin.ticker,
|
|
||||||
style:
|
|
||||||
STextStyles.itemSubtitle(
|
|
||||||
context),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
)
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
),
|
)
|
||||||
),
|
],
|
||||||
],
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
const Spacer(),
|
),
|
||||||
// Row(
|
],
|
||||||
// children: [
|
|
||||||
// TextButton(
|
|
||||||
// onPressed: () {},
|
|
||||||
// child: Text("Cancel"),
|
|
||||||
// ),
|
|
||||||
// SizedBox(
|
|
||||||
// width: 16,
|
|
||||||
// ),
|
|
||||||
// TextButton(
|
|
||||||
// onPressed: () {},
|
|
||||||
// child: Text("Cancel"),
|
|
||||||
// ),
|
|
||||||
// ],
|
|
||||||
// )
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
],
|
||||||
);
|
),
|
||||||
}),
|
),
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -2,12 +2,14 @@ import 'package:flutter/material.dart';
|
||||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||||
import 'package:flutter_svg/svg.dart';
|
import 'package:flutter_svg/svg.dart';
|
||||||
import 'package:stackwallet/models/contact.dart';
|
import 'package:stackwallet/models/contact.dart';
|
||||||
|
import 'package:stackwallet/pages/address_book_views/subviews/address_book_filter_view.dart';
|
||||||
import 'package:stackwallet/providers/global/wallets_provider.dart';
|
import 'package:stackwallet/providers/global/wallets_provider.dart';
|
||||||
import 'package:stackwallet/utilities/assets.dart';
|
import 'package:stackwallet/utilities/assets.dart';
|
||||||
import 'package:stackwallet/utilities/constants.dart';
|
import 'package:stackwallet/utilities/constants.dart';
|
||||||
import 'package:stackwallet/utilities/text_styles.dart';
|
import 'package:stackwallet/utilities/text_styles.dart';
|
||||||
import 'package:stackwallet/utilities/theme/stack_colors.dart';
|
import 'package:stackwallet/utilities/theme/stack_colors.dart';
|
||||||
import 'package:stackwallet/widgets/desktop/desktop_app_bar.dart';
|
import 'package:stackwallet/widgets/desktop/desktop_app_bar.dart';
|
||||||
|
import 'package:stackwallet/widgets/desktop/desktop_dialog.dart';
|
||||||
import 'package:stackwallet/widgets/icon_widgets/x_icon.dart';
|
import 'package:stackwallet/widgets/icon_widgets/x_icon.dart';
|
||||||
import 'package:stackwallet/widgets/rounded_white_container.dart';
|
import 'package:stackwallet/widgets/rounded_white_container.dart';
|
||||||
import 'package:stackwallet/widgets/stack_text_field.dart';
|
import 'package:stackwallet/widgets/stack_text_field.dart';
|
||||||
|
|
@ -34,6 +36,21 @@ class _DesktopAddressBook extends ConsumerState<DesktopAddressBook> {
|
||||||
|
|
||||||
String filter = "";
|
String filter = "";
|
||||||
|
|
||||||
|
Future<void> selectCryptocurrency() async {
|
||||||
|
await showDialog<dynamic>(
|
||||||
|
context: context,
|
||||||
|
useSafeArea: false,
|
||||||
|
barrierDismissible: true,
|
||||||
|
builder: (context) {
|
||||||
|
return DesktopDialog(
|
||||||
|
maxHeight: 609,
|
||||||
|
maxWidth: 576,
|
||||||
|
child: AddressBookFilterView(),
|
||||||
|
);
|
||||||
|
},
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
@override
|
@override
|
||||||
void initState() {
|
void initState() {
|
||||||
_searchController = TextEditingController();
|
_searchController = TextEditingController();
|
||||||
|
|
@ -141,7 +158,9 @@ class _DesktopAddressBook extends ConsumerState<DesktopAddressBook> {
|
||||||
style: Theme.of(context)
|
style: Theme.of(context)
|
||||||
.extension<StackColors>()!
|
.extension<StackColors>()!
|
||||||
.getDesktopMenuButtonColorSelected(context),
|
.getDesktopMenuButtonColorSelected(context),
|
||||||
onPressed: () {},
|
onPressed: () {
|
||||||
|
selectCryptocurrency();
|
||||||
|
},
|
||||||
child: SizedBox(
|
child: SizedBox(
|
||||||
width: 200,
|
width: 200,
|
||||||
height: 56,
|
height: 56,
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue