Merge branch 'main' into docs

This commit is contained in:
Kingkor Roy Tirtho
2022-08-07 12:15:06 +06:00
284 changed files with 5457 additions and 370 deletions
@@ -0,0 +1,94 @@
import 'dart:convert';
import 'dart:math';
import 'package:fl_query_hooks_example/components/basic_hook_query.dart';
import 'package:fl_query_hooks/fl_query_hooks.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:http/http.dart' as http;
import 'package:fl_query/fl_query.dart';
import 'package:flutter/material.dart';
final basicMutationHookJob = MutationJob<Map, Map<String, dynamic>>(
mutationKey: "basic-hook-mutation-example",
task: (key, data) async {
final response = await http.post(
Uri.parse(
// to simulate a failing response environment
Random().nextBool()
? "https://jsonplaceholder.typicode.com/posts"
: "https://google.com",
),
headers: {'Content-type': 'application/json; charset=UTF-8'},
body: jsonEncode(data),
);
return jsonDecode(response.body);
},
);
class BasicHookMutationExample extends HookWidget {
const BasicHookMutationExample({super.key});
@override
Widget build(BuildContext context) {
final id = useMemoized(() => Random().nextInt(2000000), []);
final titleController = useTextEditingController();
final bodyController = useTextEditingController();
final mutation = useMutation(
job: basicMutationHookJob,
onMutate: (v) {
QueryBowl.of(context)
.setQueryData<String, void>(successHookJob.queryKey, (oldData) {
if (oldData?.contains("After Mutate (OPTIMISTIC UPDATE)") == true) {
return "$oldData";
}
return "$oldData - After Mutate (OPTIMISTIC UPDATE)";
});
},
);
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"# Basic Mutation Hook Example (with failure & retry simulation)",
style: Theme.of(context).textTheme.headline5,
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
children: [
TextField(
controller: titleController,
decoration: const InputDecoration(labelText: "Title"),
),
TextField(
controller: bodyController,
decoration: const InputDecoration(labelText: "Body"),
),
const SizedBox(height: 20),
ElevatedButton(
onPressed: () {
final title = titleController.value.text;
final body = bodyController.value.text;
if (body.isEmpty || title.isEmpty) return;
mutation.mutate({
"title": title,
"body": body,
"id": id,
}, onData: (data, variable, context) {
// resetting the form
titleController.text = "";
bodyController.text = "";
});
},
child: const Text("Post"),
),
const SizedBox(height: 20),
if (mutation.hasData) Text("Response\n${mutation.data}"),
if (mutation.hasError) Text(mutation.error.toString()),
],
),
)
],
);
}
}
@@ -0,0 +1,80 @@
import 'dart:math';
import 'package:fl_query/fl_query.dart';
import 'package:fl_query_hooks/fl_query_hooks.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
final successHookJob = QueryJob<String, void>(
queryKey: "greetings-hook-example",
task: (queryKey, _) => Future.delayed(
const Duration(seconds: 2),
() =>
"The work successfully executed. Data: key=($queryKey) value=${Random.secure().nextInt(100)}",
),
);
final canFailHookJob = QueryJob<String, void>(
queryKey: "failure-hook-example",
task: (queryKey, _) => Random().nextBool()
? Future.error("$queryKey operation failed for unknown reason")
: Future.value(
"Successful execution. Result: $queryKey=${Random().nextInt(100)}",
),
);
class BasicHookQueryExample extends HookWidget {
const BasicHookQueryExample({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
final successQuery = useQuery(job: successHookJob, externalData: null);
final canFailQuery = useQuery(job: canFailHookJob, externalData: null);
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"# Basic Query Hook Example",
style: Theme.of(context).textTheme.headline5,
),
!successQuery.hasData ||
successQuery.isLoading ||
successQuery.isRefetching
? const CircularProgressIndicator()
: Row(
children: [
Text(successQuery.data!),
ElevatedButton(
child: const Text("Refetch"),
onPressed: () async {
await successQuery.refetch();
},
),
],
),
!canFailQuery.hasData ||
canFailQuery.isLoading ||
canFailQuery.isRefetching
? const CircularProgressIndicator()
: Row(
children: [
if (canFailQuery.hasError)
Text(
"${canFailQuery.error}. Retrying: ${canFailQuery.retryAttempts}",
),
if (canFailQuery.hasData)
Text(
"Success after ${canFailQuery.retryAttempts}\nData: ${canFailQuery.data}",
),
ElevatedButton(
child: const Text("Refetch"),
onPressed: () async {
await canFailQuery.refetch();
},
),
],
)
],
);
}
}
@@ -0,0 +1,43 @@
import 'package:fl_query/fl_query.dart';
import 'package:fl_query_hooks/fl_query_hooks.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
final lazyHookQueryJob = QueryJob<String, String>(
queryKey: "lazy-hook-query",
enabled: false,
task: (queryKey, data) {
return Future.delayed(const Duration(milliseconds: 500),
() => "Result: key=$queryKey value=$data");
},
);
class LazyHookQueryExample extends HookWidget {
const LazyHookQueryExample({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
final query = useQuery(
job: lazyHookQueryJob,
externalData: "Love",
);
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"# Lazy Hook Query Example",
style: Theme.of(context).textTheme.headline5,
),
Row(
children: [
Text("Current Data: ${query.data ?? "Loading"}"),
ElevatedButton(
child: const Text("Refetch Query"),
onPressed: () => query.refetch(),
),
],
),
],
);
}
}
@@ -0,0 +1,50 @@
import 'dart:math';
import 'package:fl_query/fl_query.dart';
import 'package:fl_query_hooks/fl_query_hooks.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
final mutationHookVariableKeyJob = MutationJob.withVariableKey<String, double>(
preMutationKey: "mutation-example",
task: (queryKey, variables) {
return Future.value("$variables");
},
);
class MutationHookVariableKeyExample extends HookWidget {
const MutationHookVariableKeyExample({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
final id = useState(Random().nextDouble());
final mutation = useMutation(
job: mutationHookVariableKeyJob(id.value.toString()),
);
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"# Mutation Hook Variable Key Example",
style: Theme.of(context).textTheme.headline5,
),
Row(
children: [
Text("${mutation.mutationKey} Result: ${mutation.data}"),
ElevatedButton(
child: const Text("Generate Random Data"),
onPressed: () {
mutation.mutate(Random().nextDouble());
},
),
ElevatedButton(
child: const Text("New Mutation"),
onPressed: () {
id.value = Random().nextDouble();
},
),
],
),
],
);
}
}
@@ -0,0 +1,58 @@
import 'dart:math';
import 'package:fl_query/fl_query.dart';
import 'package:fl_query_hooks/fl_query_hooks.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
final queryHookExternalDataJob = QueryJob<String, double>(
queryKey: "query-hook-external-data",
cacheTime: const Duration(seconds: 10),
task: (queryKey, data) {
return Future.delayed(const Duration(milliseconds: 500),
() => "Hello from $queryKey with $data");
},
);
class QueryHookExternalDataExample extends HookWidget {
const QueryHookExternalDataExample({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
final externalData = useState(Random().nextDouble() * 200);
final query = useQuery(
job: queryHookExternalDataJob,
externalData: externalData.value,
);
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"# Query Hook With External Data Example",
style: Theme.of(context).textTheme.headline5,
),
query.isLoading || query.isRefetching || !query.hasData
? const CircularProgressIndicator()
: Row(
children: [
Container(
width: query.externalData,
height: query.externalData,
decoration: const BoxDecoration(
shape: BoxShape.circle,
color: Colors.blue,
),
child: Center(child: Text(query.externalData.toString())),
),
ElevatedButton(
child: const Text("New Id"),
onPressed: () {
externalData.value = Random().nextDouble() * 200;
},
)
],
)
],
);
}
}
@@ -0,0 +1,62 @@
import 'dart:convert';
import 'package:fl_query/fl_query.dart';
import 'package:fl_query_hooks/fl_query_hooks.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.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 QueryHookPreviousDataExample extends HookWidget {
const QueryHookPreviousDataExample({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
final id = useState(1);
final query =
useQuery(job: todoJob(id.value.toString()), externalData: null);
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"# Query Variable Key with keepPreviousData",
style: Theme.of(context).textTheme.headline5,
),
if (query.hasError)
Text(query.error.toString())
else if (!query.hasData)
const CircularProgressIndicator()
else
Text(jsonEncode(query.data ?? {})),
Row(
children: [
IconButton(
icon: const Icon(Icons.remove),
onPressed: () {
id.value -= 1;
},
),
IconButton(
icon: const Icon(Icons.add),
onPressed: () {
id.value += 1;
},
),
],
)
],
);
}
}
@@ -0,0 +1,49 @@
import 'dart:math';
import 'package:fl_query/fl_query.dart';
import 'package:fl_query_hooks/fl_query_hooks.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
final queryHookVariableKeyJob =
QueryJob.withVariableKey<String, void>(task: (queryKey, externalData) {
return Future.delayed(
const Duration(milliseconds: 500),
() => "QueryKey:${queryKey.split("#").last}",
);
});
class QueryHookVariableKeyExample extends HookWidget {
const QueryHookVariableKeyExample({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
final id = useState(Random().nextDouble() * 200);
final query = useQuery<String, void>(
job: queryHookVariableKeyJob("hook-variable-query#${id.value}"),
externalData: null,
);
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"# Query Hook Variable Example",
style: Theme.of(context).textTheme.headline5,
),
query.isLoading || query.isRefetching || !query.hasData
? const CircularProgressIndicator()
: Row(
children: [
Text("Query Result: ${query.data}"),
ElevatedButton(
child: const Text("New Id"),
onPressed: () {
id.value = Random().nextDouble() * 200;
},
),
],
)
],
);
}
}
@@ -0,0 +1,66 @@
import 'package:fl_query_hooks_example/components/basic_hook_mutation.dart';
import 'package:fl_query_hooks_example/components/basic_hook_query.dart';
import 'package:fl_query_hooks_example/components/lazy_hook_query.dart';
import 'package:fl_query_hooks_example/components/mutation_hook_variable_key.dart';
import 'package:fl_query_hooks_example/components/query_hook_external_data.dart';
import 'package:fl_query_hooks_example/components/query_hook_previous_data.dart';
import 'package:fl_query_hooks_example/components/query_hook_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: 'Fl-Query Hooks Example',
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 Hooks Example"),
),
body: SingleChildScrollView(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
children: const [
BasicHookQueryExample(),
QueryHookExternalDataExample(),
LazyHookQueryExample(),
QueryHookVariableKeyExample(),
QueryHookPreviousDataExample(),
Divider(),
BasicHookMutationExample(),
MutationHookVariableKeyExample(),
],
),
)),
);
}
}