add filter option to orderableDocumentListDeskItem

README.md

@@ -36,6 +36,7 @@ export default () =>
       // Optional configuration
       orderableDocumentListDeskItem({
         type: 'project',
+        filter: `'e-fca35c8b2edc19f66675e200d2b376b8' in teamMembers[]._ref`
         title: 'Projects',
         icon: Paint
       }),
@@ -97,7 +98,6 @@ To get this first version out the door there are few configuration settings and
 
 - The `name` of the `orderRank` field is constant
 - The ability to only sort across _all_ Documents of a `type`
-- The absence of a `filter` configuration on the Document List
 
 Feedback and PRs welcome :)
 

src/DocumentListQuery.js

@@ -11,13 +11,13 @@ const client = sanityClient.withConfig({
   apiVersion: '2021-09-01',
 })
 
-export default function DocumentListQuery({type}) {
+export default function DocumentListQuery({type, filter}) {
   const [isLoading, setIsLoading] = useState(true)
   const [listIsUpdating, setListIsUpdating] = useState(false)
   const [data, setData] = useState([])
 
   useEffect(() => {
-    const query = `*[_type == $type]|order(@[$order] asc){
+    const query = `*[_type == $type ${filter ? '&&' + filter : ''}]|order(@[$order] asc){
       _id, _type, ${ORDER_FIELD_NAME}
     }`
     const queryParams = {type, order: ORDER_FIELD_NAME}
@@ -99,4 +99,5 @@ export default function DocumentListQuery({type}) {
 
 DocumentListQuery.propTypes = {
   type: PropTypes.string.isRequired,
+  type: PropTypes.string
 }

src/DocumentListWrapper.js

@@ -12,7 +12,7 @@ import Feedback from './Feedback'
 
 // 1. Validate first that the schema has been configured for ordering
 // 2. Setup context for showIncrements
-export default function DocumentListWrapper({type, showIncrements, resetOrderTransaction}) {
+export default function DocumentListWrapper({type, filter, showIncrements, resetOrderTransaction}) {
   const toast = useToast()
 
   useEffect(() => {
@@ -76,14 +76,15 @@ export default function DocumentListWrapper({type, showIncrements, resetOrderTra
 
   return (
     <OrderableContext.Provider value={{showIncrements}}>
-      <DocumentListQuery type={type} />
+      <DocumentListQuery type={type} filter={filter}/>
     </OrderableContext.Provider>
   )
 }
 
 DocumentListWrapper.propTypes = {
   showIncrements: PropTypes.bool.isRequired,
   type: PropTypes.string.isRequired,
+  filter: PropTypes.string,
   resetOrderTransaction: PropTypes.shape({
     title: PropTypes.string,
     status: PropTypes.string,

src/OrderableDocumentList.js

@@ -9,6 +9,7 @@ export default class OrderableDocumentList extends Component {
   static propTypes = {
     options: PropTypes.shape({
       type: PropTypes.string,
+      filter: PropTypes.string
     }).isRequired,
   }
 
@@ -56,6 +57,7 @@ export default class OrderableDocumentList extends Component {
     return (
       <DocumentListWrapper
         type={this?.props?.options?.type}
+        filter={this?.props?.options?.filter}
         showIncrements={this.state.showIncrements}
         resetOrderTransaction={this.state.resetOrderTransaction}
       />

src/desk-structure/orderableDocumentListDeskItem.js

@@ -13,7 +13,7 @@ export function orderableDocumentListDeskItem(config = {}) {
     `)
   }
 
-  const {type, title, icon} = config
+  const {type, filter, title, icon} = config
 
   const listTitle = title ?? `Orderable ${type}`
   const listId = `orderable-${type}`
@@ -33,7 +33,7 @@ export function orderableDocumentListDeskItem(config = {}) {
 
         type: 'component',
         component: OrderableDocumentList,
-        options: {type},
+        options: {type, filter},
         menuItems: [
           S.menuItem()
             .title(`Create new ${typeTitle}`)