@sanity/cli 7.18.0 → 8.0.0

package/templates/shopify-online-storefront/schemaTypes/objects/shopifyMetafield.ts

@@ -0,0 +1,53 @@
+import {TagIcon} from '@sanity/icons/Tag'
+import {defineField, defineType} from 'sanity'
+
+import ShopifyMetafield from '../../components/inputs/ShopifyMetafield'
+import {formatMetafieldValue} from '../../utils/formatMetafieldValue'
+
+export default defineType({
+  title: 'Metafield',
+  name: 'shopifyMetafield',
+  type: 'object',
+  icon: TagIcon,
+  readOnly: true,
+  components: {
+    input: ShopifyMetafield,
+  },
+  fields: [
+    // Namespace
+    defineField({
+      title: 'Namespace',
+      name: 'namespace',
+      type: 'string',
+    }),
+    // Key
+    defineField({
+      title: 'Key',
+      name: 'key',
+      type: 'string',
+    }),
+    // Type
+    defineField({
+      title: 'Type',
+      name: 'type',
+      type: 'string',
+    }),
+    // `value` is deliberately left undeclared: it can be a string, number, boolean, list or object
+    // depending on the metafield type, and a declared field is type-checked even when hidden.
+  ],
+  preview: {
+    select: {
+      key: 'key',
+      namespace: 'namespace',
+      type: 'type',
+      value: 'value',
+    },
+    prepare({key, namespace, type, value}) {
+      const name = [namespace, key].filter(Boolean).join('.')
+      return {
+        subtitle: formatMetafieldValue(type, value),
+        title: type ? `${name} (${type})` : name,
+      }
+    },
+  },
+})

package/templates/shopify-online-storefront/schemaTypes/objects/shopifyProduct.ts

@@ -29,6 +29,14 @@ export default defineType({
         collapsible: true,
       },
     },
+    {
+      name: 'metafields',
+      title: 'Metafields',
+      options: {
+        collapsed: true,
+        collapsible: true,
+      },
+    },
   ],
   fields: [
     // Created at
@@ -154,6 +162,17 @@ export default defineType({
         },
       ],
     }),
+    // Metafields
+    defineField({
+      fieldset: 'metafields',
+      name: 'metafields',
+      title: 'Metafields',
+      type: 'array',
+      description: 'Read-only. Replaced in full on every sync',
+      // Shopify owns the order, and `readOnly` does not remove the drag handles on its own.
+      options: {sortable: false},
+      of: [{type: 'shopifyMetafield'}],
+    }),
     // Shop details
     defineField({
       name: 'shop',

package/templates/shopify-online-storefront/utils/formatMetafieldValue.ts

@@ -0,0 +1,30 @@
+/**
+ * Shows a synced Shopify metafield value as text, based on its metafield `type`.
+ *
+ * The types below are examples. Anything not listed falls back to the raw value, so your own
+ * metafields still display — add an entry here to show one of them nicely. Every type and the shape
+ * of its value: https://shopify.dev/docs/apps/build/custom-data/metafields/list-of-data-types
+ */
+const measurement = ({value, unit}: {value: number; unit: string}) => `${value} ${unit}`
+
+const formatters: Record<string, (value: any) => string> = {
+  dimension: measurement,
+  weight: measurement,
+  volume: measurement,
+  money: ({amount, currency_code: currencyCode}) => `${amount} ${currencyCode}`,
+  rating: ({value, scale_max: scaleMax}) => `${value} / ${scaleMax}`,
+  'list.single_line_text_field': (values: string[]) => values.join(', '),
+}
+
+export const formatMetafieldValue = (type: string | undefined, value: unknown) => {
+  if (value === null || typeof value === 'undefined') {
+    return ''
+  }
+
+  const format = type ? formatters[type] : undefined
+  if (format) {
+    return format(value)
+  }
+
+  return typeof value === 'string' ? value : JSON.stringify(value)
+}