docs: update according to the new query bowl refactor
This commit is contained in:
@@ -3,9 +3,11 @@ title: QueryBowl Scope
|
|||||||
sidebar_position: 1
|
sidebar_position: 1
|
||||||
---
|
---
|
||||||
|
|
||||||
The first thing needed for storing any form of data is a store. QueryBowlScope is basically a `StatefulWidget` which wraps around the actual store `QueryBowl`. It is similar to `ProviderScope` in riverpod & `MultiProvider` provider. But it can be used only once at the very top level of the application
|
The first thing needed for storing any form of data is a store. QueryBowlScope is basically a `InheritedWidget` which wraps around the actual store `QueryBowl`. It is similar to `ProviderScope` in riverpod & `MultiProvider` provider. It just inject the instance of `QueryBowl` to the `BuildContext`
|
||||||
|
|
||||||
You must use wrap your `MaterialApp` or `CupertinoApp` or `FluentApp` or `MacosApp` with `QueryBowlScope`
|
You must use wrap your `MaterialApp` or `CupertinoApp` or `FluentApp` or `MacosApp` with `QueryBowlScope` for using same `QueryBowl` across all screens/routes
|
||||||
|
|
||||||
|
Or, if you want you can use `QueryBowlScope` anywhere in the Widget Tree to provide the `QueryBowl` instance to the children.
|
||||||
|
|
||||||
```dart
|
```dart
|
||||||
class MyApp extends StatelessWidget {
|
class MyApp extends StatelessWidget {
|
||||||
@@ -14,6 +16,7 @@ class MyApp extends StatelessWidget {
|
|||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return QueryBowlScope(
|
return QueryBowlScope(
|
||||||
|
bowl: QueryBowl(),
|
||||||
child: MaterialApp(
|
child: MaterialApp(
|
||||||
title: 'Fl-Query Example',
|
title: 'Fl-Query Example',
|
||||||
home: const MyHomePage(),
|
home: const MyHomePage(),
|
||||||
@@ -24,7 +27,7 @@ class MyApp extends StatelessWidget {
|
|||||||
|
|
||||||
```
|
```
|
||||||
|
|
||||||
`QueryBowlScope` has many properties that can be configured. You can configure refetch behaviors, thresholds, delays etc along with cache time
|
`QueryBowl` has many properties that can be configured. You can configure refetch behaviors, thresholds, delays etc along with cache time
|
||||||
|
|
||||||
Here I'm increasing the staleTime to 10 seconds. This means that if the data is outdated after 10 seconds & will be refetched in the background smartly when needed. The default value is 1 seconds
|
Here I'm increasing the staleTime to 10 seconds. This means that if the data is outdated after 10 seconds & will be refetched in the background smartly when needed. The default value is 1 seconds
|
||||||
|
|
||||||
@@ -35,7 +38,9 @@ class MyApp extends StatelessWidget {
|
|||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return QueryBowlScope(
|
return QueryBowlScope(
|
||||||
staleTime: Duration(seconds: 10),
|
bowl: QueryBowl(
|
||||||
|
staleTime: Duration(seconds: 10),
|
||||||
|
),
|
||||||
child: MaterialApp(
|
child: MaterialApp(
|
||||||
title: 'Fl-Query Example',
|
title: 'Fl-Query Example',
|
||||||
home: const MyHomePage(),
|
home: const MyHomePage(),
|
||||||
|
|||||||
@@ -39,6 +39,7 @@ class MyApp extends StatelessWidget {
|
|||||||
// QueryBowlScope creates a Bowl (metaphor for Collection/Store)
|
// QueryBowlScope creates a Bowl (metaphor for Collection/Store)
|
||||||
// for all the Queries & Mutations
|
// for all the Queries & Mutations
|
||||||
return QueryBowlScope(
|
return QueryBowlScope(
|
||||||
|
bowl: QueryBowl(),
|
||||||
child: MaterialApp(
|
child: MaterialApp(
|
||||||
title: 'Fl-Query Quick Start',
|
title: 'Fl-Query Quick Start',
|
||||||
theme: ThemeData(
|
theme: ThemeData(
|
||||||
|
|||||||
@@ -45,6 +45,7 @@ First wrap your `MaterialApp` with with `QueryBowlScope` widget
|
|||||||
```dart
|
```dart
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return QueryBowlScope(
|
return QueryBowlScope(
|
||||||
|
bowl: QueryBowl(),
|
||||||
child: MaterialApp(
|
child: MaterialApp(
|
||||||
title: 'Fl-Query Example App',
|
title: 'Fl-Query Example App',
|
||||||
theme: ThemeData(
|
theme: ThemeData(
|
||||||
|
|||||||
@@ -1,3 +1,4 @@
|
|||||||
|
import 'package:fl_query/src/query_bowl.dart';
|
||||||
import 'package:flutter/widgets.dart';
|
import 'package:flutter/widgets.dart';
|
||||||
|
|
||||||
abstract class BaseOperation<Data, Error> extends ChangeNotifier {
|
abstract class BaseOperation<Data, Error> extends ChangeNotifier {
|
||||||
@@ -26,7 +27,7 @@ abstract class BaseOperation<Data, Error> extends ChangeNotifier {
|
|||||||
/// storage/cache
|
/// storage/cache
|
||||||
Set<ValueKey<String>> _mounts = {};
|
Set<ValueKey<String>> _mounts = {};
|
||||||
|
|
||||||
final queryBowl;
|
final QueryBowl queryBowl;
|
||||||
|
|
||||||
BaseOperation({
|
BaseOperation({
|
||||||
required this.cacheTime,
|
required this.cacheTime,
|
||||||
|
|||||||
@@ -264,7 +264,7 @@ class QueryBowl {
|
|||||||
options,
|
options,
|
||||||
externalData: externalData,
|
externalData: externalData,
|
||||||
previousData: previousData,
|
previousData: previousData,
|
||||||
queryBowl: this as dynamic,
|
queryBowl: this,
|
||||||
);
|
);
|
||||||
query.updateDefaultOptions(
|
query.updateDefaultOptions(
|
||||||
cacheTime: cache.cacheTime,
|
cacheTime: cache.cacheTime,
|
||||||
@@ -284,7 +284,7 @@ class QueryBowl {
|
|||||||
final infiniteQuery = InfiniteQuery<T, Outside, PageParam>.fromOptions(
|
final infiniteQuery = InfiniteQuery<T, Outside, PageParam>.fromOptions(
|
||||||
options,
|
options,
|
||||||
externalData: externalData,
|
externalData: externalData,
|
||||||
queryBowl: this as dynamic,
|
queryBowl: this,
|
||||||
);
|
);
|
||||||
infiniteQuery.updateDefaultOptions(
|
infiniteQuery.updateDefaultOptions(
|
||||||
cacheTime: cache.cacheTime,
|
cacheTime: cache.cacheTime,
|
||||||
@@ -400,7 +400,7 @@ class QueryBowl {
|
|||||||
} else {
|
} else {
|
||||||
final mutation = Mutation<T, V>.fromOptions(
|
final mutation = Mutation<T, V>.fromOptions(
|
||||||
mutationJob,
|
mutationJob,
|
||||||
queryBowl: this as dynamic,
|
queryBowl: this,
|
||||||
);
|
);
|
||||||
if (onData != null) mutation.addDataListener(onData);
|
if (onData != null) mutation.addDataListener(onData);
|
||||||
if (onError != null) mutation.addErrorListener(onError);
|
if (onError != null) mutation.addErrorListener(onError);
|
||||||
|
|||||||
Reference in New Issue
Block a user