diff --git a/example/app.tsx b/example/app.tsx index c785b1f..263eb16 100644 --- a/example/app.tsx +++ b/example/app.tsx @@ -9,7 +9,13 @@ export default ()=> { return
-

Title!!

+ + +

Title!!

suspended:

Loading!
}> diff --git a/example/deep/component.tsx b/example/deep/component.tsx index a93ae9a..7fa1bf2 100644 --- a/example/deep/component.tsx +++ b/example/deep/component.tsx @@ -7,7 +7,7 @@ export default ()=> const [routeGet, routeSet] = Iso.Router.Consumer(); type CatFact = {fact:string, length:number}|undefined; - const [Data, Updating] = Iso.Fetch.Use(`https://catfact.ninja/fact`, undefined, 60, true, true, true); + const [Data, Updating] = Iso.Fetch.Use(`https://catfact.ninja/fact`); console.log("render!!") @@ -15,7 +15,7 @@ export default ()=> return
Component Route is: {routeGet.Path.toString()} - + a link

Data:{Data && (Data as CatFact)?.fact}

Status:{Updating?'loading':'done'}

diff --git a/lib/iso.tsx b/lib/iso.tsx index 2989821..1bb54ea 100644 --- a/lib/iso.tsx +++ b/lib/iso.tsx @@ -160,7 +160,8 @@ export const Switch =({children}:{children:Children})=> export const Case =({children, value}:{children:Children, value?:string, default?:true})=>null; export const useRouteVars =()=> React.useContext(SwitchContext).keys; -export type FetchRecord = {URL:string, CacheFor:number, CachedAt:number, CacheOnServer:boolean, Promise?:Promise, DelaySSR:boolean, Seed:boolean, Error?:string, JSON?:object}; +export type FetchCachOptions = {CacheFor:number, CacheOnServer:boolean, DelaySSR:boolean, Seed:boolean}; +export type FetchRecord = {URL:string, Promise?:Promise, CachedAt:number, Error?:string, JSON?:object} & FetchCachOptions; type FetchGuide = [Record:FetchRecord, Init:boolean, Listen:boolean]; export type FetchHookState = [Data:undefined|object, Updating:boolean]; export const Fetch = { @@ -175,7 +176,8 @@ export const Fetch = { Fetch.Cache.set(r.URL, r) }); }, - Request(URL:string, Init?:RequestInit, CacheFor:number = 60, CacheOnServer:boolean = true, DelaySSR:boolean = true, Seed:boolean = true):FetchGuide + DefaultOptions:{CacheFor:60, CacheOnServer:true, DelaySSR:true, Seed:true} as FetchCachOptions, + Request(URL:string, Init?:RequestInit|null, CacheFor:number = 60, CacheOnServer:boolean = true, DelaySSR:boolean = true, Seed:boolean = true):FetchGuide { let check = Fetch.Cache.get(URL); @@ -183,7 +185,7 @@ export const Fetch = { { Fetch.Cache.set(URL, inCheck); inCheck.CachedAt = 0; - inCheck.Promise = fetch(URL, Init).then(resp=>resp.json()).then((json)=>{ + inCheck.Promise = fetch(URL, Init?Init:undefined).then(resp=>resp.json()).then((json)=>{ inCheck.JSON = json; inCheck.CachedAt = new Date().getTime(); console.log(`...cached!`); @@ -231,13 +233,15 @@ export const Fetch = { } }, - Use(URL:string, Init?:RequestInit, CacheFor:number = 60, CacheOnServer:boolean = true, DelaySSR:boolean = true, Seed:boolean = true) + + Use(URL:string, Init?:RequestInit|null, Options?:FetchCachOptions) { - const [receipt, init, listen] = Fetch.Request(URL, Init, CacheFor, CacheOnServer, DelaySSR, Seed); + const config = {...Fetch.DefaultOptions, ...Options}; + const [receipt, init, listen] = Fetch.Request(URL, Init, config.CacheFor, config.CacheOnServer, config.DelaySSR, config.Seed); const initialState:FetchHookState = init ? [receipt.JSON, listen] : [undefined, true]; const [cacheGet, cacheSet] = React.useState(initialState); - if(Fetch.ServerBlocking && Fetch.ServerTouched && DelaySSR) // if server-side rendering + if(Fetch.ServerBlocking && Fetch.ServerTouched && config.DelaySSR) // if server-side rendering { if(listen) // if the request is pending {