chore(corel): rename bundle.name to bundle.slug (#7171)

* chore(corel): rename bundle.name to bundle.slug * chore(corel): add migration script and handlers * fix(corel): update BundleDocument interface definition
sanity-io · Jul 17, 2024 · 8cbc89d · 8cbc89d
1 parent fb84570
commit 8cbc89d
Show file tree

Hide file tree

Showing 34 changed files with 218 additions and 116 deletions.
diff --git a/packages/sanity/src/core/bundles/components/BundleMenu.tsx b/packages/sanity/src/core/bundles/components/BundleMenu.tsx
@@ -30,14 +30,14 @@ interface BundleListProps {
  */
 export function BundleMenu(props: BundleListProps): JSX.Element {
   const {bundles, loading, actions, button} = props
-  const hasBundles = bundles && bundles.filter((b) => !isDraftOrPublished(b.name)).length > 0
+  const hasBundles = bundles && bundles.filter((b) => !isDraftOrPublished(b.slug)).length > 0
 
   const {currentGlobalBundle, setPerspective} = usePerspective()
 
   const handleBundleChange = useCallback(
     (bundle: Partial<BundleDocument>) => () => {
-      if (bundle.name) {
-        setPerspective(bundle.name)
+      if (bundle.slug) {
+        setPerspective(bundle.slug)
       }
     },
     [setPerspective],
@@ -58,7 +58,7 @@ export function BundleMenu(props: BundleListProps): JSX.Element {
               <>
                 <MenuItem
                   iconRight={
-                    currentGlobalBundle.name === LATEST.name ? (
+                    currentGlobalBundle.slug === LATEST.slug ? (
                       <CheckmarkIcon data-testid="latest-checkmark-icon" />
                     ) : undefined
                   }
@@ -72,14 +72,14 @@ export function BundleMenu(props: BundleListProps): JSX.Element {
                     <MenuDivider />
                     <StyledBox data-testid="bundles-list">
                       {bundles
-                        .filter((b) => !isDraftOrPublished(b.name) && !b.archivedAt)
+                        .filter((b) => !isDraftOrPublished(b.slug) && !b.archivedAt)
                         .map((b) => (
                           <MenuItem
-                            key={b.name}
+                            key={b.slug}
                             onClick={handleBundleChange(b)}
                             padding={1}
                             pressed={false}
-                            data-testid={`bundle-${b.name}`}
+                            data-testid={`bundle-${b.slug}`}
                           >
                             <Flex>
                               <BundleBadge hue={b.hue} icon={b.icon} padding={2} />
@@ -103,8 +103,8 @@ export function BundleMenu(props: BundleListProps): JSX.Element {
                               <Box padding={2}>
                                 <Text size={1}>
                                   <CheckmarkIcon
-                                    style={{opacity: currentGlobalBundle.name === b.name ? 1 : 0}}
-                                    data-testid={`${b.name}-checkmark-icon`}
+                                    style={{opacity: currentGlobalBundle.slug === b.slug ? 1 : 0}}
+                                    data-testid={`${b.slug}-checkmark-icon`}
                                   />
                                 </Text>
                               </Box>

diff --git a/packages/sanity/src/core/bundles/components/__tests__/BundleMenu.test.tsx b/packages/sanity/src/core/bundles/components/__tests__/BundleMenu.test.tsx
@@ -29,7 +29,7 @@ describe('BundleMenu', () => {
       hue: 'magenta',
       _id: 'db76c50e-358b-445c-a57c-8344c588a5d5',
       _type: 'bundle',
-      name: 'spring-drop',
+      slug: 'spring-drop',
       _rev: '6z08CvvPnPe5pWSKJ5zPRR',
       icon: 'heart-filled',
       description: 'What a spring drop, allergies galore 🌸',
@@ -47,7 +47,7 @@ describe('BundleMenu', () => {
       _createdAt: '2024-07-02T11:37:06Z',
       _rev: '6z08CvvPnPe5pWSKJ5zJiK',
       _updatedAt: '2024-07-02T11:37:06Z',
-      name: 'autumn-drop',
+      slug: 'autumn-drop',
       authorId: '',
     },
     {
@@ -60,7 +60,7 @@ describe('BundleMenu', () => {
       _type: 'bundle',
       hue: 'red',
       _id: 'f6b2c2cc-1732-4465-bfb3-dd205b5d78e9',
-      name: 'summer-drop',
+      slug: 'summer-drop',
       authorId: '',
     },
   ]
@@ -133,7 +133,7 @@ describe('BundleMenu', () => {
 
     act(() => {
       expect(screen.getByText(mockBundles[0].title)).toBeInTheDocument()
-      expect(screen.getByTestId(`${mockBundles[0].name}-checkmark-icon`)).toBeInTheDocument()
+      expect(screen.getByTestId(`${mockBundles[0].slug}-checkmark-icon`)).toBeInTheDocument()
     })
   })
 

diff --git a/packages/sanity/src/core/bundles/components/dialog/BundleForm.tsx b/packages/sanity/src/core/bundles/components/dialog/BundleForm.tsx
@@ -55,15 +55,11 @@ export function BundleForm(props: {
   const handleBundleTitleChange = useCallback(
     (event: React.ChangeEvent<HTMLInputElement>) => {
       const pickedTitle = event.target.value
-      const pickedNameExists =
-        data && data.find((bundle) => bundle.name === speakingurl(pickedTitle))
+      const newSlug = speakingurl(pickedTitle)
+      const slugExists = data && data.find((bundle) => bundle.slug === newSlug)
       const isEmptyTitle = pickedTitle.trim() === '' && !isInitialRender
 
-      if (
-        isDraftOrPublished(pickedTitle) ||
-        pickedNameExists ||
-        (isEmptyTitle && !isInitialRender)
-      ) {
+      if (isDraftOrPublished(pickedTitle) || slugExists || (isEmptyTitle && !isInitialRender)) {
         if (isEmptyTitle && !isInitialRender) {
           // if the title is empty and it's not the first opening of the dialog, show an error
           // TODO localize text
@@ -77,7 +73,7 @@ export function BundleForm(props: {
             {level: 'error', message: "Title cannot be 'drafts' or 'published'", path: []},
           ])
         }
-        if (pickedNameExists) {
+        if (slugExists) {
           // if the bundle already exists, show an error
           // TODO localize text
           setTitleErrors([{level: 'error', message: 'Bundle already exists', path: []}])
@@ -90,7 +86,7 @@ export function BundleForm(props: {
       }
 
       setIsInitialRender(false)
-      onChange({...value, title: pickedTitle, name: speakingurl(pickedTitle)})
+      onChange({...value, title: pickedTitle, slug: newSlug})
     },
     [data, isInitialRender, onChange, onError, value],
   )

diff --git a/packages/sanity/src/core/bundles/components/dialog/CreateBundleDialog.tsx b/packages/sanity/src/core/bundles/components/dialog/CreateBundleDialog.tsx
@@ -18,7 +18,7 @@ export function CreateBundleDialog(props: CreateBundleDialogProps): JSX.Element
   const [hasErrors, setHasErrors] = useState(false)
 
   const [value, setValue] = useState<Partial<BundleDocument>>({
-    name: '',
+    slug: '',
     title: '',
     hue: 'gray',
     icon: 'cube',
@@ -31,7 +31,7 @@ export function CreateBundleDialog(props: CreateBundleDialogProps): JSX.Element
 
   const handleOnSubmit = useCallback(
     async (event: FormEvent<HTMLFormElement>) => {
-      if (value.name) {
+      if (value.slug) {
         try {
           event.preventDefault()
           setIsCreating(true)
@@ -41,7 +41,7 @@ export function CreateBundleDialog(props: CreateBundleDialogProps): JSX.Element
           console.error(err)
         } finally {
           setIsCreating(false)
-          setPerspective(value.name)
+          setPerspective(value.slug)
           onCreate()
         }
       }

diff --git a/packages/sanity/src/core/bundles/components/dialog/__tests__/BundleForm.test.tsx b/packages/sanity/src/core/bundles/components/dialog/__tests__/BundleForm.test.tsx
@@ -43,7 +43,7 @@ describe('BundleForm', () => {
         icon: 'heart-filled',
         _id: 'db76c50e-358b-445c-a57c-8344c588a5d5',
         _type: 'bundle',
-        name: 'spring-drop',
+        slug: 'spring-drop',
         hue: 'magenta',
         _createdAt: '2024-07-02T11:37:51Z',
       },
@@ -69,7 +69,7 @@ describe('BundleForm', () => {
     const titleInput = screen.getByTestId('bundle-form-title')
     fireEvent.change(titleInput, {target: {value: 'Bundle 1'}})
 
-    expect(onChangeMock).toHaveBeenCalledWith({...valueMock, title: 'Bundle 1', name: 'bundle-1'})
+    expect(onChangeMock).toHaveBeenCalledWith({...valueMock, title: 'Bundle 1', slug: 'bundle-1'})
   })
 
   it('should call onChange when description textarea value changes', () => {

diff --git a/packages/sanity/src/core/bundles/components/dialog/__tests__/CreateBundleDialog.test.tsx b/packages/sanity/src/core/bundles/components/dialog/__tests__/CreateBundleDialog.test.tsx
@@ -60,9 +60,9 @@ describe('CreateBundleDialog', () => {
     expect(onCancelMock).toHaveBeenCalled()
   })
 
-  it('should call createBundle, setPerspective, and onCreate when form is submitted with a valid name', async () => {
+  it('should call createBundle, setPerspective, and onCreate when form is submitted with a valid slug', async () => {
     const value: Partial<BundleDocument> = {
-      name: 'bundle-1',
+      slug: 'bundle-1',
       title: 'Bundle 1',
       hue: 'gray',
       icon: 'cube',
@@ -77,7 +77,7 @@ describe('CreateBundleDialog', () => {
 
     await expect(useBundleOperations().createBundle).toHaveBeenCalledWith(value)
 
-    expect(usePerspective().setPerspective).toHaveBeenCalledWith(value.name)
+    expect(usePerspective().setPerspective).toHaveBeenCalledWith(value.slug)
     expect(onCreateMock).toHaveBeenCalled()
   })
 })
diff --git a/packages/sanity/src/core/bundles/components/panes/BundleActions.tsx b/packages/sanity/src/core/bundles/components/panes/BundleActions.tsx
@@ -25,7 +25,7 @@ interface BundleActionsProps {
  */
 export function BundleActions(props: BundleActionsProps): JSX.Element {
   const {currentGlobalBundle, documentId, documentType} = props
-  const {name, title} = currentGlobalBundle
+  const {slug, title} = currentGlobalBundle
   const {data: bundles, loading} = useBundles()
   const documentStore = useDocumentStore()
 
@@ -51,23 +51,23 @@ export function BundleActions(props: BundleActionsProps): JSX.Element {
         dummyFetch.current = fetchVersions()
       }
       await dummyFetch.current
-      setIsInVersion(versionDocumentExists(documentVersions, name))
+      setIsInVersion(versionDocumentExists(documentVersions, slug))
     }
 
     fetchVersionsInner()
-  }, [bundles, documentId, fetchVersions, documentVersions, name])
+  }, [bundles, documentId, fetchVersions, documentVersions, slug])
 
   const handleAddVersion = useCallback(async () => {
     // only add to version if there isn't already a version in that bundle of this doc
-    if (versionDocumentExists(documentVersions, name)) {
+    if (versionDocumentExists(documentVersions, slug)) {
       toast.push({
         status: 'error',
         title: `There's already a version of this document in the bundle ${title}`,
       })
       return
     }
 
-    const bundleId = `${name}.${documentId}`
+    const bundleId = `${slug}.${documentId}`
 
     setCreatingVersion(true)
 
@@ -88,7 +88,7 @@ export function BundleActions(props: BundleActionsProps): JSX.Element {
     documentStore.pair,
     documentType,
     documentVersions,
-    name,
+    slug,
     newVersion,
     title,
     toast,
@@ -98,7 +98,7 @@ export function BundleActions(props: BundleActionsProps): JSX.Element {
 
   return (
     <Button
-      data-testid={`action-add-to-${name}`}
+      data-testid={`action-add-to-${slug}`}
       // localize text
       text={isInVersion ? `Already in release ${title}` : `Add to ${title}`}
       icon={isInVersion ? CheckmarkIcon : AddIcon}

diff --git a/packages/sanity/src/core/bundles/hooks/usePerspective.tsx b/packages/sanity/src/core/bundles/hooks/usePerspective.tsx
@@ -11,7 +11,7 @@ export interface PerspectiveValue {
   /* Return the current global bundle */
   currentGlobalBundle: Partial<BundleDocument>
   /* Change the perspective in the studio based on the perspective name */
-  setPerspective: (name: string) => void
+  setPerspective: (slug: string) => void
 }
 
 /**
@@ -21,18 +21,18 @@ export function usePerspective(): PerspectiveValue {
   const router = useRouter()
   const {data: bundles} = useBundles()
 
-  const setPerspective = (name: string | undefined) => {
-    if (name === 'drafts') {
+  const setPerspective = (slug: string | undefined) => {
+    if (slug === 'drafts') {
       router.navigateStickyParam('perspective', '')
     } else {
-      router.navigateStickyParam('perspective', `bundle.${name}`)
+      router.navigateStickyParam('perspective', `bundle.${slug}`)
     }
   }
   const selectedBundle =
     router.stickyParams?.perspective && bundles
       ? bundles.find((bundle: Partial<BundleDocument>) => {
           return (
-            `bundle.${bundle.name}`.toLocaleLowerCase() ===
+            `bundle.${bundle.slug}`.toLocaleLowerCase() ===
             router.stickyParams.perspective?.toLocaleLowerCase()
           )
         })

diff --git a/packages/sanity/src/core/bundles/util/const.ts b/packages/sanity/src/core/bundles/util/const.ts
@@ -6,9 +6,8 @@ import {type BundleDocument} from '../../store/bundles/types'
  * @internal
  */
 export const LATEST: Partial<BundleDocument> = {
-  name: 'drafts',
+  slug: 'drafts',
   title: 'Latest',
   icon: undefined,
-  tone: 'gray',
-  //publishAt: '',
+  hue: 'gray',
 }
diff --git a/packages/sanity/src/core/bundles/util/dummyGetters.ts b/packages/sanity/src/core/bundles/util/dummyGetters.ts
@@ -26,7 +26,7 @@ export async function getAllVersionsOfDocument(
   return await client.fetch(query, {}, {tag: 'document.list-versions'}).then((documents) => {
     return documents.map((doc: SanityDocument) => {
       const sluggedName = getVersionName(doc._id)
-      const bundle = bundles?.find((b) => b.name === sluggedName)
+      const bundle = bundles?.find((b) => b.slug === sluggedName)
       return {
         name: speakingurl(sluggedName),
         title: bundle?.title || sluggedName,
@@ -44,8 +44,8 @@ export function getVersionName(documentId: string): string {
   return version
 }
 
-export function versionDocumentExists(documentVersions: BundleDocument[], name: string): boolean {
-  return documentVersions.some((version) => version.name === name)
+export function versionDocumentExists(documentVersions: BundleDocument[], slug: string): boolean {
+  return documentVersions.some((version) => version.slug === slug)
 }
 
 export function isDraftOrPublished(versionName: string): boolean {

diff --git a/packages/sanity/src/core/releases/components/BundleMenuButton/BundleMenuButton.tsx b/packages/sanity/src/core/releases/components/BundleMenuButton/BundleMenuButton.tsx
@@ -29,9 +29,9 @@ export const BundleMenuButton = ({bundle, documentCount}: Props) => {
       setDiscardStatus('discarding')
       await deleteBundle(bundle)
       setDiscardStatus('idle')
-      if (router.state.bundleName) {
+      if (router.state.bundleSlug) {
         // navigate back to bundle overview
-        router.navigate({bundleName: undefined})
+        router.navigate({bundleSlug: undefined})
       }
     } catch (e) {
       setDiscardStatus('error')

diff --git a/.../sanity/src/core/releases/components/BundleMenuButton/__tests__/BundleMenuButton.test.tsx b/.../sanity/src/core/releases/components/BundleMenuButton/__tests__/BundleMenuButton.test.tsx
@@ -39,7 +39,7 @@ describe('BundleMenuButton', () => {
       _type: 'bundle',
       archivedAt: undefined,
       title: 'activeBundle',
-      name: 'activeBundle',
+      slug: 'activeBundle',
       authorId: 'author',
       _createdAt: new Date().toISOString(),
       _updatedAt: new Date().toISOString(),
@@ -68,7 +68,7 @@ describe('BundleMenuButton', () => {
       _type: 'bundle',
       archivedAt: new Date().toISOString(),
       title: 'activeBundle',
-      name: 'activeBundle',
+      slug: 'activeBundle',
       authorId: 'author',
       _createdAt: new Date().toISOString(),
       _updatedAt: new Date().toISOString(),
@@ -96,7 +96,7 @@ describe('BundleMenuButton', () => {
       _type: 'bundle',
       archivedAt: new Date().toISOString(),
       title: 'activeBundle',
-      name: 'activeBundle',
+      slug: 'activeBundle',
       authorId: 'author',
       _createdAt: new Date().toISOString(),
       _updatedAt: new Date().toISOString(),
@@ -129,7 +129,7 @@ describe('BundleMenuButton', () => {
       _type: 'bundle',
       archivedAt: new Date().toISOString(),
       title: 'activeEmptyBundle',
-      name: 'activeEmptyBundle',
+      slug: 'activeEmptyBundle',
       authorId: 'author',
       _createdAt: new Date().toISOString(),
       _updatedAt: new Date().toISOString(),

diff --git a/packages/sanity/src/core/releases/components/ReleaseDocumentPreview.tsx b/packages/sanity/src/core/releases/components/ReleaseDocumentPreview.tsx
@@ -9,15 +9,15 @@ import {getPublishedId} from '../../util/draftUtils'
 interface ReleaseDocumentPreviewProps {
   documentId: string
   documentTypeName: string
-  releaseName: string
+  releaseSlug: string
   previewValues: PreviewValue
   isLoading: boolean
 }
 
 export function ReleaseDocumentPreview({
   documentId,
   documentTypeName,
-  releaseName,
+  releaseSlug,
   previewValues,
   isLoading,
 }: ReleaseDocumentPreviewProps) {
@@ -33,12 +33,12 @@ export function ReleaseDocumentPreview({
               id: getPublishedId(documentId, true),
               type: documentTypeName,
             }}
-            searchParams={[['perspective', `bundle.${releaseName}`]]}
+            searchParams={[['perspective', `bundle.${releaseSlug}`]]}
             ref={ref}
           />
         )
       }),
-    [documentId, documentTypeName, releaseName],
+    [documentId, documentTypeName, releaseSlug],
   )
 
   return (