[chore] Move preview into base (#2212)

packages/@sanity/base/package.json

@@ -38,7 +38,6 @@
     "@sanity/image-url": "^0.140.19",
     "@sanity/initial-value-templates": "2.1.4",
     "@sanity/mutator": "2.1.4",
-    "@sanity/preview": "2.1.4",
     "@sanity/schema": "2.1.4",
     "@sanity/state-router": "2.1.4",
     "@sanity/structure": "2.1.4",

packages/@sanity/base/src/datastores/document/useDocumentValues.ts

@@ -1,6 +1,6 @@
 import {of} from 'rxjs'
-import {observePaths} from '@sanity/preview'
 import {LoadableState, useLoadable} from '../../util/useLoadable'
+import {observePaths} from '../../preview'
 
 export function useDocumentValues<T = Record<string, unknown>>(
   documentId: string | undefined,

packages/@sanity/preview/src/components/ObserveForPreview.tsx → packages/@sanity/base/src/preview/components/ObserveForPreview.tsx

@@ -12,7 +12,7 @@ import {
   tap,
 } from 'rxjs/operators'
 import {concat, of, Observable} from 'rxjs'
-import observeForPreview from '../observeForPreview'
+import {observeForPreview} from '../'
 import {INVALID_PREVIEW_CONFIG} from '../constants'
 import {FieldName, SortOrdering, Type} from '../types'
 

packages/@sanity/preview/src/createPathObserver.ts → packages/@sanity/base/src/preview/createPathObserver.ts

@@ -105,7 +105,7 @@ function normalizeValue(value: Value | Id): Value {
   return typeof value === 'string' ? {_id: value} : value
 }
 
-export default function createPathObserver(observeFields: ObserveFieldsFn) {
+export function createPathObserver(observeFields: ObserveFieldsFn) {
   return (value: Value, paths: (FieldName | Path)[]): Observable<Record<string, unknown> | null> =>
     observePaths(normalizeValue(value), normalizePaths(paths), observeFields)
 }

packages/@sanity/base/src/preview/createPreviewObserver.ts

@@ -0,0 +1,62 @@
+import {of as observableOf, Observable} from 'rxjs'
+import {map, switchMap} from 'rxjs/operators'
+import {isReferenceSchemaType, ReferenceSchemaType, SchemaType} from '@sanity/types'
+import prepareForPreview, {invokePrepare, PrepareInvocationResult} from './prepareForPreview'
+import {FieldName, Path, Reference, PrepareViewOptions} from './types'
+
+export interface PreviewValue {
+  type?: SchemaType
+  snapshot: null | PrepareInvocationResult
+}
+
+// Takes a value and its type and prepares a snapshot for it that can be passed to a preview component
+export function createPreviewObserver(
+  observePaths: (value: any, paths: Path[]) => any,
+  resolveRefType: (
+    value: Reference,
+    ownerType: ReferenceSchemaType
+  ) => Observable<SchemaType | undefined>
+) {
+  return function observeForPreview(
+    value: any,
+    type: SchemaType,
+    fields: FieldName[],
+    viewOptions?: PrepareViewOptions
+  ): Observable<PreviewValue> {
+    if (isReferenceSchemaType(type)) {
+      // if the value is of type reference, but has no _ref property, we cannot prepare any value for the preview
+      // and the most sane thing to do is to return `null` for snapshot
+      if (!value._ref) {
+        return observableOf({snapshot: null})
+      }
+      // Previewing references actually means getting the referenced value,
+      // and preview using the preview config of its type
+      // todo: We need a way of knowing the type of the referenced value by looking at the reference record alone
+      return resolveRefType(value, type).pipe(
+        switchMap((refType) =>
+          refType
+            ? observeForPreview(value, refType, fields)
+            : observableOf<PreviewValue>({
+                type: type,
+                snapshot: null,
+              })
+        )
+      )
+    }
+
+    const selection = type.preview?.select
+    if (selection) {
+      const paths = Object.keys(selection).map((key) => selection[key].split('.'))
+      return observePaths(value, paths).pipe(
+        map((snapshot) => ({
+          type: type,
+          snapshot: snapshot && prepareForPreview(snapshot, type, viewOptions),
+        }))
+      )
+    }
+    return observableOf({
+      type: type,
+      snapshot: invokePrepare(type, value, viewOptions),
+    })
+  }
+}

packages/@sanity/base/src/preview/index.ts

@@ -0,0 +1,14 @@
+import observeFields from './observeFields'
+import resolveRefType from './utils/resolveRefType'
+import {createPathObserver} from './createPathObserver'
+import {createPreviewObserver} from './createPreviewObserver'
+
+export {default} from './components/SanityDefaultPreview'
+export {default as SanityDefaultPreview} from './components/SanityDefaultPreview'
+export {default as PreviewFields} from './components/PreviewFields'
+export {default as SanityPreview} from './components/SanityPreview'
+export {default as PreviewSubscriber} from './components/PreviewSubscriber'
+export {default as WithVisibility} from './components/WithVisibility'
+
+export const observePaths = createPathObserver(observeFields)
+export const observeForPreview = createPreviewObserver(observePaths, resolveRefType)

packages/@sanity/preview/src/prepareForPreview.ts → packages/@sanity/base/src/preview/prepareForPreview.ts

@@ -194,7 +194,7 @@ function defaultPrepare(value: SelectedValue) {
 export function invokePrepare(
   type: Type,
   value: SelectedValue,
-  viewOptions: PrepareViewOptions
+  viewOptions: PrepareViewOptions = {}
 ): PrepareInvocationResult {
   const prepare = type.preview?.prepare
   try {

packages/@sanity/base/src/preview/utils/resolveRefType.ts

@@ -0,0 +1,22 @@
+import client from 'part:@sanity/base/client'
+import {from as observableFrom, Observable} from 'rxjs'
+import {map} from 'rxjs/operators'
+import {Reference, ReferenceSchemaType, SchemaType} from '@sanity/types'
+
+const CACHE: Record<string, Promise<string>> = Object.create(null) // todo: use a LRU cache instead (e.g. hashlru or quick-lru)
+
+function resolveRefTypeName(reference: Reference): Observable<string> {
+  if (!(reference._ref in CACHE)) {
+    CACHE[reference._ref] = client.fetch('*[_id == $id][0]._type', {id: reference._ref})
+  }
+  return observableFrom(CACHE[reference._ref])
+}
+
+export default function resolveRefType(
+  value: Reference,
+  type: ReferenceSchemaType
+): Observable<SchemaType | undefined> {
+  return resolveRefTypeName(value).pipe(
+    map((refTypeName) => type.to.find((toType) => toType.name === refTypeName))
+  )
+}

packages/@sanity/base/tsconfig.json

@@ -21,9 +21,6 @@
     ]
   },
   "references": [
-    {
-      "path": "../preview"
-    },
     {
       "path": "../structure"
     },

packages/@sanity/desk-tool/src/components/DocumentPaneItemPreview.js

@@ -5,7 +5,7 @@ import {assignWith} from 'lodash'
 import {map} from 'rxjs/operators'
 import {getDraftId, getPublishedId} from 'part:@sanity/base/util/draft-utils'
 import WarningIcon from 'part:@sanity/base/warning-icon'
-import {observeForPreview, SanityDefaultPreview} from 'part:@sanity/base/preview'
+import {SanityDefaultPreview, observeForPreview} from 'part:@sanity/base/preview'
 import NotPublishedStatus from './NotPublishedStatus'
 import DraftStatus from './DraftStatus'