https://app.takeshape.io/docs/assets/js/991a8608.eb6280b3.js

1"use strict";(self.webpackChunk_takeshape_docs=self.webpackChunk_takeshape_docs||[]).push([[6141],{16915:(e,n,t)=>{t.r(n),t.d(n,{assets:()=>d,contentTitle:()=>h,default:()=>c,frontMatter:()=>o,metadata:()=>r,toc:()=>g});var r=t(35332),i=t(65723),a=t(16585),s=t(88725),l=t(75778);const o={title:"How to: Filtering",description:'The new "where" filter for GraphQL queries is a powerful way to filter content',slug:"weve-made-filtering-way-easier/",authors:"mark",tags:["graphql","filtering","queries"],date:new Date("2020-06-25T00:00:00.000Z")},h=void 0,d={authorsImageUrls:[void 0]},g=[{value:"Filters",id:"filters",level:2}];function p(e){const n={blockquote:"blockquote",code:"code",h2:"h2",p:"p",pre:"pre",...(0,a.R)(),...e.components};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsxs)(n.blockquote,{children:["\n",(0,i.jsx)(n.p,{children:"The \u201cwhere\u201d parameter for GraphQL queries opens up a whole new word of possibilities for filtering. This is a huge improvement to how filtering works with the GraphQL API."}),"\n"]}),"\n",(0,i.jsx)(s.A,{alt:"Code completion of properties and operators in the API Explorer makes it easy to write and test filters.",img:t(44864)}),"\n",(0,i.jsx)(n.h2,{id:"filters",children:"Filters"}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-graphql",metastring:'title="Logic Operators"',children:'# AND, OR, NOT\n\n{\n  "where": {\n    "OR": [\n      {\n        "title": {\n          "match": "engineer"\n        }\n      },\n      {\n        "NOT": {\n          "hotJob": {\n            "eq": true\n          }\n        }\n      }\n    ]\n  }\n}\n'})}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-graphql",metastring:'title="Comparison Operators"',children:'# eq, in, gt, gte, lt, lte, match, regexp\n\n{\n  "where": {\n    "book_image": {\n      "filename": {\n        "match": "my-file"\n      }\n    },\n    "post_image": {\n      "regexp": ".*.png"\n    }\n  }\n}\n'})}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-graphql",metastring:'title="Dates"',children:'# yyyy-mm-dd - ISO 8601\n\n{\n  "where": {\n    "title": {\n      "in": ["Front-End Developer", "Engineering Manager"]\n    },\n    "_createdAt": {\n      "gte": "now-1w"\n    }\n  }\n}\n'})}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-graphql",metastring:'title="Relationships and Workflows"',children:'# Workflow\n\n{\n  "where": {\n    "_status": {\n      "gt": "draft",\n      "lt": "published"\n    }\n  }\n}\n'})}),"\n",(0,i.jsxs)(n.p,{children:["Check out the ",(0,i.jsx)(l.A,{path:"/docs/api/where-filter",children:"full documentation"})," for more information. ",(0,i.jsx)(l.A,{path:"/login",children:"Log in"})," and try out the new where filtering right in the API explorer."]})]})}function c(e={}){const{wrapper:n}={...(0,a.R)(),...e.components};return n?(0,i.jsx)(n,{...e,children:(0,i.jsx)(p,{...e})}):p(e)}},35332:e=>{e.exports=JSON.parse('{"permalink":"/docs/guides/weve-made-filtering-way-easier/","source":"@site/guides/general/how-to-filtering/index.mdx","title":"How to: Filtering","description":"The new \\"where\\" filter for GraphQL queries is a powerful way to filter content","date":"2020-06-25T00:00:00.000Z","tags":[{"inline":true,"label":"graphql","permalink":"/docs/guides/tags/graphql"},{"inline":true,"label":"filtering","permalink":"/docs/guides/tags/filtering"},{"inline":true,"label":"queries","permalink":"/docs/guides/tags/queries"}],"readingTime":0.87,"hasTruncateMarker":true,"authors":[{"name":"Mark Catalano","title":"Founder & CEO","email":"[email protected]","imageURL":"https://github.com/mcat.png","key":"mark","page":null}],"frontMatter":{"title":"How to: Filtering","description":"The new \\"where\\" filter for GraphQL queries is a powerful way to filter content","slug":"weve-made-filtering-way-easier/","authors":"mark","tags":["graphql","filtering","queries"],"date":"2020-06-25T00:00:00.000Z"},"unlisted":false,"prevItem":{"title":"How to use Tailwind CSS","permalink":"/docs/guides/how-to-use-tailwind-css/"}}')},44864:(e,n,t)=>{t.r(n),t.d(n,{default:()=>r});const r=t.p+"assets/images/where-filter-demo-filtering-3b30d21d882f27d9cbac78f311ff5019.gif"},75778:(e,n,t)=>{t.d(n,{A:()=>a});var r=t(217),i=t(65723);const a=({path:e,children:n})=>{const{siteConfig:t}=(0,r.A)(),a=t.customFields?.branding?.appUrlBase;return n?(0,i.jsx)("a",{href:`${a}${e}`,children:n}):(0,i.jsx)("a",{href:`${a}${e}`,children:a+e})}}}]);