1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143
#![warn(missing_docs)]
#![forbid(unsafe_code)]
//! # About Query
//!
//!
//! Leptos Query is a asynchronous state management library for [Leptos](https://github.com/leptos-rs/leptos).
//!
//! Heavily inspired by [Tanstack Query](https://tanstack.com/query/latest/).
//!
//! Queries are useful for data fetching, caching, and synchronization with server state.
//!
//! A Query provides:
//! - caching
//! - de-duplication
//! - invalidation
//! - background refetching
//! - refetch intervals
//! - memory management with cache lifetimes
//!
//! # A Simple Example
//!
//! In the root of your App, provide a query client:
//!
//! ```rust
//! use leptos_query::*;
//! use leptos::*;
//!
//! #[component]
//! pub fn App() -> impl IntoView {
//! // Provides Query Client for entire app.
//! provide_query_client();
//!
//! // Rest of App...
//! }
//! ```
//!
//! Then make a query funciton:
//!
//! ```
//! use leptos::*;
//! use leptos_query::*;
//! use std::time::Duration;
//! use serde::*;
//!
//! // Data type.
//! #[derive(Clone, Deserialize, Serialize)]
//! struct Monkey {
//! name: String,
//! }
//!
//! // Monkey fetcher.
//! async fn get_monkey(id: String) -> Monkey {
//! todo!()
//! }
//!
//! // Query for a Monkey.
//! fn use_monkey_query(id: impl Fn() -> String + 'static) -> QueryResult<Monkey, impl RefetchFn> {
//! leptos_query::use_query(
//! id,
//! get_monkey,
//! QueryOptions {
//! default_value: None,
//! refetch_interval: None,
//! resource_option: ResourceOption::NonBlocking,
//! stale_time: Some(Duration::from_secs(5)),
//! cache_time: Some(Duration::from_secs(60)),
//! },
//! )
//! }
//!
//! ```
//!
//! Now you can use the query in any component in your app.
//!
//! ```rust
//!
//! #[component]
//! fn MonkeyView(id: String) -> impl IntoView {
//! let QueryResult {
//! data,
//! is_loading,
//! is_fetching,
//! is_stale,
//! ..
//! } = use_monkey_query(move || id.clone());
//!
//! view! {
//! // You can use the query result data here.
//! // Everything is reactive.
//! <div>
//! <div>
//! <span>"Loading Status: "</span>
//! <span>{move || { if is_loading.get() { "Loading..." } else { "Loaded" } }}</span>
//! </div>
//! <div>
//! <span>"Fetching Status: "</span>
//! <span>
//! {move || { if is_fetching.get() { "Fetching..." } else { "Idle" } }}
//! </span>
//! </div>
//! <div>
//! <span>"Stale Status: "</span>
//! <span>
//! {move || { if is_stale.get() { "Stale" } else { "Fresh" } }}
//! </span>
//! </div>
//! // Query data should be read inside a Transition/Suspense component.
//! <Transition
//! fallback=move || {
//! view! { <h2>"Loading..."</h2> }
//! }>
//! {move || {
//! data()
//! .map(|monkey| {
//! view! { <h2>{monkey.name}</h2> }
//! })
//! }}
//! </Transition>
//! </div>
//! }
//! }
//! ```
//!
mod instant;
mod query;
mod query_client;
mod query_executor;
mod query_options;
mod query_result;
mod query_state;
mod use_query;
mod util;
pub use instant::*;
use query::*;
pub use query_client::*;
pub use query_executor::*;
pub use query_options::*;
pub use query_result::*;
pub use query_state::*;
pub use use_query::*;