@tinacms/app 2.2.8 → 2.2.10

package/CHANGELOG.md

@@ -1,5 +1,31 @@
 # @tinacms/app
 
+## 2.2.10
+
+### Patch Changes
+
+- [#5833](https://github.com/tinacms/tinacms/pull/5833) [`5269d65`](https://github.com/tinacms/tinacms/commit/5269d6578d361c55326f39375eaa175707342d51) Thanks [@JackDevAU](https://github.com/JackDevAU)! - 🐛 FIX - Visual Editor Webpack HMR loading issue
+
+- Updated dependencies [[`5269d65`](https://github.com/tinacms/tinacms/commit/5269d6578d361c55326f39375eaa175707342d51), [`3026a2b`](https://github.com/tinacms/tinacms/commit/3026a2b492113a53c036e43d5d85837cea4a6de3), [`28a94a6`](https://github.com/tinacms/tinacms/commit/28a94a602186f48b528b91236007839e5d02a9de)]:
+  - tinacms@2.7.10
+
+## 2.2.9
+
+### Patch Changes
+
+- [#5741](https://github.com/tinacms/tinacms/pull/5741) [`0e9de37`](https://github.com/tinacms/tinacms/commit/0e9de379dab2970206b9b60eb014808662f67287) Thanks [@wicksipedia](https://github.com/wicksipedia)! - CMS admin UI - Refactor Sidebar and Branch Button Components
+  Forms header - Adds breadcrumb navigation
+
+- [#5784](https://github.com/tinacms/tinacms/pull/5784) [`b25c5f0`](https://github.com/tinacms/tinacms/commit/b25c5f0b0e1d3f37870b780230b41dbc56bef1ab) Thanks [@JackDevAU](https://github.com/JackDevAU)! - - Fixed padding issues in FormLists
+
+  - Fixed Visual Editing's "Edit" button (Reference Fields)
+
+- [#5789](https://github.com/tinacms/tinacms/pull/5789) [`5040a6a`](https://github.com/tinacms/tinacms/commit/5040a6aa24e62166d942c47b61a3f18585caded6) Thanks [@JackDevAU](https://github.com/JackDevAU)! - ✨ Adds click to focus for nested objects
+
+- Updated dependencies [[`2a3ed6c`](https://github.com/tinacms/tinacms/commit/2a3ed6c3ec3233fd90fd94f3dd3d0243aaad079a), [`bc47f93`](https://github.com/tinacms/tinacms/commit/bc47f938431c400714808613f633b05659a87be1), [`0e9de37`](https://github.com/tinacms/tinacms/commit/0e9de379dab2970206b9b60eb014808662f67287), [`468f0ee`](https://github.com/tinacms/tinacms/commit/468f0eefc0a15a9a9a23737d29ea9a5cb5c6aef6), [`e27c017`](https://github.com/tinacms/tinacms/commit/e27c0172005797af93b908152d51b2966c0cf059), [`b25c5f0`](https://github.com/tinacms/tinacms/commit/b25c5f0b0e1d3f37870b780230b41dbc56bef1ab), [`5040a6a`](https://github.com/tinacms/tinacms/commit/5040a6aa24e62166d942c47b61a3f18585caded6), [`dbef36f`](https://github.com/tinacms/tinacms/commit/dbef36f594b949024d5525184b6a9e1b9085b759), [`3ba6d78`](https://github.com/tinacms/tinacms/commit/3ba6d78f35f817d55bfc3d12b750e54b7e0d11f2)]:
+  - tinacms@2.7.9
+  - @tinacms/mdx@1.7.0
+
 ## 2.2.8
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tinacms/app",
-  "version": "2.2.8",
+  "version": "2.2.10",
   "main": "src/main.tsx",
   "license": "Apache-2.0",
   "devDependencies": {
@@ -24,7 +24,7 @@
     "react-router-dom": "6.3.0",
     "typescript": "^5.7.3",
     "zod": "^3.24.2",
-    "@tinacms/mdx": "1.6.3",
-    "tinacms": "2.7.8"
+    "@tinacms/mdx": "1.7.0",
+    "tinacms": "2.7.10"
   }
 }

package/src/Playground.tsx

@@ -100,7 +100,7 @@ const Playground = () => {
                         false
                           ? 'bg-gray-100 text-gray-900'
                           : 'text-gray-600 hover:bg-gray-50 hover:text-gray-900',
-                        'flex items-center rounded-md px-3 py-2 text-sm font-medium w-full text-left'
+                        'flex items-center rounded px-3 py-2 text-sm font-medium w-full text-left'
                       )}
                       onClick={async () => {
                         if (typeof value === 'function') {

package/src/fields/rich-text/monaco/error-message.tsx

@@ -1,16 +1,16 @@
-/**
-
-
-
-*/
-import React from 'react';
-import { XCircleIcon } from '@heroicons/react/solid';
 import {
   Popover,
   PopoverButton,
   PopoverPanel,
   Transition,
 } from '@headlessui/react';
+import { XCircleIcon } from '@heroicons/react/solid';
+/**
+
+
+
+*/
+import React from 'react';
 import { Fragment } from 'react';
 // import { InvalidMarkdownElement } from '@tinacms/mdx/src/parse/plate'
 export type EmptyTextElement = { type: 'text'; text: '' };
@@ -93,7 +93,7 @@ export function ErrorMessage({ error }: { error: InvalidMarkdownElement }) {
           >
             <PopoverPanel className='absolute top-8 w-[300px] -right-3 z-10 mt-3 px-4 sm:px-0'>
               <div className='overflow-hidden rounded-lg shadow-lg ring-1 ring-black ring-opacity-5'>
-                <div className='rounded-md bg-red-50 p-4 overflow-scroll'>
+                <div className='rounded bg-red-50 p-4 overflow-scroll'>
                   <div className='flex'>
                     <div className='flex-shrink-0'>
                       <XCircleIcon

package/src/fields/rich-text/monaco/index.tsx

@@ -4,7 +4,6 @@
 
 */
 
-import React from 'react';
 import MonacoEditor, { useMonaco, loader } from '@monaco-editor/react';
 /**
  * MDX is built directly to the app because of how we load dependencies.
@@ -12,15 +11,16 @@ import MonacoEditor, { useMonaco, loader } from '@monaco-editor/react';
  * easily install the current version of the mdx package in all scenarios
  * (when we're working in the monorepo, or working with a tagged npm version)
  */
-import { parseMDX, stringifyMDX } from '@tinacms/mdx';
-import { useDebounce } from './use-debounce';
+import { parseMDX, serializeMDX } from '@tinacms/mdx';
 import type * as monaco from 'monaco-editor';
+import React from 'react';
+import { RichTextType } from 'tinacms';
 import {
-  buildError,
   ErrorMessage,
   InvalidMarkdownElement,
+  buildError,
 } from './error-message';
-import { RichTextType } from 'tinacms';
+import { useDebounce } from './use-debounce';
 
 export const uuid = () => {
   // @ts-ignore
@@ -68,7 +68,7 @@ export const RawEditor = (props: RichTextType) => {
   const field = props.field;
   const inputValue = React.useMemo(() => {
     // @ts-ignore no access to the rich-text type from this package
-    const res = stringifyMDX(props.input.value, field, (value) => value);
+    const res = serializeMDX(props.input.value, field, (value) => value);
     return typeof props.input.value === 'string' ? props.input.value : res;
   }, []);
   const [value, setValue] = React.useState(inputValue);
@@ -219,10 +219,8 @@ const Button = (props) => {
   return (
     <button
       className={`${
-        props.align === 'left'
-          ? 'rounded-l-md border-r-0'
-          : 'rounded-r-md border-l-0'
-      } flex justify-center w-full shadow rounded-md bg-white cursor-pointer relative inline-flex items-center px-2 py-2 border border-gray-200 hover:text-white text-sm font-medium transition-all ease-out duration-150 hover:bg-blue-500 focus:z-10 focus:outline-none focus:ring-1 focus:ring-blue-500 focus:border-blue-500`}
+        props.align === 'left' ? 'rounded-l border-r-0' : 'rounded-r border-l-0'
+      } flex justify-center w-full shadow rounded bg-white cursor-pointer relative inline-flex items-center px-2 py-2 border border-gray-200 hover:text-white text-sm font-medium transition-all ease-out duration-150 hover:bg-blue-500 focus:z-10 focus:outline-none focus:ring-1 focus:ring-blue-500 focus:border-blue-500`}
       type='button'
       onClick={props.onClick}
     >

package/src/lib/expand-query.ts

@@ -103,12 +103,11 @@ const addMetadataField = (
         kind: 'SelectionSet',
         selections: [],
       }),
-      selections:
-        [
-          ...(node.selectionSet?.selections || []),
-          METADATA_FIELD,
-          CONTENT_SOURCE_FIELD,
-        ] || [],
+      selections: [
+        ...(node.selectionSet?.selections || []),
+        METADATA_FIELD,
+        CONTENT_SOURCE_FIELD,
+      ],
     },
   };
 };
@@ -127,8 +126,7 @@ const addMetaFieldsToQuery = (
           kind: 'SelectionSet',
           selections: [],
         }),
-        selections:
-          [...(node.selectionSet?.selections || []), ...metaFields] || [],
+        selections: [...(node.selectionSet?.selections || []), ...metaFields],
       },
     };
   };
@@ -242,6 +240,7 @@ export const isNodeType = (type: G.GraphQLOutputType) => {
       return true;
     }
   }
+  return false;
 };
 
 export const isConnectionType = (type: G.GraphQLOutputType) => {
@@ -270,4 +269,5 @@ export const isConnectionType = (type: G.GraphQLOutputType) => {
       return true;
     }
   }
+  return false;
 };

package/src/lib/graphql-reducer.ts

@@ -45,7 +45,7 @@ const sysSchema = z.object({
   collection: z.object({
     name: z.string(),
     slug: z.string(),
-    label: z.string(),
+    label: z.string().optional().nullable(),
     path: z.string(),
     format: z.string().optional().nullable(),
     matches: z.string().optional().nullable(),
@@ -305,6 +305,7 @@ export const useGraphQLReducer = (
               prefix: '',
             };
           }
+
           if (isConnectionType(info.returnType)) {
             const name = G.getNamedType(info.returnType).name;
             const connectionCollection = tinaSchema
@@ -339,6 +340,7 @@ export const useGraphQLReducer = (
               const maybeResolvedDocument = resolvedDocuments.find(
                 (doc) => doc._internalSys.path === value
               );
+
               // If we already have this document, use it.
               if (maybeResolvedDocument) {
                 resolvedDocument = maybeResolvedDocument;
@@ -349,6 +351,7 @@ export const useGraphQLReducer = (
                 // here and just grab it from the response
                 const maybeResolvedDocument =
                   documentSchema.parse(valueFromSetup);
+
                 if (maybeResolvedDocument._internalSys.path === value) {
                   resolvedDocument = maybeResolvedDocument;
                 } else {
@@ -559,12 +562,14 @@ export const useGraphQLReducer = (
           payload,
         ]);
       }
-      if (event.data.type === 'url-changed') {
-        cms.dispatch({
-          type: 'sidebar:set-loading-state',
-          value: true,
-        });
-      }
+      // TODO: This is causing a webpack HMR issue - look into refactoring this logic
+      // if (event.data.type === 'url-changed') {
+      //   console.log('[EVENT_TRIGGERED] url-changed: ', event);
+      //   cms.dispatch({
+      //     type: 'sidebar:set-loading-state',
+      //     value: true,
+      //   });
+      // }
     },
     [cms, JSON.stringify(results)]
   );

package/src/lib/util.ts

@@ -108,27 +108,22 @@ export const getFormAndFieldNameFromMetadata = (
   object: object,
   eventFieldName: string
 ) => {
-  let formId;
-  let n;
-  const value = getDeepestMetadata(object, eventFieldName);
-  if (value) {
-    if (value.prefix) {
-      const fieldName = eventFieldName.slice(value?.prefix?.length + 1);
-      const localFieldName = value.name
-        ? fieldName.slice(value?.name?.length + 1)
-        : fieldName;
-      if (localFieldName) {
-        // If localFieldName is tags.2, just use `tags`
-        if (!isNaN(Number(localFieldName.split('.')[1]))) {
-          n = value.fields[localFieldName.split('.')[0]];
-        } else {
-          n = value.fields[localFieldName];
-        }
-      } else {
-        n = value.name;
-      }
-      formId = value.id;
-    }
+  const metadata = getDeepestMetadata(object, eventFieldName);
+
+  if (!metadata) {
+    console.warn(
+      '[getFormAndFieldNameFromMetadata] No metadata found for:',
+      eventFieldName
+    );
+    return { formId: undefined, fieldName: undefined };
   }
-  return { formId, fieldName: n };
+
+  const { id: formId, prefix } = metadata;
+  const prefixLength = prefix?.length ?? 0;
+  const localFieldName = eventFieldName.slice(prefixLength + 1);
+
+  return {
+    formId,
+    fieldName: localFieldName,
+  };
 };