Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
35 changes: 17 additions & 18 deletions ObsidianWrapper/ObsidianWrapper.jsx
Original file line number Diff line number Diff line change
@@ -1,30 +1,30 @@
import React from "https://dev.jspm.io/react";
import BrowserCache from "../src/Browser/CacheClassBrowser.js";
import { insertTypenames } from "../src/Browser/insertTypenames.js";
import React from 'https://dev.jspm.io/react';
import BrowserCache from '../src/Browser/CacheClassBrowser.js';
import { insertTypenames } from '../src/Browser/insertTypenames.js';

const cacheContext = React.createContext();

function ObsidianWrapper(props) {
const [cache, setCache] = React.useState(new BrowserCache());

// You have to put your Google Chrome Obsidian developer tool extension id to connect Obsidian Wrapper with dev tool
const chromeExtensionId = "dkbfipkapkljpdbhdihnlnbieffhjdmh";
window.localStorage.setItem("cache", JSON.stringify(cache));
const chromeExtensionId = 'apcpdmmbhhephobnmnllbklplpaoiemo';
window.localStorage.setItem('cache', JSON.stringify(cache));

async function query(query, options = {}) {
// dev tool messages
const startTime = Date.now();
chrome.runtime.sendMessage(chromeExtensionId, { query: query });
chrome.runtime.sendMessage(chromeExtensionId, {
cache: window.localStorage.getItem("cache"),
cache: window.localStorage.getItem('cache'),
});
console.log(
"Here's the message content: ",
window.localStorage.getItem("cache")
window.localStorage.getItem('cache')
);
// set the options object default properties if not provided
const {
endpoint = "/graphql",
endpoint = '/graphql',
cacheRead = true,
cacheWrite = true,
pollInterval = null,
Expand All @@ -50,7 +50,6 @@ function ObsidianWrapper(props) {
// when the developer decides to only utilize whole query for cache
if (wholeQuery) resObj = await cache.readWholeQuery(query);
else resObj = await cache.read(query);
console.log("query function resObj: ", resObj);
// check if query is stored in cache
if (resObj) {
// returning cached response as a promise
Expand All @@ -74,10 +73,10 @@ function ObsidianWrapper(props) {
try {
// send fetch request with query
const resJSON = await fetch(endpoint, {
method: "POST",
method: 'POST',
headers: {
"Content-Type": "application/json",
Accept: "application/json",
'Content-Type': 'application/json',
Accept: 'application/json',
},
body: JSON.stringify({ query }),
});
Expand Down Expand Up @@ -117,7 +116,7 @@ function ObsidianWrapper(props) {
const startTime = Date.now();
mutation = insertTypenames(mutation);
const {
endpoint = "/graphql",
endpoint = '/graphql',
cacheWrite = true,
toDelete = false,
update = null,
Expand Down Expand Up @@ -153,7 +152,7 @@ function ObsidianWrapper(props) {
}
// always write/over-write to cache (add/update)
// GQL call to make changes and synchronize database
console.log("WriteThrough - true ", responseObj);
console.log('WriteThrough - true ', responseObj);
const addOrUpdateMutationResponseTime = Date.now() - startTime;
chrome.runtime.sendMessage(chromeExtensionId, {
addOrUpdateMutationResponseTime: addOrUpdateMutationResponseTime,
Expand All @@ -165,10 +164,10 @@ function ObsidianWrapper(props) {

// use cache.write instead of cache.writeThrough
const responseObj = await fetch(endpoint, {
method: "POST",
method: 'POST',
headers: {
"Content-Type": "application/json",
Accept: "application/json",
'Content-Type': 'application/json',
Accept: 'application/json',
},
body: JSON.stringify({ query: mutation }),
}).then((resp) => resp.json());
Expand All @@ -184,7 +183,7 @@ function ObsidianWrapper(props) {
}
// third behaviour just for normal update (no-delete, no update function)
cache.write(mutation, responseObj);
console.log("WriteThrough - false ", responseObj);
console.log('WriteThrough - false ', responseObj);
return responseObj;
}
} catch (e) {
Expand Down
92 changes: 53 additions & 39 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,9 @@

## Features

- (New!) Server-side cache invalidation only on affected entries
- (New!) Flexible cache responds with only data requested from selected fields
- (New!) Developer tool for Obsidian is now updated to Manifest version 3 and invalid Bootstrap module imports were also fixed along with CodeMirror dependencies
- GraphQL query abstraction and caching improving the performance of your app
- SSR React wrapper, allowing you to cache in browser
- Configurable caching options, giving you complete control over your cache
Expand All @@ -36,7 +39,6 @@ Obsidian is Deno's first native GraphQL caching client and server module. Boasti

With additional support for use in server-side rendered React apps built with Deno, full stack integration of Obsidian enables a fast and flexible caching solution.


## Installation

<div align="center"><strong>QUICK START</strong></div>
Expand All @@ -47,29 +49,31 @@ With additional support for use in server-side rendered React apps built with De
```javascript
import { Application, Router } from 'https://deno.land/x/oak@v6.0.1/mod.ts';
import { ObsidianRouter, gql } from 'https://deno.land/x/obsidian/mod.ts';
import { resolvers } from './ import from your resolvers file'
import { types } from './ import your schema/types from schema/types file'

import { resolvers } from './ import from your resolvers file';
import { types } from './ import your schema/types from schema/types file';

interface ObsRouter extends Router {
obsidianSchema?: any;
}

const GraphQLRouter = await ObsidianRouter<ObsRouter>({
Router,
typeDefs: types,
resolvers: resolvers,
redisPort: 6379, //Desired redis port
useCache: true, //Boolean to toggle all cache functionality
usePlayground: true, //Boolean to allow for graphQL playground
useQueryCache: true, //Boolean to toogle full query cache
useRebuildCache: true, //Boolean to toggle rebuilding from normalized data
customIdentifier: ["id", "__typename"]

});
const GraphQLRouter =
(await ObsidianRouter) <
ObsRouter >
{
Router,
typeDefs: types,
resolvers: resolvers,
redisPort: 6379, //Desired redis port
useCache: true, //Boolean to toggle all cache functionality
usePlayground: true, //Boolean to allow for graphQL playground
useQueryCache: true, //Boolean to toogle full query cache
useRebuildCache: true, //Boolean to toggle rebuilding from normalized data
customIdentifier: ['id', '__typename'],
mutationTableMap = {}, //Object where keys are add mutation types and value is an array of affected tables (e.g. {addPlants: ['plants'], addMovie: ['movies']})
};

// attach the graphql routers routes to our app
app.use(GraphQLRouter.routes(), GraphQLRouter.allowedMethods());
app.use(GraphQLRouter.routes(), GraphQLRouter.allowedMethods());
```

## Creating the Wrapper
Expand Down Expand Up @@ -151,51 +155,61 @@ const MovieApp = () => {
```

## Documentation

[obsidian.land](http://obsidian.land)

## Developer Tool
information and instructions on how to use our developer tool can be found here <br/>

Information and instructions on how to use our developer tool can be found here <br/>
works with Obsidian 5.0 <br/>
[oslabs-beta/obsidian-developer-tool](https://github.com/oslabs-beta/obsidian-developer-tool)

## Obsidian 5.0 Demo
github for a demo with some example code to play with: <br/>

Github for a demo with some example code to play with: <br/>
[oslabs-beta/obsidian-demo-5.0](https://github.com/oslabs-beta/obsidian-demo-5.0)

## Dockerized Demo
working demo to install locally in docker:

Working demo to install locally in docker:
[oslabs-beta/obsidian-demo-docker](https://github.com/oslabs-beta/obsidian-demo-docker)

## Working Example Demo Code
github for a demo with some example code to play with:
[oslabs-beta/obsidian-demo-3.2](https://github.com/oslabs-beta/obsidian-demo-3.2)
## Features In Progress

- Ability to query the database for only those fields missing from the cache
- Developer Tool Settings component, fully functioning Playground component

## Authors
[Yurii Shchyrba](https://github.com/YuriiShchyrba)
[Linda Zhao](https://github.com/lzhao15)
[Ali Fay](https://github.com/ali-fay)
[Anthony Guan](https://github.com/guananthony)
[Yasir Choudhury](https://github.com/Yasir-Choudhury)
[Yogi Paturu](https://github.com/YogiPaturu)
[Michael Chin](https://github.com/mikechin37)
[Dana Flury](https://github.com/dmflury)
[Sardor Akhmedov](https://github.com/sarkamedo)
[Christopher Berry](https://github.com/cjamesb)

[Derek Okuno](https://github.com/okunod)
[Liam Johnson](https://github.com/liamdimitri)
[Josh Reed](https://github.com/joshreed104)
[Jonathan Fangon](https://github.com/jonathanfangon)
[Liam Jeon](https://github.com/laj52)
[Yurii Shchyrba](https://github.com/YuriiShchyrba)
[Linda Zhao](https://github.com/lzhao15)
[Ali Fay](https://github.com/ali-fay)
[Anthony Guan](https://github.com/guananthony)
[Yasir Choudhury](https://github.com/Yasir-Choudhury)
[Yogi Paturu](https://github.com/YogiPaturu)
[Michael Chin](https://github.com/mikechin37)
[Dana Flury](https://github.com/dmflury)
[Sardor Akhmedov](https://github.com/sarkamedo)
[Christopher Berry](https://github.com/cjamesb)
[Olivia Yeghiazarian](https://github.com/Olivia-code)
[Michael Melville](https://github.com/meekle)
[John Wong](https://github.com/johnwongfc)
[Kyung Lee](https://github.com/kyunglee1)
[Justin McKay](https://github.com/justinwmckay)
[Michael Melville](https://github.com/meekle)
[John Wong](https://github.com/johnwongfc)
[Kyung Lee](https://github.com/kyunglee1)
[Justin McKay](https://github.com/justinwmckay)
[Patrick Sullivan](https://github.com/pjmsullivan)
[Cameron Simmons](https://github.com/cssim22)
[Raymond Ahn](https://github.com/raymondcodes)
[Alonso Garza](https://github.com/Alonsog66)
[Alonso Garza](https://github.com/Alonsog66)
[Burak Caliskan](https://github.com/CaliskanBurak)
[Matt Meigs](https://github.com/mmeigs)
[Travis Frank](https://github.com/TravisFrankMTG/)
[Lourent Flores](https://github.com/lourentflores)
[Esma Sahraoui](https://github.com/EsmaShr)
[Derek Miller](https://github.com/dsymiller)
[Eric Marcatoma](https://github.com/ericmarc159)
[Spencer Stockton](https://github.com/tonstock)
[Spencer Stockton](https://github.com/tonstock)
Loading