@tinacms/app 1.2.7 → 1.2.8

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @tinacms/app
 
+## 1.2.8
+
+### Patch Changes
+
+- eba7e5e5e: Simplify formify logic
+- Updated dependencies [790b1e1ae]
+- Updated dependencies [eba7e5e5e]
+  - tinacms@1.5.1
+  - @tinacms/toolkit@1.7.1
+
 ## 1.2.7
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tinacms/app",
-  "version": "1.2.7",
+  "version": "1.2.8",
   "main": "src/main.tsx",
   "license": "Apache-2.0",
   "devDependencies": {
@@ -12,24 +12,23 @@
     "@graphiql/toolkit": "^0.8.2",
     "@headlessui/react": "1.6.6",
     "@heroicons/react": "1.0.6",
+    "@monaco-editor/react": "4.4.5",
     "@tinacms/mdx": "1.3.9",
-    "@tinacms/toolkit": "1.7.0",
+    "@tinacms/toolkit": "1.7.1",
     "@xstate/react": "3.0.0",
     "final-form": "4.20.7",
     "graphiql": "^2.4.0",
     "graphql": "15.8.0",
+    "monaco-editor": "0.31.0",
     "postcss": "^8.4.14",
     "postcss-nested": "^5.0.6",
     "react": "17.0.2",
     "react-dom": "17.0.2",
     "react-is": "17.0.2",
     "react-router-dom": "6.3.0",
-    "tinacms": "1.5.0",
-    "xstate": "4.32.1",
     "tailwindcss": "^3.2.7",
+    "tinacms": "1.5.1",
     "typescript": "^4.6.4",
-    "@monaco-editor/react": "4.4.5",
-    "monaco-editor": "0.31.0",
-    "webfontloader": "1.6.28"
+    "zod": "^3.14.3"
   }
 }

package/src/lib/build-form.ts

@@ -0,0 +1,49 @@
+import { Field, Form, FormOptions, TinaCMS, TinaField } from 'tinacms'
+
+export type FieldType = Field & TinaField
+export type FormValues = Record<string, unknown>
+export type FormType = Form<FormValues, FieldType>
+
+type FormCreator = (formConfig: FormOptions<any>) => Form
+interface GlobalFormOptions {
+  icon?: any
+  layout: 'fullscreen' | 'popup'
+}
+type GlobalFormCreator = (
+  formConfig: FormOptions<any>,
+  options?: GlobalFormOptions
+) => Form
+interface GlobalFormOptions {
+  icon?: any
+  layout: 'fullscreen' | 'popup'
+}
+export interface FormifyArgs {
+  formConfig: FormOptions<any>
+  createForm: FormCreator
+  createGlobalForm: FormCreator
+  skip?: () => void
+}
+
+export type FormifyCallback = (args: FormifyArgs, cms: TinaCMS) => Form | void
+export type onSubmitArgs = {
+  /**
+   * @deprecated queryString is actually a mutation string, use `mutationString` instead
+   */
+  queryString: string
+  mutationString: string
+  variables: object
+}
+
+export const createForm = (formConfig: FormOptions<any, any>) => {
+  return new Form(formConfig)
+}
+export const createGlobalForm: GlobalFormCreator = (
+  formConfig,
+  options?: { icon?: any; layout: 'fullscreen' | 'popup' }
+) => {
+  const form = new Form({
+    ...formConfig,
+    global: { global: true, ...options },
+  })
+  return form
+}

package/src/lib/expand-query.ts

@@ -0,0 +1,231 @@
+import * as G from 'graphql'
+
+export const expandQuery = ({
+  schema,
+  documentNode,
+}: {
+  schema: G.GraphQLSchema
+  documentNode: G.DocumentNode
+}): G.DocumentNode => {
+  const documentNodeWithTypenames = addTypenameToDocument(documentNode)
+  return addMetaFieldsToQuery(documentNodeWithTypenames, new G.TypeInfo(schema))
+}
+
+const addTypenameToDocument = (doc: G.DocumentNode) => {
+  function isField(selection: G.SelectionNode): selection is G.FieldNode {
+    return selection.kind === 'Field'
+  }
+  return G.visit(doc, {
+    SelectionSet: {
+      enter(node, _key, parent) {
+        // Don't add __typename to OperationDefinitions.
+        if (
+          parent &&
+          (parent as G.OperationDefinitionNode).kind ===
+            G.Kind.OPERATION_DEFINITION
+        ) {
+          return
+        }
+
+        // No changes if no selections.
+        const { selections } = node
+        if (!selections) {
+          return
+        }
+
+        // If selections already have a __typename, or are part of an
+        // introspection query, do nothing.
+        const skip = selections.some((selection) => {
+          return (
+            isField(selection) &&
+            (selection.name.value === '__typename' ||
+              selection.name.value.lastIndexOf('__', 0) === 0)
+          )
+        })
+        if (skip) {
+          return
+        }
+
+        // If this SelectionSet is @export-ed as an input variable, it should
+        // not have a __typename field (see issue #4691).
+        const field = parent as G.FieldNode
+        if (
+          isField(field) &&
+          field.directives &&
+          field.directives.some((d) => d.name.value === 'export')
+        ) {
+          return
+        }
+
+        // Create and return a new SelectionSet with a __typename Field.
+        return {
+          ...node,
+          selections: [...selections, TYPENAME_FIELD],
+        }
+      },
+    },
+  })
+}
+
+const METADATA_FIELD: G.FieldNode = {
+  kind: G.Kind.FIELD,
+  name: {
+    kind: G.Kind.NAME,
+    value: '_tina_metadata',
+  },
+}
+
+const TYPENAME_FIELD: G.FieldNode = {
+  kind: G.Kind.FIELD,
+  name: {
+    kind: G.Kind.NAME,
+    value: '__typename',
+  },
+}
+
+const addMetadataField = (
+  node: G.FieldNode | G.InlineFragmentNode | G.FragmentDefinitionNode
+): G.ASTNode => {
+  return {
+    ...node,
+    selectionSet: {
+      ...(node.selectionSet || {
+        kind: 'SelectionSet',
+        selections: [],
+      }),
+      selections:
+        [...(node.selectionSet?.selections || []), METADATA_FIELD] || [],
+    },
+  }
+}
+
+const addMetaFieldsToQuery = (
+  documentNode: G.DocumentNode,
+  typeInfo: G.TypeInfo
+) => {
+  const addMetaFields: G.VisitFn<G.ASTNode, G.FieldNode> = (
+    node: G.FieldNode
+  ): G.ASTNode => {
+    return {
+      ...node,
+      selectionSet: {
+        ...(node.selectionSet || {
+          kind: 'SelectionSet',
+          selections: [],
+        }),
+        selections:
+          [...(node.selectionSet?.selections || []), ...metaFields] || [],
+      },
+    }
+  }
+
+  const formifyVisitor: G.Visitor<G.ASTKindToNode, G.ASTNode> = {
+    FragmentDefinition: {
+      enter: (node, key, parent, path, ancestors) => {
+        typeInfo.enter(node)
+        const type = typeInfo.getType()
+        if (type) {
+          const namedType = G.getNamedType(type)
+          if (G.isObjectType(namedType)) {
+            if (namedType.getFields()['_tina_metadata']) {
+              return addMetadataField(node)
+            }
+          }
+          return node
+        }
+      },
+    },
+    InlineFragment: {
+      enter: (node, key, parent, path, ancestors) => {
+        typeInfo.enter(node)
+        const type = typeInfo.getType()
+        if (type) {
+          const namedType = G.getNamedType(type)
+          if (G.isObjectType(namedType)) {
+            if (namedType.getFields()['_tina_metadata']) {
+              return addMetadataField(node)
+            }
+          }
+          return node
+        }
+      },
+    },
+    Field: {
+      enter: (node, key, parent, path, ancestors) => {
+        typeInfo.enter(node)
+        const type = typeInfo.getType()
+        if (type) {
+          if (isNodeType(type)) {
+            return addMetaFields(node, key, parent, path, ancestors)
+          }
+          const namedType = G.getNamedType(type)
+          if (G.isObjectType(namedType)) {
+            if (namedType.getFields()['_tina_metadata']) {
+              return addMetadataField(node)
+            }
+            return node
+          }
+        }
+        return node
+      },
+    },
+  }
+  return G.visit(documentNode, G.visitWithTypeInfo(typeInfo, formifyVisitor))
+}
+/**
+ * This is a dummy query which we pull apart and spread
+ * back into the the selectionSet for all "Node" fields
+ */
+const node = G.parse(`
+ query Sample {
+  ...on Document {
+    _internalValues: _values
+    _internalSys: _sys {
+      breadcrumbs
+      basename
+      filename
+      path
+      extension
+      relativePath
+      title
+      template
+      collection {
+        name
+        slug
+        label
+        path
+        format
+        matches
+        templates
+        fields
+      }
+    }
+  }
+ }`)
+const metaFields: G.SelectionNode[] =
+  // @ts-ignore
+  node.definitions[0].selectionSet.selections
+
+export const isNodeType = (type: G.GraphQLOutputType) => {
+  const namedType = G.getNamedType(type)
+  if (G.isInterfaceType(namedType)) {
+    if (namedType.name === 'Node') {
+      return true
+    }
+  }
+  if (G.isUnionType(namedType)) {
+    const types = namedType.getTypes()
+    if (
+      types.every((type) => {
+        return type.getInterfaces().some((intfc) => intfc.name === 'Node')
+      })
+    ) {
+      return true
+    }
+  }
+  if (G.isObjectType(namedType)) {
+    if (namedType.getInterfaces().some((intfc) => intfc.name === 'Node')) {
+      return true
+    }
+  }
+}