Skip to content

Commit

Permalink
Updated README - _ref workarounds with sanity source plugin
Browse files Browse the repository at this point in the history
  • Loading branch information
kmcaloon committed May 18, 2020
1 parent 280d74d commit f95c277
Showing 1 changed file with 25 additions and 3 deletions.
28 changes: 25 additions & 3 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ https://drive.google.com/file/d/1FVch2HbAWk1TEXph1katiNb1uuaBLSHf/view?usp=shari
- Replicates Gatsby's beloved patterns
- GROQ-based page queries with HMR
- GROQ-based static queries with live reloads
- Leverages GROQ's native functionality for advanced querying, node/document projections, joins (see [limitations](#joins)), etc,
- Leverages GROQ's native functionality for advanced querying, node/document projections, joins (see [limitations](#limitations)), etc,
- String interpolation ("fragments") within queries, much more flexible than GraphQL fragments
- GROQ explorer in browser during development at `locahost:8000/__groq` **(TO DO)**
- Optimized for incremental builds on Cloud and OSS **(TO DO)**
Expand Down Expand Up @@ -63,7 +63,7 @@ export function() {
```
5. For more flexibility and advanced usage check out [Fragments](#fragments)

**NOTE: If using joins, please see [limitations](#joins)**
**NOTE: If using joins or the gatsby-source-sanity plugin, please see [limitations](#limitations)**

## 🤔 What is This? <a name="introduction"></a>
Gatsby is an amazing tool that has helped advance modern web development in significant ways. While many love it for its magical frontend concoction of static generation and rehydration via React, easy routing, smart prefetching, image rendering, etc., one of the key areas where it stands out from other similar tools is its GraphQL data layer. This feature is a large part of why some developers love Gatsby and why others choose to go in another direction. Being able to source data from multiple APIs, files, etc. and compile them altogether into a queryable GraphQL layer is ***amazing***, but many developers simply don't enjoy working with GraphQL. This is where GROQ comes in.
Expand Down Expand Up @@ -142,12 +142,34 @@ To use GROQ fragments with this plugin, for now all fragments must be exported f

**That should cover most of it. Check the comments within code for more details.**

## 🤦 Limitations
## 🤦 Limitations <a name="limitations"></a>
### Joins <a name="joins"></a>
Apart from references to assets such as images within Sanity datasets, the shorthand join syntax using the `->` operator is not supported. This is primarily related to the GROQ js client but may change in the future. Until then use the "Other Joins" syntaxes as documented [here](https://www.sanity.io/docs/groq-joins).

Here is an example needing to match a `_ref` found within an array of objects: https://groq.dev/oLIs5ABtnM0xrG9aSSJBYg

### Usage with gatsby-source-sanity
For every `_ref` field within your documents, the source plugin injects the referenced document's GraphQL node id instead of its default `_id` value. This means that whenever you are trying to match `_ref` values to documents you need to use the `id` field instead of `_id`.

So instead of what you are used to:
```
{
...,
"document: *[ _id == ^._ref ] {
...
}[0]
}
```
You would use this:
```
{
...,
"document: *[ id == ^._ref ] {
...
}[0]
}
```
If you are using the source plugin and running issues into issues with your joins, if all else fails try double checking your queries and make sure you are matching every `_ref` to the actual node `id`.

## ⌛ TO DO (random order)
- ~~Get rid of relative directories~~
Expand Down

0 comments on commit f95c277

Please sign in to comment.