feat(sanity-plugin): add archived field

good-idea · Apr 16, 2020 · 6f7a0d9 · 6f7a0d9
1 parent e06332e
commit 6f7a0d9
Show file tree

Hide file tree

Showing 4 changed files with 47 additions and 3 deletions.
diff --git a/packages/sanity-plugin/src/Provider/Provider.tsx b/packages/sanity-plugin/src/Provider/Provider.tsx
@@ -83,7 +83,8 @@ export class Provider extends React.Component<
       defaultSanityClient,
       this.handleStateChange
     )
-    const { shopName, accessToken } = secrets
+
+    const { shopName, accessToken } = secrets || {}
     this.setState(
       {
         secrets: {

diff --git a/packages/sanity-plugin/src/components/ArchivedInput.tsx b/packages/sanity-plugin/src/components/ArchivedInput.tsx
@@ -0,0 +1,26 @@
+import * as React from 'react'
+
+interface ArchivedInputProps {
+  value: boolean | undefined
+}
+
+const pStyles = {
+  backgroundColor: 'rgb(236, 236, 236)',
+  padding: '10px',
+  color: 'red'
+}
+
+export class ArchivedInput extends React.Component<ArchivedInputProps> {
+  render() {
+    const { value } = this.props
+    if (value === true) {
+      return (
+        <p style={pStyles}>
+          This product no longer exists in Shopify. It has been archived here in
+          Sanity for reference.
+        </p>
+      )
+    }
+    return null
+  }
+}
diff --git a/packages/sanity-plugin/src/sanityDocuments/collection.tsx b/packages/sanity-plugin/src/sanityDocuments/collection.tsx
@@ -2,6 +2,7 @@ import * as React from 'react'
 import { SanityDocumentConfig } from '@sane-shopify/types'
 import { MissingImage } from '../icons/MissingImage'
 import { getFieldConfig } from '../utils'
+import { ArchivedInput } from '../components/ArchivedInput'
 
 const imageStyles = {
   width: '100%',
@@ -62,6 +63,12 @@ export const createCollectionDocument = ({
         hidden: true,
         ...namedFields.shopifyId
       },
+      {
+        title: 'Archived',
+        name: 'archived',
+        type: 'boolean',
+        inputComponent: ArchivedInput
+      },
       {
         title: 'Shopify Data',
         name: 'sourceData',

diff --git a/packages/sanity-plugin/src/sanityDocuments/product.tsx b/packages/sanity-plugin/src/sanityDocuments/product.tsx
@@ -3,6 +3,7 @@ import { unwindEdges } from '@good-idea/unwind-edges'
 import { SanityDocumentConfig } from '@sane-shopify/types'
 import { MissingImage } from '../icons/MissingImage'
 import { getFieldConfig } from '../utils'
+import { ArchivedInput } from '../components/ArchivedInput'
 
 export const createProductOptionValue = ({
   fields,
@@ -191,6 +192,12 @@ export const createProductDocument = ({
         hidden: true,
         ...namedFields.shopifyId
       },
+      {
+        title: 'Archived',
+        name: 'archived',
+        type: 'boolean',
+        inputComponent: ArchivedInput
+      },
       {
         title: 'Shopify Data',
         name: 'sourceData',
@@ -224,16 +231,19 @@ export const createProductDocument = ({
     preview: {
       select: {
         title: 'title',
-        sourceData: 'sourceData'
+        sourceData: 'sourceData',
+        archived: 'archived'
       },
       prepare: (props) => {
-        const { title, sourceData } = props
+        const { title, sourceData, archived } = props
         const [images] = unwindEdges(sourceData.images)
         // @ts-ignore
         const src = images[0]?.w100
         const alt = `Image for ${title}`
+        const subtitle = archived ? '📁 Archived' : undefined
         return {
           title,
+          subtitle,
           media: (
             <div style={imageWrapperStyles}>
               {src ? (