fix(form): properly support passing undefined as title to `renderDe…

…fault()` for array and object fields (#6774) * chore(test-studio): add repro case for sdx-1358 * fix(form): support passing `undefined` as field title to renderDefault
sanity-io · May 28, 2024 · f341c2d · f341c2d
1 parent 1961904
commit f341c2d
Show file tree

Hide file tree

Showing 4 changed files with 43 additions and 15 deletions.
diff --git a/dev/test-studio/schema/standard/arrays.tsx b/dev/test-studio/schema/standard/arrays.tsx
@@ -109,6 +109,40 @@ export default defineType({
         },
       ],
     },
+    {
+      name: 'arrayWithNoTitle',
+      title: 'Array with no title',
+      type: 'array',
+      components: {
+        field: (props: any) => {
+          return (
+            <div style={{border: '1px solid palegreen', borderRadius: 4}}>
+              {props.renderDefault({
+                ...props,
+                title: undefined,
+              })}
+            </div>
+          )
+        },
+      },
+      of: [
+        {
+          type: 'object',
+          name: 'obj',
+          title: 'Some object',
+          fields: [
+            {
+              name: 'title',
+              type: 'string',
+            },
+            {
+              name: 'description',
+              type: 'string',
+            },
+          ],
+        },
+      ],
+    },
     {
       name: 'arrayOfMultipleTypes',
       title: 'Array of multiple types',

diff --git a/packages/sanity/src/core/form/components/formField/FormFieldSet.tsx b/packages/sanity/src/core/form/components/formField/FormFieldSet.tsx
@@ -182,12 +182,14 @@ export const FormFieldSet = forwardRef(function FormFieldSet(
         content={
           <Stack space={3}>
             <Flex align="center">
-              <FormFieldSetLegend
-                collapsed={Boolean(collapsed)}
-                collapsible={collapsible}
-                onClick={collapsible ? handleToggle : undefined}
-                title={title}
-              />
+              {title && (
+                <FormFieldSetLegend
+                  collapsed={Boolean(collapsed)}
+                  collapsible={collapsible}
+                  onClick={collapsible ? handleToggle : undefined}
+                  title={title}
+                />
+              )}
               {deprecated && (
                 <Box marginLeft={2}>
                   <Badge data-testid={`deprecated-badge-${title}`} tone="caution">

diff --git a/packages/sanity/src/core/form/components/formField/FormFieldSetLegend.tsx b/packages/sanity/src/core/form/components/formField/FormFieldSetLegend.tsx
@@ -3,7 +3,6 @@ import {Box, Flex, rem, Text, type Theme} from '@sanity/ui'
 import {memo, type ReactNode} from 'react'
 import {css, styled} from 'styled-components'
 
-import {useTranslation} from '../../../i18n'
 import {focusRingStyle} from './styles'
 
 export interface FormFieldSetLegendProps {
@@ -71,15 +70,10 @@ const ToggleIconBox = styled(Box)`
 
 export const FormFieldSetLegend = memo(function FormFieldSetLegend(props: FormFieldSetLegendProps) {
   const {collapsed, collapsible, onClick, title} = props
-  const {t} = useTranslation()
 
   const text = (
     <Text weight="medium" size={1}>
-      {title || (
-        <span style={{color: 'var(--card-muted-fg-color)'}}>
-          {t('form.field.untitled-fieldset-label')}
-        </span>
-      )}
+      {title}
     </Text>
   )
 

diff --git a/packages/sanity/src/core/i18n/bundles/studio.ts b/packages/sanity/src/core/i18n/bundles/studio.ts
@@ -401,8 +401,6 @@ export const studioLocaleStrings = defineLocalesResources('studio', {
   'form.field.deprecated-label': 'deprecated',
   /** Fallback title shown above field if it has no defined title */
   'form.field.untitled-field-label': 'Untitled',
-  /** Fallback title shown above fieldset if it has no defined title */
-  'form.field.untitled-fieldset-label': 'Untitled',
   /** Accessibility label for the icon that indicates the field has a validation error */
   'form.validation.has-error-aria-label': 'Has error',
   /** Accessibility label for the icon that indicates the field has validation information */