Merge branch 'main' into docs
@@ -5,21 +5,41 @@
|
|||||||
"version": "0.2.0",
|
"version": "0.2.0",
|
||||||
"configurations": [
|
"configurations": [
|
||||||
{
|
{
|
||||||
"name": "example fl_query",
|
"name": "fl_query",
|
||||||
"cwd": "packages/example",
|
"cwd": "packages/fl_query/example",
|
||||||
"request": "launch",
|
"request": "launch",
|
||||||
"type": "dart"
|
"type": "dart"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"name": "example fl_query (profile mode)",
|
"name": "fl_query (profile mode)",
|
||||||
"cwd": "packages/example",
|
"cwd": "packages/fl_query/example",
|
||||||
"request": "launch",
|
"request": "launch",
|
||||||
"type": "dart",
|
"type": "dart",
|
||||||
"flutterMode": "profile"
|
"flutterMode": "profile"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"name": "example fl_query (release mode)",
|
"name": "fl_query (release mode)",
|
||||||
"cwd": "packages/example",
|
"cwd": "packages/fl_query/example",
|
||||||
|
"request": "launch",
|
||||||
|
"type": "dart",
|
||||||
|
"flutterMode": "release"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "hooks fl_query",
|
||||||
|
"cwd": "packages/fl_query_hooks/example",
|
||||||
|
"request": "launch",
|
||||||
|
"type": "dart"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "hooks fl_query (profile mode)",
|
||||||
|
"cwd": "packages/fl_query_hooks/example",
|
||||||
|
"request": "launch",
|
||||||
|
"type": "dart",
|
||||||
|
"flutterMode": "profile"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "hooks fl_query (release mode)",
|
||||||
|
"cwd": "packages/fl_query_hooks/example",
|
||||||
"request": "launch",
|
"request": "launch",
|
||||||
"type": "dart",
|
"type": "dart",
|
||||||
"flutterMode": "release"
|
"flutterMode": "release"
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
---
|
---
|
||||||
title: Optimistic Updates (Still WIP)
|
title: Optimistic Updates
|
||||||
sidebar_position: 10
|
sidebar_position: 10
|
||||||
---
|
---
|
||||||
|
|
||||||
@@ -34,6 +34,7 @@ return MutationBuilder(
|
|||||||
return MutationBuilder(
|
return MutationBuilder(
|
||||||
job: mutationJob,
|
job: mutationJob,
|
||||||
onMutate: (variable) {
|
onMutate: (variable) {
|
||||||
|
final data = QueryBowl.of(context).getQuery(successJob.queryKey)?.data;
|
||||||
QueryBowl.of(context)
|
QueryBowl.of(context)
|
||||||
.setQueryData<Map<String, dynamic>, void>(successJob.queryKey, (oldData) {
|
.setQueryData<Map<String, dynamic>, void>(successJob.queryKey, (oldData) {
|
||||||
// replacing the soon to be expired data with updated data
|
// replacing the soon to be expired data with updated data
|
||||||
@@ -44,6 +45,15 @@ return MutationBuilder(
|
|||||||
// of the intended query data which can be used when
|
// of the intended query data which can be used when
|
||||||
// an error occurs in mutation & we can rollback to a previous
|
// an error occurs in mutation & we can rollback to a previous
|
||||||
// data set
|
// data set
|
||||||
|
return data;
|
||||||
|
},
|
||||||
|
onData: (data, variables, context) {
|
||||||
|
print("Passed Variable: $variables");
|
||||||
|
print("Safe Previous Value: $context");
|
||||||
|
},
|
||||||
|
onError: (data, variables, context) {
|
||||||
|
print("Passed Variable: $variables");
|
||||||
|
print("Safe Previous Value: $context");
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
```
|
```
|
||||||
@@ -0,0 +1,99 @@
|
|||||||
|
---
|
||||||
|
title: Paginated/Lagged Query
|
||||||
|
sidebar_position: 10
|
||||||
|
---
|
||||||
|
|
||||||
|
|
||||||
|
Rendering paginated data is a very common UI pattern and in Fl-Query, it "just works" by including the page information in the query key:
|
||||||
|
|
||||||
|
```dart
|
||||||
|
final queryVariableKeyJob = QueryJob.withVariableKey<String, void>(
|
||||||
|
task: (queryKey, externalData) {
|
||||||
|
return MyAPI.getData(id: getVariable(queryKey));
|
||||||
|
},
|
||||||
|
);
|
||||||
|
|
||||||
|
/// inside a widget build method
|
||||||
|
QueryBuilder(
|
||||||
|
job: queryVariableKeyJob(id),
|
||||||
|
externalData: null,
|
||||||
|
builder: (context, query){...}
|
||||||
|
)
|
||||||
|
```
|
||||||
|
|
||||||
|
However, if you run this simple example, you might notice something strange:
|
||||||
|
|
||||||
|
**The UI jumps in and out of the `success` and `loading` states because each new page is treated like a brand new query.**
|
||||||
|
|
||||||
|
This experience is not optimal and unfortunately is how many tools today insist on working. But not Fl-Query! As you may have guessed, Fl-Query comes with an awesome feature called `keepPreviousData` that allows us to get around this.
|
||||||
|
|
||||||
|
## Better Paginated Queries with `keepPreviousData`
|
||||||
|
|
||||||
|
Consider the following example where we would ideally want to increment a pageIndex (or cursor) for a query. If we were to use just `QueryJob.withVariableKey`, **it would still technically work fine**, but the UI would jump in and out of the `success` and `loading` states as different queries are created and destroyed for each page or cursor. By setting `keepPreviousData` to `true` we get a few new things:
|
||||||
|
|
||||||
|
- **The data from the last successful fetch available while new data is being requested, even though the query key has changed**.
|
||||||
|
- When the new data arrives, the previous `data` is seamlessly swapped to show the new data.
|
||||||
|
- `isPreviousData` is made available to know what data the query is currently providing you
|
||||||
|
|
||||||
|
```dart
|
||||||
|
final todoJob = QueryJob.withVariableKey<Map, void>(
|
||||||
|
preQueryKey: "todo",
|
||||||
|
task: (queryKey, _) async {
|
||||||
|
final res = await http.get(
|
||||||
|
Uri.parse(
|
||||||
|
"https://jsonplaceholder.typicode.com/todos/${getVariable(queryKey)}"),
|
||||||
|
);
|
||||||
|
return jsonDecode(res.body);
|
||||||
|
},
|
||||||
|
keepPreviousData: true,
|
||||||
|
);
|
||||||
|
|
||||||
|
class QueryPreviousDataExample extends StatefulWidget {
|
||||||
|
const QueryPreviousDataExample({Key? key}) : super(key: key);
|
||||||
|
|
||||||
|
@override
|
||||||
|
State<QueryPreviousDataExample> createState() =>
|
||||||
|
_QueryPreviousDataExampleState();
|
||||||
|
}
|
||||||
|
|
||||||
|
class _QueryPreviousDataExampleState extends State<QueryPreviousDataExample> {
|
||||||
|
int id = 1;
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return Column(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
children: [
|
||||||
|
QueryBuilder(
|
||||||
|
job: todoJob(id.toString()),
|
||||||
|
externalData: null,
|
||||||
|
builder: (context, query) {
|
||||||
|
if (query.hasError) return Text(query.error.toString());
|
||||||
|
if (!query.hasData) return const CircularProgressIndicator();
|
||||||
|
return Text(jsonEncode(query.data ?? {}));
|
||||||
|
}),
|
||||||
|
Row(
|
||||||
|
children: [
|
||||||
|
IconButton(
|
||||||
|
icon: const Icon(Icons.remove),
|
||||||
|
onPressed: () {
|
||||||
|
setState(() {
|
||||||
|
id -= 1;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
),
|
||||||
|
IconButton(
|
||||||
|
icon: const Icon(Icons.add),
|
||||||
|
onPressed: () {
|
||||||
|
setState(() {
|
||||||
|
id += 1;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
),
|
||||||
|
],
|
||||||
|
)
|
||||||
|
],
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
```
|
||||||
@@ -9,7 +9,7 @@ Fl-Query is just another Flutter "package" so no extra installation step needed
|
|||||||
$ flutter pub add fl_query
|
$ flutter pub add fl_query
|
||||||
```
|
```
|
||||||
|
|
||||||
### For using with `flutter_hooks`
|
### Using with `flutter_hooks`
|
||||||
|
|
||||||
If you're an ELITE `flutter_hooks` user or want to use `fl_query_hooks` you'll need the `flutter_hooks` & `fl_query_hooks` package
|
If you're an ELITE `flutter_hooks` user or want to use `fl_query_hooks` you'll need the `flutter_hooks` & `fl_query_hooks` package
|
||||||
|
|
||||||
|
|||||||
@@ -1,92 +0,0 @@
|
|||||||
import 'dart:math';
|
|
||||||
|
|
||||||
import 'package:example/components/basic_mutation.dart';
|
|
||||||
import 'package:example/components/basic_query.dart';
|
|
||||||
import 'package:example/components/hooks/basic_hook_mutation.dart';
|
|
||||||
import 'package:example/components/hooks/basic_hook_query.dart';
|
|
||||||
import 'package:example/components/hooks/lazy_hook_query.dart';
|
|
||||||
import 'package:example/components/hooks/mutation_hook_variable_key.dart';
|
|
||||||
import 'package:example/components/hooks/query_hook_external_data.dart';
|
|
||||||
import 'package:example/components/hooks/query_hook_variable_key.dart';
|
|
||||||
import 'package:example/components/lazy_query.dart';
|
|
||||||
import 'package:example/components/mutation_variable_key.dart';
|
|
||||||
import 'package:example/components/query_external_data.dart';
|
|
||||||
import 'package:example/components/query_variable_key.dart';
|
|
||||||
import 'package:fl_query/fl_query.dart';
|
|
||||||
import 'package:flutter/material.dart';
|
|
||||||
|
|
||||||
void main() {
|
|
||||||
runApp(const MyApp());
|
|
||||||
}
|
|
||||||
|
|
||||||
class MyApp extends StatelessWidget {
|
|
||||||
const MyApp({Key? key}) : super(key: key);
|
|
||||||
|
|
||||||
@override
|
|
||||||
Widget build(BuildContext context) {
|
|
||||||
return QueryBowlScope(
|
|
||||||
child: MaterialApp(
|
|
||||||
// showPerformanceOverlay: true,
|
|
||||||
title: 'Flutter Demo',
|
|
||||||
theme: ThemeData(
|
|
||||||
useMaterial3: true,
|
|
||||||
primarySwatch: Colors.blue,
|
|
||||||
),
|
|
||||||
home: const MyHomePage(),
|
|
||||||
),
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
class MyHomePage extends StatefulWidget {
|
|
||||||
const MyHomePage({Key? key}) : super(key: key);
|
|
||||||
|
|
||||||
@override
|
|
||||||
State<MyHomePage> createState() => _MyHomePageState();
|
|
||||||
}
|
|
||||||
|
|
||||||
class _MyHomePageState extends State<MyHomePage> with WidgetsBindingObserver {
|
|
||||||
@override
|
|
||||||
Widget build(BuildContext context) {
|
|
||||||
return Scaffold(
|
|
||||||
appBar: AppBar(
|
|
||||||
title: const Text("Fl Query Example"),
|
|
||||||
),
|
|
||||||
body: SingleChildScrollView(
|
|
||||||
child: Padding(
|
|
||||||
padding: const EdgeInsets.all(8.0),
|
|
||||||
child: Column(
|
|
||||||
children: [
|
|
||||||
// Regular Flutter Examples
|
|
||||||
const BasicQueryExample(),
|
|
||||||
const QueryExternalDataExample(),
|
|
||||||
const LazyQueryExample(),
|
|
||||||
const QueryVariableKeyExample(),
|
|
||||||
const Divider(),
|
|
||||||
const BasicMutationExample(),
|
|
||||||
const MutationVariableKeyExample(),
|
|
||||||
|
|
||||||
const Divider(color: Colors.amber, thickness: 5),
|
|
||||||
Align(
|
|
||||||
alignment: Alignment.topLeft,
|
|
||||||
child: Text(
|
|
||||||
"!Warning! Cool people only...\nFlutter Hooks Example",
|
|
||||||
style: Theme.of(context).textTheme.headline3,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
const Divider(color: Colors.amber, thickness: 5),
|
|
||||||
// elite flutter_hooks examples for only elite flutter
|
|
||||||
// developers
|
|
||||||
const BasicHookQueryExample(),
|
|
||||||
const QueryHookExternalDataExample(),
|
|
||||||
const LazyHookQueryExample(),
|
|
||||||
const QueryHookVariableKeyExample(),
|
|
||||||
const Divider(),
|
|
||||||
const BasicHookMutationExample(),
|
|
||||||
const MutationHookVariableKeyExample(),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
)),
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,30 +0,0 @@
|
|||||||
// This is a basic Flutter widget test.
|
|
||||||
//
|
|
||||||
// To perform an interaction with a widget in your test, use the WidgetTester
|
|
||||||
// utility in the flutter_test package. For example, you can send tap and scroll
|
|
||||||
// gestures. You can also use WidgetTester to find child widgets in the widget
|
|
||||||
// tree, read text, and verify that the values of widget properties are correct.
|
|
||||||
|
|
||||||
import 'package:flutter/material.dart';
|
|
||||||
import 'package:flutter_test/flutter_test.dart';
|
|
||||||
|
|
||||||
import 'package:example/main.dart';
|
|
||||||
|
|
||||||
void main() {
|
|
||||||
testWidgets('Counter increments smoke test', (WidgetTester tester) async {
|
|
||||||
// Build our app and trigger a frame.
|
|
||||||
await tester.pumpWidget(const MyApp());
|
|
||||||
|
|
||||||
// Verify that our counter starts at 0.
|
|
||||||
expect(find.text('0'), findsOneWidget);
|
|
||||||
expect(find.text('1'), findsNothing);
|
|
||||||
|
|
||||||
// Tap the '+' icon and trigger a frame.
|
|
||||||
await tester.tap(find.byIcon(Icons.add));
|
|
||||||
await tester.pump();
|
|
||||||
|
|
||||||
// Verify that our counter has incremented.
|
|
||||||
expect(find.text('0'), findsNothing);
|
|
||||||
expect(find.text('1'), findsOneWidget);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
@@ -1 +1 @@
|
|||||||
{"info":"This is a generated file; do not edit or check into version control.","plugins":{"ios":[{"name":"connectivity_plus","path":"/home/krtirtho/.pub-cache/hosted/pub.dartlang.org/connectivity_plus-2.3.5/","native_build":true,"dependencies":[]}],"android":[{"name":"connectivity_plus","path":"/home/krtirtho/.pub-cache/hosted/pub.dartlang.org/connectivity_plus-2.3.5/","native_build":true,"dependencies":[]}],"macos":[{"name":"connectivity_plus_macos","path":"/home/krtirtho/.pub-cache/hosted/pub.dartlang.org/connectivity_plus_macos-1.2.4/","native_build":true,"dependencies":[]}],"linux":[{"name":"connectivity_plus_linux","path":"/home/krtirtho/.pub-cache/hosted/pub.dartlang.org/connectivity_plus_linux-1.3.1/","native_build":false,"dependencies":[]}],"windows":[{"name":"connectivity_plus_windows","path":"/home/krtirtho/.pub-cache/hosted/pub.dartlang.org/connectivity_plus_windows-1.2.2/","native_build":true,"dependencies":[]}],"web":[{"name":"connectivity_plus_web","path":"/home/krtirtho/.pub-cache/hosted/pub.dartlang.org/connectivity_plus_web-1.2.2/","dependencies":[]}]},"dependencyGraph":[{"name":"connectivity_plus","dependencies":["connectivity_plus_linux","connectivity_plus_macos","connectivity_plus_web","connectivity_plus_windows"]},{"name":"connectivity_plus_linux","dependencies":[]},{"name":"connectivity_plus_macos","dependencies":[]},{"name":"connectivity_plus_web","dependencies":[]},{"name":"connectivity_plus_windows","dependencies":[]}],"date_created":"2022-07-20 12:20:16.617434","version":"3.0.1"}
|
{"info":"This is a generated file; do not edit or check into version control.","plugins":{"ios":[{"name":"connectivity_plus","path":"/home/krtirtho/.pub-cache/hosted/pub.dartlang.org/connectivity_plus-2.3.5/","native_build":true,"dependencies":[]}],"android":[{"name":"connectivity_plus","path":"/home/krtirtho/.pub-cache/hosted/pub.dartlang.org/connectivity_plus-2.3.5/","native_build":true,"dependencies":[]}],"macos":[{"name":"connectivity_plus_macos","path":"/home/krtirtho/.pub-cache/hosted/pub.dartlang.org/connectivity_plus_macos-1.2.4/","native_build":true,"dependencies":[]}],"linux":[{"name":"connectivity_plus_linux","path":"/home/krtirtho/.pub-cache/hosted/pub.dartlang.org/connectivity_plus_linux-1.3.1/","native_build":false,"dependencies":[]}],"windows":[{"name":"connectivity_plus_windows","path":"/home/krtirtho/.pub-cache/hosted/pub.dartlang.org/connectivity_plus_windows-1.2.2/","native_build":true,"dependencies":[]}],"web":[{"name":"connectivity_plus_web","path":"/home/krtirtho/.pub-cache/hosted/pub.dartlang.org/connectivity_plus_web-1.2.2/","dependencies":[]}]},"dependencyGraph":[{"name":"connectivity_plus","dependencies":["connectivity_plus_linux","connectivity_plus_macos","connectivity_plus_web","connectivity_plus_windows"]},{"name":"connectivity_plus_linux","dependencies":[]},{"name":"connectivity_plus_macos","dependencies":[]},{"name":"connectivity_plus_web","dependencies":[]},{"name":"connectivity_plus_windows","dependencies":[]}],"date_created":"2022-08-07 10:53:50.758755","version":"3.0.1"}
|
||||||
@@ -15,9 +15,24 @@ migration:
|
|||||||
- platform: root
|
- platform: root
|
||||||
create_revision: fb57da5f945d02ef4f98dfd9409a72b7cce74268
|
create_revision: fb57da5f945d02ef4f98dfd9409a72b7cce74268
|
||||||
base_revision: fb57da5f945d02ef4f98dfd9409a72b7cce74268
|
base_revision: fb57da5f945d02ef4f98dfd9409a72b7cce74268
|
||||||
|
- platform: android
|
||||||
|
create_revision: fb57da5f945d02ef4f98dfd9409a72b7cce74268
|
||||||
|
base_revision: fb57da5f945d02ef4f98dfd9409a72b7cce74268
|
||||||
|
- platform: ios
|
||||||
|
create_revision: fb57da5f945d02ef4f98dfd9409a72b7cce74268
|
||||||
|
base_revision: fb57da5f945d02ef4f98dfd9409a72b7cce74268
|
||||||
- platform: linux
|
- platform: linux
|
||||||
create_revision: fb57da5f945d02ef4f98dfd9409a72b7cce74268
|
create_revision: fb57da5f945d02ef4f98dfd9409a72b7cce74268
|
||||||
base_revision: fb57da5f945d02ef4f98dfd9409a72b7cce74268
|
base_revision: fb57da5f945d02ef4f98dfd9409a72b7cce74268
|
||||||
|
- platform: macos
|
||||||
|
create_revision: fb57da5f945d02ef4f98dfd9409a72b7cce74268
|
||||||
|
base_revision: fb57da5f945d02ef4f98dfd9409a72b7cce74268
|
||||||
|
- platform: web
|
||||||
|
create_revision: fb57da5f945d02ef4f98dfd9409a72b7cce74268
|
||||||
|
base_revision: fb57da5f945d02ef4f98dfd9409a72b7cce74268
|
||||||
|
- platform: windows
|
||||||
|
create_revision: fb57da5f945d02ef4f98dfd9409a72b7cce74268
|
||||||
|
base_revision: fb57da5f945d02ef4f98dfd9409a72b7cce74268
|
||||||
|
|
||||||
# User provided section
|
# User provided section
|
||||||
|
|
||||||
@@ -44,7 +44,7 @@ android {
|
|||||||
|
|
||||||
defaultConfig {
|
defaultConfig {
|
||||||
// TODO: Specify your own unique Application ID (https://developer.android.com/studio/build/application-id.html).
|
// TODO: Specify your own unique Application ID (https://developer.android.com/studio/build/application-id.html).
|
||||||
applicationId "com.github.KRTirtho.example"
|
applicationId "com.example.example"
|
||||||
// You can update the following values to match your application needs.
|
// You can update the following values to match your application needs.
|
||||||
// For more information, see: https://docs.flutter.dev/deployment/android#reviewing-the-build-configuration.
|
// For more information, see: https://docs.flutter.dev/deployment/android#reviewing-the-build-configuration.
|
||||||
minSdkVersion flutter.minSdkVersion
|
minSdkVersion flutter.minSdkVersion
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
|
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
|
||||||
package="com.github.KRTirtho.example">
|
package="com.example.example">
|
||||||
<!-- The INTERNET permission is required for development. Specifically,
|
<!-- The INTERNET permission is required for development. Specifically,
|
||||||
the Flutter tool needs it to communicate with the running application
|
the Flutter tool needs it to communicate with the running application
|
||||||
to allow setting breakpoints, to provide hot reload, etc.
|
to allow setting breakpoints, to provide hot reload, etc.
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
|
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
|
||||||
package="com.github.KRTirtho.example">
|
package="com.example.example">
|
||||||
<application
|
<application
|
||||||
android:label="example"
|
android:label="example"
|
||||||
android:name="${applicationName}"
|
android:name="${applicationName}"
|
||||||
@@ -1,4 +1,4 @@
|
|||||||
package com.github.KRTirtho.example
|
package com.example.example
|
||||||
|
|
||||||
import io.flutter.embedding.android.FlutterActivity
|
import io.flutter.embedding.android.FlutterActivity
|
||||||
|
|
||||||
|
Before Width: | Height: | Size: 544 B After Width: | Height: | Size: 544 B |
|
Before Width: | Height: | Size: 442 B After Width: | Height: | Size: 442 B |
|
Before Width: | Height: | Size: 721 B After Width: | Height: | Size: 721 B |
|
Before Width: | Height: | Size: 1.0 KiB After Width: | Height: | Size: 1.0 KiB |
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.4 KiB |
@@ -1,5 +1,5 @@
|
|||||||
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
|
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
|
||||||
package="com.github.KRTirtho.example">
|
package="com.example.example">
|
||||||
<!-- The INTERNET permission is required for development. Specifically,
|
<!-- The INTERNET permission is required for development. Specifically,
|
||||||
the Flutter tool needs it to communicate with the running application
|
the Flutter tool needs it to communicate with the running application
|
||||||
to allow setting breakpoints, to provide hot reload, etc.
|
to allow setting breakpoints, to provide hot reload, etc.
|
||||||
@@ -294,7 +294,7 @@
|
|||||||
"$(inherited)",
|
"$(inherited)",
|
||||||
"@executable_path/Frameworks",
|
"@executable_path/Frameworks",
|
||||||
);
|
);
|
||||||
PRODUCT_BUNDLE_IDENTIFIER = com.github.KRTirtho.example;
|
PRODUCT_BUNDLE_IDENTIFIER = com.example.example;
|
||||||
PRODUCT_NAME = "$(TARGET_NAME)";
|
PRODUCT_NAME = "$(TARGET_NAME)";
|
||||||
SWIFT_OBJC_BRIDGING_HEADER = "Runner/Runner-Bridging-Header.h";
|
SWIFT_OBJC_BRIDGING_HEADER = "Runner/Runner-Bridging-Header.h";
|
||||||
SWIFT_VERSION = 5.0;
|
SWIFT_VERSION = 5.0;
|
||||||
@@ -422,7 +422,7 @@
|
|||||||
"$(inherited)",
|
"$(inherited)",
|
||||||
"@executable_path/Frameworks",
|
"@executable_path/Frameworks",
|
||||||
);
|
);
|
||||||
PRODUCT_BUNDLE_IDENTIFIER = com.github.KRTirtho.example;
|
PRODUCT_BUNDLE_IDENTIFIER = com.example.example;
|
||||||
PRODUCT_NAME = "$(TARGET_NAME)";
|
PRODUCT_NAME = "$(TARGET_NAME)";
|
||||||
SWIFT_OBJC_BRIDGING_HEADER = "Runner/Runner-Bridging-Header.h";
|
SWIFT_OBJC_BRIDGING_HEADER = "Runner/Runner-Bridging-Header.h";
|
||||||
SWIFT_OPTIMIZATION_LEVEL = "-Onone";
|
SWIFT_OPTIMIZATION_LEVEL = "-Onone";
|
||||||
@@ -444,7 +444,7 @@
|
|||||||
"$(inherited)",
|
"$(inherited)",
|
||||||
"@executable_path/Frameworks",
|
"@executable_path/Frameworks",
|
||||||
);
|
);
|
||||||
PRODUCT_BUNDLE_IDENTIFIER = com.github.KRTirtho.example;
|
PRODUCT_BUNDLE_IDENTIFIER = com.example.example;
|
||||||
PRODUCT_NAME = "$(TARGET_NAME)";
|
PRODUCT_NAME = "$(TARGET_NAME)";
|
||||||
SWIFT_OBJC_BRIDGING_HEADER = "Runner/Runner-Bridging-Header.h";
|
SWIFT_OBJC_BRIDGING_HEADER = "Runner/Runner-Bridging-Header.h";
|
||||||
SWIFT_VERSION = 5.0;
|
SWIFT_VERSION = 5.0;
|
||||||
|
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 11 KiB |
|
Before Width: | Height: | Size: 564 B After Width: | Height: | Size: 564 B |
|
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 1.3 KiB |
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 1.0 KiB After Width: | Height: | Size: 1.0 KiB |
|
Before Width: | Height: | Size: 1.7 KiB After Width: | Height: | Size: 1.7 KiB |
|
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 1.3 KiB |
|
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 2.6 KiB After Width: | Height: | Size: 2.6 KiB |
|
Before Width: | Height: | Size: 2.6 KiB After Width: | Height: | Size: 2.6 KiB |
|
Before Width: | Height: | Size: 3.7 KiB After Width: | Height: | Size: 3.7 KiB |
|
Before Width: | Height: | Size: 1.8 KiB After Width: | Height: | Size: 1.8 KiB |
|
Before Width: | Height: | Size: 3.2 KiB After Width: | Height: | Size: 3.2 KiB |
|
Before Width: | Height: | Size: 3.5 KiB After Width: | Height: | Size: 3.5 KiB |
|
Before Width: | Height: | Size: 68 B After Width: | Height: | Size: 68 B |
|
Before Width: | Height: | Size: 68 B After Width: | Height: | Size: 68 B |
|
Before Width: | Height: | Size: 68 B After Width: | Height: | Size: 68 B |
@@ -1,7 +1,7 @@
|
|||||||
import 'dart:convert';
|
import 'dart:convert';
|
||||||
import 'dart:math';
|
import 'dart:math';
|
||||||
|
|
||||||
import 'package:example/components/basic_query.dart';
|
import 'package:fl_query_example/components/basic_query.dart';
|
||||||
import 'package:http/http.dart' as http;
|
import 'package:http/http.dart' as http;
|
||||||
|
|
||||||
import 'package:fl_query/fl_query.dart';
|
import 'package:fl_query/fl_query.dart';
|
||||||
@@ -56,12 +56,14 @@ class _BasicMutationExampleState extends State<BasicMutationExample> {
|
|||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
children: [
|
children: [
|
||||||
Text(
|
Text(
|
||||||
"# Basic Mutation Example",
|
"# Basic Mutation Example (with Failure & Retry simulation)",
|
||||||
style: Theme.of(context).textTheme.headline5,
|
style: Theme.of(context).textTheme.headline5,
|
||||||
),
|
),
|
||||||
MutationBuilder<Map, Map<String, dynamic>>(
|
MutationBuilder<Map, Map<String, dynamic>>(
|
||||||
job: basicMutationJob,
|
job: basicMutationJob,
|
||||||
onMutate: (v) {
|
onMutate: (v) {
|
||||||
|
final data =
|
||||||
|
QueryBowl.of(context).getQuery(successJob.queryKey)?.data;
|
||||||
QueryBowl.of(context)
|
QueryBowl.of(context)
|
||||||
.setQueryData<String, void>(successJob.queryKey, (oldData) {
|
.setQueryData<String, void>(successJob.queryKey, (oldData) {
|
||||||
if (oldData?.contains("After Mutate (OPTIMISTIC UPDATE)") ==
|
if (oldData?.contains("After Mutate (OPTIMISTIC UPDATE)") ==
|
||||||
@@ -70,6 +72,11 @@ class _BasicMutationExampleState extends State<BasicMutationExample> {
|
|||||||
}
|
}
|
||||||
return "$oldData - After Mutate (OPTIMISTIC UPDATE)";
|
return "$oldData - After Mutate (OPTIMISTIC UPDATE)";
|
||||||
});
|
});
|
||||||
|
return data;
|
||||||
|
},
|
||||||
|
onData: (data, variables, context) {
|
||||||
|
print("Passed Variable: $variables");
|
||||||
|
print("Safe Previous Value: $context");
|
||||||
},
|
},
|
||||||
builder: (context, mutation) {
|
builder: (context, mutation) {
|
||||||
return Padding(
|
return Padding(
|
||||||
@@ -94,7 +101,7 @@ class _BasicMutationExampleState extends State<BasicMutationExample> {
|
|||||||
"title": title,
|
"title": title,
|
||||||
"body": body,
|
"body": body,
|
||||||
"id": id,
|
"id": id,
|
||||||
}, onData: (data) {
|
}, onData: (data, variables, context) {
|
||||||
// resetting the form
|
// resetting the form
|
||||||
titleController.text = "";
|
titleController.text = "";
|
||||||
bodyController.text = "";
|
bodyController.text = "";
|
||||||
@@ -4,6 +4,7 @@ import 'package:fl_query/fl_query.dart';
|
|||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
|
|
||||||
final mutationVariableKeyJob = MutationJob.withVariableKey<String, double>(
|
final mutationVariableKeyJob = MutationJob.withVariableKey<String, double>(
|
||||||
|
preMutationKey: "mutation-example",
|
||||||
task: (queryKey, variables) {
|
task: (queryKey, variables) {
|
||||||
return Future.value("$variables");
|
return Future.value("$variables");
|
||||||
},
|
},
|
||||||
@@ -37,7 +38,7 @@ class _MutationVariableKeyExampleState
|
|||||||
style: Theme.of(context).textTheme.headline5,
|
style: Theme.of(context).textTheme.headline5,
|
||||||
),
|
),
|
||||||
MutationBuilder<String, double>(
|
MutationBuilder<String, double>(
|
||||||
job: mutationVariableKeyJob("mutation-variable-key#$id"),
|
job: mutationVariableKeyJob(id.toString()),
|
||||||
builder: (context, mutation) {
|
builder: (context, mutation) {
|
||||||
return Row(
|
return Row(
|
||||||
children: [
|
children: [
|
||||||
@@ -0,0 +1,70 @@
|
|||||||
|
import 'dart:convert';
|
||||||
|
|
||||||
|
import 'package:fl_query/fl_query.dart';
|
||||||
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:http/http.dart' as http;
|
||||||
|
|
||||||
|
final todoJob = QueryJob.withVariableKey<Map, void>(
|
||||||
|
preQueryKey: "todo",
|
||||||
|
task: (queryKey, _) async {
|
||||||
|
final res = await http.get(
|
||||||
|
Uri.parse(
|
||||||
|
"https://jsonplaceholder.typicode.com/todos/${getVariable(queryKey)}"),
|
||||||
|
);
|
||||||
|
return jsonDecode(res.body);
|
||||||
|
},
|
||||||
|
keepPreviousData: true,
|
||||||
|
);
|
||||||
|
|
||||||
|
class QueryPreviousDataExample extends StatefulWidget {
|
||||||
|
const QueryPreviousDataExample({Key? key}) : super(key: key);
|
||||||
|
|
||||||
|
@override
|
||||||
|
State<QueryPreviousDataExample> createState() =>
|
||||||
|
_QueryPreviousDataExampleState();
|
||||||
|
}
|
||||||
|
|
||||||
|
class _QueryPreviousDataExampleState extends State<QueryPreviousDataExample> {
|
||||||
|
int id = 1;
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return Column(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
children: [
|
||||||
|
Text(
|
||||||
|
"# Query Variable Key with keepPreviousData",
|
||||||
|
style: Theme.of(context).textTheme.headline5,
|
||||||
|
),
|
||||||
|
QueryBuilder(
|
||||||
|
job: todoJob(id.toString()),
|
||||||
|
externalData: null,
|
||||||
|
builder: (context, query) {
|
||||||
|
if (query.hasError) return Text(query.error.toString());
|
||||||
|
if (!query.hasData) return const CircularProgressIndicator();
|
||||||
|
return Text(jsonEncode(query.data ?? {}));
|
||||||
|
}),
|
||||||
|
Row(
|
||||||
|
children: [
|
||||||
|
IconButton(
|
||||||
|
icon: const Icon(Icons.remove),
|
||||||
|
onPressed: () {
|
||||||
|
setState(() {
|
||||||
|
id -= 1;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
),
|
||||||
|
IconButton(
|
||||||
|
icon: const Icon(Icons.add),
|
||||||
|
onPressed: () {
|
||||||
|
setState(() {
|
||||||
|
id += 1;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
),
|
||||||
|
],
|
||||||
|
)
|
||||||
|
],
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,66 @@
|
|||||||
|
import 'package:fl_query_example/components/basic_mutation.dart';
|
||||||
|
import 'package:fl_query_example/components/basic_query.dart';
|
||||||
|
import 'package:fl_query_example/components/lazy_query.dart';
|
||||||
|
import 'package:fl_query_example/components/mutation_variable_key.dart';
|
||||||
|
import 'package:fl_query_example/components/query_external_data.dart';
|
||||||
|
import 'package:fl_query_example/components/query_previous_data.dart';
|
||||||
|
import 'package:fl_query_example/components/query_variable_key.dart';
|
||||||
|
import 'package:fl_query/fl_query.dart';
|
||||||
|
import 'package:flutter/material.dart';
|
||||||
|
|
||||||
|
void main() {
|
||||||
|
runApp(const MyApp());
|
||||||
|
}
|
||||||
|
|
||||||
|
class MyApp extends StatelessWidget {
|
||||||
|
const MyApp({Key? key}) : super(key: key);
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return QueryBowlScope(
|
||||||
|
child: MaterialApp(
|
||||||
|
// showPerformanceOverlay: true,
|
||||||
|
title: 'Flutter Demo',
|
||||||
|
theme: ThemeData(
|
||||||
|
useMaterial3: true,
|
||||||
|
primarySwatch: Colors.blue,
|
||||||
|
),
|
||||||
|
home: const MyHomePage(),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
class MyHomePage extends StatefulWidget {
|
||||||
|
const MyHomePage({Key? key}) : super(key: key);
|
||||||
|
|
||||||
|
@override
|
||||||
|
State<MyHomePage> createState() => _MyHomePageState();
|
||||||
|
}
|
||||||
|
|
||||||
|
class _MyHomePageState extends State<MyHomePage> with WidgetsBindingObserver {
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return Scaffold(
|
||||||
|
appBar: AppBar(
|
||||||
|
title: const Text("Fl Query Example"),
|
||||||
|
),
|
||||||
|
body: SingleChildScrollView(
|
||||||
|
child: Padding(
|
||||||
|
padding: const EdgeInsets.all(8.0),
|
||||||
|
child: Column(
|
||||||
|
children: const [
|
||||||
|
BasicQueryExample(),
|
||||||
|
QueryExternalDataExample(),
|
||||||
|
LazyQueryExample(),
|
||||||
|
QueryVariableKeyExample(),
|
||||||
|
QueryPreviousDataExample(),
|
||||||
|
Divider(),
|
||||||
|
BasicMutationExample(),
|
||||||
|
MutationVariableKeyExample(),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
)),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -7,7 +7,7 @@ project(runner LANGUAGES CXX)
|
|||||||
set(BINARY_NAME "example")
|
set(BINARY_NAME "example")
|
||||||
# The unique GTK application identifier for this application. See:
|
# The unique GTK application identifier for this application. See:
|
||||||
# https://wiki.gnome.org/HowDoI/ChooseApplicationID
|
# https://wiki.gnome.org/HowDoI/ChooseApplicationID
|
||||||
set(APPLICATION_ID "com.github.KRTirtho.example")
|
set(APPLICATION_ID "com.example.example")
|
||||||
|
|
||||||
# Explicitly opt in to modern CMake behaviors to avoid warnings with recent
|
# Explicitly opt in to modern CMake behaviors to avoid warnings with recent
|
||||||
# versions of CMake.
|
# versions of CMake.
|
||||||
|
Before Width: | Height: | Size: 46 KiB After Width: | Height: | Size: 46 KiB |
|
Before Width: | Height: | Size: 3.2 KiB After Width: | Height: | Size: 3.2 KiB |
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 5.8 KiB After Width: | Height: | Size: 5.8 KiB |