-
-
Notifications
You must be signed in to change notification settings - Fork 112
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #31 from TravisFrankMTG/master
Fixed client-side cache to use state
- Loading branch information
Showing
7 changed files
with
149 additions
and
137 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,82 +1,82 @@ | ||
| import React from 'https://dev.jspm.io/[email protected]'; | ||
|
|
||
| import clientStorage from './clientStorage.js'; | ||
|
|
||
| import React from 'https://dev.jspm.io/[email protected]'; // from deps | ||
| // import clientStorage from 'https://deno.land/x/[email protected]/ObsidianWrapper/clientStorage.js'; | ||
| import normalizeResult from '../src/normalize.js'; | ||
| import destructureQueries from '../src/destructureQueries.js'; | ||
|
|
||
|
|
||
| // Context will be used to create a custom provider for the application | ||
| export const cacheContext = React.createContext(); | ||
|
|
||
| // Declaration of custom Obsidian Wrapper | ||
| function ObsidianWrapper(props) { | ||
|
|
||
| const [cache, setCache] = React.useState(clientStorage); | ||
|
|
||
| const [cache, setCache] = React.useState({}); | ||
| // Primary function, provides access to fetching and caching capabilities | ||
| async function fetcher(query, options = {}) { | ||
| console.log('initial state', window.__INITIAL_STATE__.obsidianSchema) | ||
| const obsidianSchema = window.__INITIAL_STATE__.obsidianSchema; | ||
| // Desctructuring of optional parameters, default values are defined and may be over written | ||
| const { endpoint = '/graphql', pollInterval = null } = options; | ||
|
|
||
| /* COMMENT OUT THESE LINES FOR SERVER CACHE */ | ||
| const obsidianReturn = await destructureQueries(query, obsidianSchema); | ||
| // // Conditional to check if query is stored in global cache | ||
| if (obsidianReturn) { | ||
| console.log('--------------'); | ||
| console.log('Found it in the cache!!'); | ||
| console.log('--------------'); | ||
| // Returning cached response as a promise | ||
| return new Promise( | ||
| (resolve, reject) => resolve(obsidianReturn) | ||
| // This can be uncommeted to store cache in session storage | ||
| // resolve(JSON.parse(sessionStorage.getItem(query))) | ||
| ); | ||
| } | ||
| // If not found in cache, query is excecuted | ||
| else { | ||
| console.log(cache); | ||
|
|
||
| // Desctructuring of optional parameters, default values are defined and may be over written | ||
| const { | ||
| endpoint = '/graphql', | ||
| pollInterval = null, | ||
| destructure = true, | ||
| } = options; | ||
| if (destructure) { | ||
| const obsidianSchema = window.__INITIAL_STATE__.obsidianSchema; | ||
| /* COMMENT OUT THESE LINES FOR SERVER CACHE */ | ||
|
|
||
| // Conditional check, if poll interval has been defined | ||
| if (pollInterval) { | ||
| console.log( | ||
| `Setting ${ | ||
| pollInterval / 1000 | ||
| } second poll interval for graphql request` | ||
| const deepCache = Object.assign({}, cache); | ||
| const obsidianReturn = await destructureQueries(query, obsidianSchema, deepCache); | ||
| // // Conditional to check if query is stored in global cache | ||
| if (obsidianReturn) { | ||
| console.log('--------------'); | ||
| console.log('Found it in the cache!!'); | ||
| console.log('--------------'); | ||
| // Returning cached response as a promise | ||
| return new Promise( | ||
| (resolve, reject) => resolve(obsidianReturn) | ||
| // This can be uncommeted to store cache in session storage | ||
| // resolve(JSON.parse(sessionStorage.getItem(query))) | ||
| ); | ||
| // Initiation of reocurring fetch request | ||
| setInterval(() => { | ||
| console.log('--------------'); | ||
| console.log('Fetching query with poll interval'); | ||
| fetchData(query, endpoint); | ||
| }, pollInterval); | ||
| } | ||
| console.log('--------------'); | ||
| console.log('Fetching Data'); | ||
| // Excection of fetch | ||
| return await fetchData(query, endpoint); | ||
| } else { | ||
| if (cache[query]) { | ||
| console.log('--------------'); | ||
| console.log('Found it in the cache!!'); | ||
| console.log('--------------'); | ||
| return new Promise((resolve, reject) => resolve(cache[query])); | ||
| } | ||
| } | ||
| // If not found in cache, query is excecuted | ||
| /* COMMENT OUT THESE LINES FOR SERVER CACHE */ | ||
| // Conditional check, if poll interval has been defined | ||
| if (pollInterval) { | ||
| console.log( | ||
| `Setting ${ | ||
| pollInterval / 1000 | ||
| } second poll interval for graphql request` | ||
| ); | ||
| // Initiation of reocurring fetch request | ||
| setInterval(() => { | ||
| console.log('--------------'); | ||
| console.log('Fetching query with poll interval'); | ||
| fetchData(query, endpoint); | ||
| }, pollInterval); | ||
| } | ||
| console.log('--------------'); | ||
| console.log('Fetching Data'); | ||
| // Excection of fetch | ||
| return await fetchData(query, endpoint, destructure); | ||
| /* COMMENT OUT THESE LINES FOR SERVER CACHE */ | ||
| /* COMMENT OUT THESE LINES FOR SERVER CACHE */ | ||
| } | ||
| // Function to update the global cache with new response data | ||
| function updateCache(query, response) { | ||
| console.log('BEFORE: ', cache); | ||
| // Declaring new object with new data to store in cache | ||
| const newObj = Object.assign(cache, { [query]: response }); | ||
| // React hook to update global cache object | ||
| setCache(newObj); | ||
| console.log('AFTER: ', newObj); | ||
| console.log('CACHEEE: ', cache); | ||
| // Can be uncommeted to store data in session storage | ||
| // sessionStorage.setItem(query, JSON.stringify(response)); | ||
| } | ||
| // Excecutes graphql fetch request | ||
| async function fetchData(query, endpoint) { | ||
| const obsidianSchema = window.__INITIAL_STATE__.obsidianSchema; | ||
| async function fetchData(query, endpoint, destructure) { | ||
| try { | ||
| const respJSON = await fetch(endpoint, { | ||
| method: 'POST', | ||
|
|
@@ -88,11 +88,22 @@ function ObsidianWrapper(props) { | |
| }); | ||
| const resp = await respJSON.json(); | ||
| // Excecute function to update the cache with new response | ||
|
|
||
| /* COMMENT OUT THESE LINES FOR SERVER CACHE */ | ||
| normalizeResult(query, resp, obsidianSchema); | ||
| /* COMMENT OUT THESE LINES FOR SERVER CACHE */ | ||
|
|
||
| if (destructure) { | ||
| const obsidianSchema = window.__INITIAL_STATE__.obsidianSchema; | ||
| /* COMMENT OUT THESE LINES FOR SERVER CACHE */ | ||
| const deepCache = Object.assign({}, cache); | ||
| normalizeResult(query, resp, obsidianSchema, deepCache) | ||
| .then(updatedCache => { | ||
| for (let key in updatedCache) { | ||
| for (let hash in updatedCache[key]) { | ||
| updateCache(hash, updatedCache[key][hash]); | ||
| } | ||
| } | ||
| }); | ||
| /* COMMENT OUT THESE LINES FOR SERVER CACHE */ | ||
| } else { | ||
| updateCache(query, resp); | ||
| } | ||
| return resp; | ||
| } catch (e) { | ||
| console.log(e); | ||
|
|
||
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.