feat: allow searching through entries

This commit is contained in:
Matyáš Caras 2024-01-22 19:20:41 +01:00
parent 66ebff38a5
commit 91be906894
Signed by untrusted user who does not match committer: hernik
GPG key ID: 2A3175F98820C5C6
7 changed files with 507 additions and 392 deletions

View file

@ -1,3 +1,7 @@
# 1.0.0-alpha+5
- Add tests
- Add searching through entries to homepage
# 1.0.0-alpha+4 # 1.0.0-alpha+4
- Fix OCR downloads - Fix OCR downloads
# 1.0.0-alpha+3 # 1.0.0-alpha+3

View file

@ -4,7 +4,8 @@
<application <application
android:label="Prašule" android:label="Prašule"
android:name="${applicationName}" android:name="${applicationName}"
android:icon="@mipmap/ic_launcher"> android:icon="@mipmap/ic_launcher"
android:enableOnBackInvokedCallback="true">
<activity <activity
android:name=".MainActivity" android:name=".MainActivity"
android:exported="true" android:exported="true"

View file

@ -90,5 +90,6 @@
"startingWithDate": "počínaje datem", "startingWithDate": "počínaje datem",
"evenMoney":"Váš stav je stejný jako minulý měsíc.", "evenMoney":"Váš stav je stejný jako minulý měsíc.",
"balanceStatusA": "Váš stav je ", "balanceStatusA": "Váš stav je ",
"balanceStatusB": " oproti minulému měsíci." "balanceStatusB": " oproti minulému měsíci.",
"searchLabel":"Prohledat záznamy..."
} }

View file

@ -206,5 +206,6 @@
}, },
"evenMoney":"You're on the same balance as last month.", "evenMoney":"You're on the same balance as last month.",
"balanceStatusA": "Your balance is ", "balanceStatusA": "Your balance is ",
"balanceStatusB": " compared to last month." "balanceStatusB": " compared to last month.",
"searchLabel":"Search entries..."
} }

View file

@ -21,6 +21,8 @@ class PlatformField extends PlatformWidget<TextField, CupertinoTextField> {
this.textStyle, this.textStyle,
this.textAlign = TextAlign.start, this.textAlign = TextAlign.start,
this.maxLines = 1, this.maxLines = 1,
this.focusNode,
this.inputBorder = const OutlineInputBorder(),
}); });
final TextEditingController? controller; final TextEditingController? controller;
final bool? enabled; final bool? enabled;
@ -34,6 +36,8 @@ class PlatformField extends PlatformWidget<TextField, CupertinoTextField> {
final TextStyle? textStyle; final TextStyle? textStyle;
final TextAlign textAlign; final TextAlign textAlign;
final int? maxLines; final int? maxLines;
final InputBorder inputBorder;
final FocusNode? focusNode;
@override @override
TextField createAndroidWidget(BuildContext context) => TextField( TextField createAndroidWidget(BuildContext context) => TextField(
@ -43,10 +47,11 @@ class PlatformField extends PlatformWidget<TextField, CupertinoTextField> {
obscureText: obscureText, obscureText: obscureText,
decoration: InputDecoration( decoration: InputDecoration(
labelText: labelText, labelText: labelText,
border: OutlineInputBorder(borderRadius: BorderRadius.circular(4)), border: inputBorder,
), ),
autocorrect: autocorrect, autocorrect: autocorrect,
keyboardType: keyboardType, keyboardType: keyboardType,
focusNode: focusNode,
style: textStyle, style: textStyle,
inputFormatters: inputFormatters, inputFormatters: inputFormatters,
onChanged: onChanged, onChanged: onChanged,
@ -66,6 +71,7 @@ class PlatformField extends PlatformWidget<TextField, CupertinoTextField> {
keyboardType: keyboardType, keyboardType: keyboardType,
inputFormatters: inputFormatters, inputFormatters: inputFormatters,
onChanged: onChanged, onChanged: onChanged,
focusNode: focusNode,
maxLines: maxLines, maxLines: maxLines,
style: textStyle, style: textStyle,
); );

View file

@ -22,6 +22,7 @@ import 'package:prasule/main.dart';
import 'package:prasule/network/tessdata.dart'; import 'package:prasule/network/tessdata.dart';
import 'package:prasule/pw/platformbutton.dart'; import 'package:prasule/pw/platformbutton.dart';
import 'package:prasule/pw/platformdialog.dart'; import 'package:prasule/pw/platformdialog.dart';
import 'package:prasule/pw/platformfield.dart';
import 'package:prasule/pw/platformroute.dart'; import 'package:prasule/pw/platformroute.dart';
import 'package:prasule/util/drawer.dart'; import 'package:prasule/util/drawer.dart';
import 'package:prasule/util/text_color.dart'; import 'package:prasule/util/text_color.dart';
@ -44,6 +45,9 @@ class _HomeViewState extends State<HomeView> {
List<Wallet> wallets = []; List<Wallet> wallets = [];
DateTime? prevDate; DateTime? prevDate;
late String locale; late String locale;
var _searchActive = false;
var _filter = "";
final searchFocus = FocusNode();
@override @override
void didChangeDependencies() { void didChangeDependencies() {
super.didChangeDependencies(); super.didChangeDependencies();
@ -73,417 +77,515 @@ class _HomeViewState extends State<HomeView> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Scaffold( return PopScope(
drawer: makeDrawer(context, 1), canPop: !_searchActive, // don't pop when we just want
floatingActionButton: SpeedDial( // to deactivate searchfield
icon: Icons.add, onPopInvoked: (b) {
activeIcon: Icons.close, if (b) return;
children: [ _searchActive = false;
if (kDebugMode) _filter = "";
setState(() {});
},
child: Scaffold(
drawer: makeDrawer(context, 1),
floatingActionButton: SpeedDial(
icon: Icons.add,
activeIcon: Icons.close,
children: [
if (kDebugMode)
SpeedDialChild(
child: const Icon(Icons.bug_report),
label: AppLocalizations.of(context).createTestData,
onTap: () {
// debug option to quickly fill a wallet with data
if (selectedWallet == null) return;
selectedWallet!.createTestEntries().then((_) {
Navigator.of(context).pushReplacement(
platformRoute(
(p0) => const HomeView(),
),
);
});
},
),
SpeedDialChild( SpeedDialChild(
child: const Icon(Icons.bug_report), child: const Icon(Icons.edit),
label: AppLocalizations.of(context).createTestData, label: AppLocalizations.of(context).addNew,
onTap: () { onTap: () async {
// debug option to quickly fill a wallet with data final sw = await Navigator.of(context).push<Wallet>(
if (selectedWallet == null) return; MaterialPageRoute(
selectedWallet!.createTestEntries().then((_) { builder: (c) => CreateSingleEntryView(w: selectedWallet!),
Navigator.of(context).pushReplacement( ),
platformRoute( );
(p0) => const HomeView(), if (sw != null) {
), selectedWallet = sw;
); }
}); setState(() {});
}, },
), ),
SpeedDialChild( SpeedDialChild(
child: const Icon(Icons.edit), child: const Icon(Icons.camera_alt),
label: AppLocalizations.of(context).addNew, label: AppLocalizations.of(context).addCamera,
onTap: () async { onTap: () async {
final sw = await Navigator.of(context).push<Wallet>( final picker = ImagePicker();
MaterialPageRoute( final media =
builder: (c) => CreateSingleEntryView(w: selectedWallet!), await picker.pickImage(source: ImageSource.camera);
), logger.i(media?.name);
); },
if (sw != null) {
selectedWallet = sw;
}
setState(() {});
},
),
SpeedDialChild(
child: const Icon(Icons.camera_alt),
label: AppLocalizations.of(context).addCamera,
onTap: () async {
final picker = ImagePicker();
final media = await picker.pickImage(source: ImageSource.camera);
logger.i(media?.name);
},
),
SpeedDialChild(
child: const Icon(Icons.image),
label: AppLocalizations.of(context).addGallery,
onTap: () {
startOcr(ImageSource.gallery);
},
),
],
),
appBar: AppBar(
title: DropdownButton<int>(
value:
(selectedWallet == null) ? -1 : wallets.indexOf(selectedWallet!),
items: [
...wallets.map(
(e) => DropdownMenuItem(
value: wallets.indexOf(
e,
),
child: Text(e.name),
),
), ),
DropdownMenuItem( SpeedDialChild(
value: -1, child: const Icon(Icons.image),
child: Text(AppLocalizations.of(context).newWallet), label: AppLocalizations.of(context).addGallery,
onTap: () {
startOcr(ImageSource.gallery);
},
), ),
], ],
onChanged: (v) async { ),
if (v == null || v == -1) { appBar: AppBar(
await Navigator.of(context).push( title: AnimatedCrossFade(
platformRoute( duration: const Duration(milliseconds: 500),
(c) => const SetupView( crossFadeState: _searchActive
newWallet: true, ? CrossFadeState.showFirst
: CrossFadeState.showSecond,
firstChild: PlatformField(
inputBorder: InputBorder.none,
focusNode: searchFocus,
onChanged: (e) {
_filter = e;
setState(() {});
},
labelText: AppLocalizations.of(context).searchLabel,
),
secondChild: DropdownButton<int>(
value: (selectedWallet == null)
? -1
: wallets.indexOf(selectedWallet!),
items: [
...wallets.map(
(e) => DropdownMenuItem(
value: wallets.indexOf(
e,
),
child: Text(e.name),
), ),
), ),
); DropdownMenuItem(
wallets = await WalletManager.listWallets(); value: -1,
selectedWallet = wallets.last; child: Text(AppLocalizations.of(context).newWallet),
setState(() {}); ),
return; ],
} onChanged: (v) async {
selectedWallet = wallets[v]; if (v == null || v == -1) {
setState(() {}); await Navigator.of(context).push(
}, platformRoute(
), (c) => const SetupView(
actions: [ newWallet: true,
PopupMenuButton( ),
itemBuilder: (context) => [
AppLocalizations.of(context).settings,
AppLocalizations.of(context).about,
].map((e) => PopupMenuItem(value: e, child: Text(e))).toList(),
onSelected: (value) {
if (value == AppLocalizations.of(context).settings) {
Navigator.of(context)
.push(
platformRoute(
(context) => const SettingsView(),
),
)
.then((value) async {
selectedWallet =
await WalletManager.loadWallet(selectedWallet!.name);
});
} else if (value == AppLocalizations.of(context).about) {
showAboutDialog(
context: context,
applicationLegalese: AppLocalizations.of(context).license,
applicationName: "Prašule",
);
}
},
),
],
),
body: Center(
child: SizedBox(
width: MediaQuery.of(context).size.width * 0.9,
height: MediaQuery.of(context).size.height,
child: (selectedWallet == null)
? const Column(
children: [
SizedBox(
width: 40,
height: 40,
child: CircularProgressIndicator(),
), ),
], );
) wallets = await WalletManager.listWallets();
: (selectedWallet!.entries.isEmpty) selectedWallet = wallets.last;
? Column( setState(() {});
children: [ return;
Text( }
AppLocalizations.of(context).noEntries, selectedWallet = wallets[v];
style: const TextStyle( setState(() {});
fontSize: 20, },
fontWeight: FontWeight.bold, ),
), ),
), actions: [
Text( if (!_searchActive)
AppLocalizations.of(context).noEntriesSub, IconButton(
), onPressed: () {
], _searchActive = true;
setState(() {});
},
icon: const Icon(Icons.search),
),
if (!_searchActive)
PopupMenuButton(
itemBuilder: (context) => [
AppLocalizations.of(context).settings,
AppLocalizations.of(context).about,
].map((e) => PopupMenuItem(value: e, child: Text(e))).toList(),
onSelected: (value) {
if (value == AppLocalizations.of(context).settings) {
Navigator.of(context)
.push(
platformRoute(
(context) => const SettingsView(),
),
) )
: Column( .then((value) async {
children: [ selectedWallet =
Text( await WalletManager.loadWallet(selectedWallet!.name);
NumberFormat.compactCurrency( });
locale: locale, } else if (value == AppLocalizations.of(context).about) {
symbol: selectedWallet!.currency.symbol, showAboutDialog(
).format(selectedWallet!.calculateCurrentBalance()), context: context,
style: const TextStyle( applicationLegalese: AppLocalizations.of(context).license,
fontWeight: FontWeight.bold, applicationName: "Prašule",
fontSize: 22, );
}
},
),
],
),
body: Center(
child: SizedBox(
width: MediaQuery.of(context).size.width * 0.9,
height: MediaQuery.of(context).size.height,
child: (selectedWallet == null)
? const Column(
children: [
SizedBox(
width: 40,
height: 40,
child: CircularProgressIndicator(),
),
],
)
: (selectedWallet!.entries.isEmpty)
? Column(
children: [
Text(
AppLocalizations.of(context).noEntries,
style: const TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
),
), ),
), Text(
const SizedBox( AppLocalizations.of(context).noEntriesSub,
height: 5, ),
), ],
if (selectedWallet!.calculateMonthStatus( )
DateTime.now().month, : Overlay(
DateTime.now().year, initialEntries: [
) == OverlayEntry(
0) builder: (context) => Column(
Text(AppLocalizations.of(context).evenMoney)
else
RichText(
text: TextSpan(
children: [ children: [
TextSpan( Text(
text: AppLocalizations.of(context) NumberFormat.compactCurrency(
.balanceStatusA,
),
TextSpan(
style: TextStyle(
color: (selectedWallet!
.calculateMonthStatus(
DateTime.now().month,
DateTime.now().year,
) >
0
? ((MediaQuery.of(context)
.platformBrightness ==
Brightness.dark)
? Colors.green.shade300
: Colors.green)
.harmonizeWith(
Theme.of(context)
.colorScheme
.primary,
)
: ((MediaQuery.of(context)
.platformBrightness ==
Brightness.dark)
? Colors.red.shade300
: Colors.red)
.harmonizeWith(
Theme.of(context)
.colorScheme
.primary,
)),
),
text: NumberFormat.compactCurrency(
locale: locale, locale: locale,
symbol: selectedWallet!.currency.symbol, symbol: selectedWallet!.currency.symbol,
).format( ).format(
selectedWallet!.calculateMonthStatus( selectedWallet!.calculateCurrentBalance(),
DateTime.now().month, ),
DateTime.now().year, style: const TextStyle(
), fontWeight: FontWeight.bold,
fontSize: 22,
), ),
), ),
TextSpan( const SizedBox(
text: AppLocalizations.of(context) height: 5,
.balanceStatusB, ),
if (selectedWallet!.calculateMonthStatus(
DateTime.now().month,
DateTime.now().year,
) ==
0)
Text(AppLocalizations.of(context).evenMoney)
else
RichText(
text: TextSpan(
children: [
TextSpan(
text: AppLocalizations.of(context)
.balanceStatusA,
),
TextSpan(
style: TextStyle(
color: (selectedWallet!
.calculateMonthStatus(
DateTime.now().month,
DateTime.now().year,
) >
0
? ((MediaQuery.of(context)
.platformBrightness ==
Brightness.dark)
? Colors.green.shade300
: Colors.green)
.harmonizeWith(
Theme.of(context)
.colorScheme
.primary,
)
: ((MediaQuery.of(context)
.platformBrightness ==
Brightness.dark)
? Colors.red.shade300
: Colors.red)
.harmonizeWith(
Theme.of(context)
.colorScheme
.primary,
)),
),
text: NumberFormat.compactCurrency(
locale: locale,
symbol:
selectedWallet!.currency.symbol,
).format(
selectedWallet!
.calculateMonthStatus(
DateTime.now().month,
DateTime.now().year,
),
),
),
TextSpan(
text: AppLocalizations.of(context)
.balanceStatusB,
),
],
),
),
const SizedBox(
height: 10,
),
Expanded(
child: GroupedListView(
groupHeaderBuilder: (element) => Text(
DateFormat.yMMMM(locale)
.format(element.date),
style: TextStyle(
color: Theme.of(context)
.colorScheme
.primary,
),
),
elements: selectedWallet!.entries
.where((element) =>
element.data.name.contains(_filter))
.toList(),
itemComparator: (a, b) =>
b.date.compareTo(a.date),
groupBy: (e) =>
DateFormat.yMMMM(locale).format(e.date),
groupComparator: (a, b) {
// TODO: better sorting algorithm lol
final yearA =
RegExp(r'\d+').firstMatch(a);
if (yearA == null) return 0;
final yearB =
RegExp(r'\d+').firstMatch(b);
if (yearB == null) return 0;
final compareYears =
int.parse(yearB.group(0)!).compareTo(
int.parse(yearA.group(0)!),
);
if (compareYears != 0) {
return compareYears;
}
final months = List<String>.generate(
12,
(index) =>
DateFormat.MMMM(locale).format(
DateTime(2023, index + 1),
),
);
final monthA =
RegExp('[^0-9 ]+').firstMatch(a);
if (monthA == null) return 0;
final monthB =
RegExp('[^0-9 ]+').firstMatch(b);
if (monthB == null) return 0;
return months
.indexOf(monthB.group(0)!)
.compareTo(
months.indexOf(monthA.group(0)!),
);
},
itemBuilder: (context, element) => Slidable(
endActionPane: ActionPane(
motion: const ScrollMotion(),
children: [
SlidableAction(
onPressed: (c) {
Navigator.of(context)
.push<WalletSingleEntry>(
MaterialPageRoute(
builder: (c) =>
CreateSingleEntryView(
w: selectedWallet!,
editEntry: element,
),
),
)
.then(
(editedEntry) {
if (editedEntry == null) {
return;
}
selectedWallet!.entries
.remove(element);
selectedWallet!.entries
.add(editedEntry);
WalletManager.saveWallet(
selectedWallet!,
);
setState(() {});
},
);
},
backgroundColor: Theme.of(context)
.colorScheme
.secondary,
foregroundColor: Theme.of(context)
.colorScheme
.onSecondary,
icon: Icons.edit,
),
SlidableAction(
backgroundColor: Theme.of(context)
.colorScheme
.error,
foregroundColor: Theme.of(context)
.colorScheme
.onError,
icon: Icons.delete,
onPressed: (c) {
showDialog(
context: context,
builder: (cx) => PlatformDialog(
title: AppLocalizations.of(
context,
).sureDialog,
content: Text(
AppLocalizations.of(context)
.deleteSure,
),
actions: [
PlatformButton(
text: AppLocalizations.of(
context,
).yes,
onPressed: () {
selectedWallet?.entries
.removeWhere(
(e) =>
e.id ==
element.id,
);
WalletManager
.saveWallet(
selectedWallet!,
);
Navigator.of(cx).pop();
setState(() {});
},
),
PlatformButton(
text: AppLocalizations.of(
context,
).no,
onPressed: () {
Navigator.of(cx).pop();
},
),
],
),
);
},
),
],
),
child: ListTile(
leading: Container(
decoration: BoxDecoration(
borderRadius:
BorderRadius.circular(16),
color: element.category.color,
),
child: Padding(
padding: const EdgeInsets.all(8),
child: Icon(
element.category.icon,
color: element.category.color
.calculateTextColor(),
),
),
),
title: Text(element.data.name),
subtitle: RichText(
text: TextSpan(
children: [
TextSpan(
text: NumberFormat.currency(
symbol: selectedWallet!
.currency.symbol,
).format(element.data.amount),
style: TextStyle(
color: (element.type ==
EntryType.income)
? (MediaQuery.of(context)
.platformBrightness ==
Brightness.dark)
? Colors
.green.shade300
: Colors.green
.harmonizeWith(
Theme.of(context)
.colorScheme
.primary,
)
: (MediaQuery.of(context)
.platformBrightness ==
Brightness.dark)
? Colors.red.shade300
: Colors.red
.harmonizeWith(
Theme.of(context)
.colorScheme
.primary,
),
),
),
TextSpan(
text:
" | ${DateFormat.MMMd(locale).format(element.date)}",
style: TextStyle(
color: Theme.of(context)
.colorScheme
.background
.calculateTextColor(),
),
),
],
),
),
),
),
),
), ),
], ],
), ),
), ),
const SizedBox( OverlayEntry(
height: 10, builder: (context) => SizedBox(
), width: MediaQuery.of(context).size.width,
Expanded( height: MediaQuery.of(context).size.height,
child: GroupedListView( child: GestureDetector(
groupHeaderBuilder: (element) => Text( onTap: () {
DateFormat.yMMMM(locale).format(element.date), if (!_searchActive) return;
style: TextStyle( if (!searchFocus.hasFocus) {
color: Theme.of(context).colorScheme.primary, _searchActive = false;
), _filter = "";
), setState(() {});
elements: selectedWallet!.entries, return;
itemComparator: (a, b) => b.date.compareTo(a.date), }
groupBy: (e) => searchFocus.unfocus();
DateFormat.yMMMM(locale).format(e.date), },
groupComparator: (a, b) {
// TODO: better sorting algorithm lol
final yearA = RegExp(r'\d+').firstMatch(a);
if (yearA == null) return 0;
final yearB = RegExp(r'\d+').firstMatch(b);
if (yearB == null) return 0;
final compareYears = int.parse(yearB.group(0)!)
.compareTo(int.parse(yearA.group(0)!));
if (compareYears != 0) return compareYears;
final months = List<String>.generate(
12,
(index) => DateFormat.MMMM(locale).format(
DateTime(2023, index + 1),
),
);
final monthA = RegExp('[^0-9 ]+').firstMatch(a);
if (monthA == null) return 0;
final monthB = RegExp('[^0-9 ]+').firstMatch(b);
if (monthB == null) return 0;
return months.indexOf(monthB.group(0)!).compareTo(
months.indexOf(monthA.group(0)!),
);
},
itemBuilder: (context, element) => Slidable(
endActionPane: ActionPane(
motion: const ScrollMotion(),
children: [
SlidableAction(
onPressed: (c) {
Navigator.of(context)
.push<WalletSingleEntry>(
MaterialPageRoute(
builder: (c) => CreateSingleEntryView(
w: selectedWallet!,
editEntry: element,
),
),
)
.then(
(editedEntry) {
if (editedEntry == null) return;
selectedWallet!.entries
.remove(element);
selectedWallet!.entries
.add(editedEntry);
WalletManager.saveWallet(
selectedWallet!,
);
setState(() {});
},
);
},
backgroundColor:
Theme.of(context).colorScheme.secondary,
foregroundColor: Theme.of(context)
.colorScheme
.onSecondary,
icon: Icons.edit,
),
SlidableAction(
backgroundColor:
Theme.of(context).colorScheme.error,
foregroundColor:
Theme.of(context).colorScheme.onError,
icon: Icons.delete,
onPressed: (c) {
showDialog(
context: context,
builder: (cx) => PlatformDialog(
title: AppLocalizations.of(context)
.sureDialog,
content: Text(
AppLocalizations.of(context)
.deleteSure,
),
actions: [
PlatformButton(
text: AppLocalizations.of(context)
.yes,
onPressed: () {
selectedWallet?.entries
.removeWhere(
(e) => e.id == element.id,
);
WalletManager.saveWallet(
selectedWallet!,
);
Navigator.of(cx).pop();
setState(() {});
},
),
PlatformButton(
text: AppLocalizations.of(context)
.no,
onPressed: () {
Navigator.of(cx).pop();
},
),
],
),
);
},
),
],
),
child: ListTile(
leading: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(16),
color: element.category.color,
),
child: Padding(
padding: const EdgeInsets.all(8),
child: Icon(
element.category.icon,
color: element.category.color
.calculateTextColor(),
),
),
),
title: Text(element.data.name),
subtitle: RichText(
text: TextSpan(
children: [
TextSpan(
text: NumberFormat.currency(
symbol:
selectedWallet!.currency.symbol,
).format(element.data.amount),
style: TextStyle(
color: (element.type ==
EntryType.income)
? (MediaQuery.of(context)
.platformBrightness ==
Brightness.dark)
? Colors.green.shade300
: Colors.green.harmonizeWith(
Theme.of(context)
.colorScheme
.primary,
)
: (MediaQuery.of(context)
.platformBrightness ==
Brightness.dark)
? Colors.red.shade300
: Colors.red.harmonizeWith(
Theme.of(context)
.colorScheme
.primary,
),
),
),
TextSpan(
text:
" | ${DateFormat.MMMd(locale).format(element.date)}",
style: TextStyle(
color: Theme.of(context)
.colorScheme
.background
.calculateTextColor(),
),
),
],
),
),
), ),
), ),
), ),
), ],
], ),
), ),
), ),
), ),
); );

View file

@ -1,7 +1,7 @@
name: prasule name: prasule
description: Open-source private expense tracker description: Open-source private expense tracker
version: 1.0.0-alpha+4 version: 1.0.0-alpha+5
environment: environment:
sdk: '>=3.1.0-262.2.beta <4.0.0' sdk: '>=3.1.0-262.2.beta <4.0.0'