add reusable modules to the cms schema

cms/desk/index.js

@@ -18,6 +18,7 @@ const hiddenDocTypes = (listItem) => {
  'media.tag',
  'page',
  'product',
+ 'reusableModule',
  'productVariant',
  'header',
  'colorType',
@@ -70,6 +71,11 @@ export const structure = (S, context) => {
  .title('Footers')
  .schemaType('footer')
  .child(S.documentTypeList('footer').title('Footers')),
+
+ S.listItem()
+ .title('Resuable Modules')
+ .schemaType('reusableModule')
+ .child(S.documentTypeList('reusableModule').title('Resuable Modules')),
  S.listItem()
  .title('Carts')
  .schemaType('cart')

cms/schemas/index.js

@@ -89,6 +89,7 @@ import moduleFAQs from './objects/module/faqModule'
 import moduleValueProps from './objects/module/valueProps'
 import moduleBigBenefits from './objects/module/bigBenefits'
 import moduleProductGrid from './objects/module/productGrid'
+import moduleReusableModule from './objects/module/reusableModule'
 
 import shopifyCollection from './objects/shopifyCollection'
 import shopifyCollectionRule from './objects/shopifyCollectionRule'
@@ -113,6 +114,7 @@ const objects = [
  moduleValueProps,
  moduleBigBenefits,
  moduleProductGrid,
+ moduleReusableModule,
 
  moduleProduct,
  moduleProducts,
@@ -136,14 +138,18 @@ const objects = [
 // site modules
 import productComponentList from './modules/productComponentList'
 import pageComponentList from './modules/pageComponentList'
+import reusableComponentList from './modules/reusableComponentList'
 import header from './modules/header'
 import footer from './modules/footer'
+import reusableModule from './modules/reusableModule'
 import cart from './modules/cart'
 
 const modules = [
  productComponentList,
  pageComponentList,
+ reusableComponentList,
  header,
+ reusableModule,
  footer,
  cart
 ]

cms/schemas/modules/pageComponentList.js

@@ -13,6 +13,7 @@ export default {
  { type: 'module.valueProps' },
  { type: 'module.faqs' },
  { type: 'module.image' },
+ { type: 'module.reusableModule' },
  { type: 'module.productGrid' },
  { type: 'module.standardText' },
  ],

cms/schemas/modules/reusableComponentList.js

@@ -0,0 +1,19 @@
+import React from 'react';
+import Emoji from 'a11y-react-emoji';
+
+const Icon = () => <Emoji style={{fontSize: '1.5em'}} symbol="🚧" />;
+
+export default {
+ name: 'reusableComponentList',
+ title: 'Components',
+ icon: Icon,
+ type: 'array',
+ of: [
+ { type: 'module.hero' },
+ { type: 'module.valueProps' },
+ { type: 'module.faqs' },
+ { type: 'module.image' },
+ { type: 'module.productGrid' },
+ { type: 'module.standardText' },
+ ],
+};

cms/schemas/modules/reusableModule.js

@@ -0,0 +1,36 @@
+import React from 'react';
+import Emoji from 'a11y-react-emoji';
+
+import { defineField } from 'sanity'
+
+const Icon = () => <Emoji style={{fontSize: '1.5em'}} symbol="♻️" />;
+
+export default {
+ name: 'reusableModule',
+ title: 'Reusable Module',
+ icon: Icon,
+ type: 'document',
+ fields: [
+ {
+ name: 'title',
+ title: 'Title',
+ type: 'string',
+ description: 'Only used internally in the CMS',
+ validation: Rule => Rule.required(),
+ },
+ defineField({
+ name: 'reusableComponentList',
+ title: 'Modules',
+ type: 'reusableComponentList',
+ }),
+ ],
+ preview: {
+ select: {
+ title: 'title',
+ },
+ prepare: selection => ({
+ ...selection,
+ media: <Icon />,
+ }),
+ },
+};

cms/schemas/objects/module/reusableModule.js

@@ -0,0 +1,28 @@
+import React from 'react'
+import {defineField, defineType} from 'sanity'
+import {PackageIcon} from '@sanity/icons'
+
+
+export default defineType({
+ name: 'module.reusableModule',
+ title: 'Reusable Module',
+ type: 'object',
+ icon: PackageIcon,
+ fields: [
+
+ defineField({
+ name: 'module',
+ title: 'Reusable Module',
+ type: 'reference',
+ to: { type: 'reusableModule'},
+ }),
+ ],
+ preview: {
+ select: {},
+ prepare(selection) {
+ return {
+ title: 'Reusable Module',
+ }
+ },
+ },
+})