[desk-tool] Move "no changes" component/logic to field module

packages/@sanity/desk-tool/src/panes/documentPane/changesPanel/changesPanel.css

@@ -63,6 +63,3 @@
   padding: var(--large-padding) var(--medium-padding);
   overflow: auto;
 }
-
-.changeList {
-}

packages/@sanity/desk-tool/src/panes/documentPane/changesPanel/changesPanel.tsx

@@ -1,12 +1,13 @@
 import React, {useCallback} from 'react'
 import {
-  ObjectDiff,
-  ObjectSchemaType,
-  DocumentChangeContext,
-  DiffTooltip,
   ChangeList,
   Chunk,
-  DocumentChangeContextInstance
+  DiffTooltip,
+  DocumentChangeContext,
+  DocumentChangeContextInstance,
+  NoChanges,
+  ObjectDiff,
+  ObjectSchemaType
 } from '@sanity/field/diff'
 import CloseIcon from 'part:@sanity/base/close-icon'
 import {UserAvatar} from '@sanity/base/components'
@@ -16,7 +17,6 @@ import {useTimeAgo} from '@sanity/base/hooks'
 import {formatTimelineEventLabel} from '../timeline'
 import {useDocumentHistory} from '../documentHistory'
 import {LoadingContent} from './content/loading'
-import {EmptyContent} from './content/empty'
 import {collectLatestAuthorAnnotations} from './helpers'
 
 import styles from './changesPanel.css'
@@ -155,15 +155,13 @@ function Content({
     return <LoadingContent />
   }
 
-  if (!diff || !diff.isChanged) {
-    return <EmptyContent />
+  if (!diff) {
+    return <NoChanges />
   }
 
   return (
     <DocumentChangeContext.Provider value={documentContext}>
-      <div className={styles.changeList}>
-        <ChangeList diff={diff} schemaType={schemaType} />
-      </div>
+      <ChangeList diff={diff} schemaType={schemaType} />
     </DocumentChangeContext.Provider>
   )
 }

packages/@sanity/field/src/diff/components/ChangeList.tsx

@@ -8,6 +8,7 @@ import {buildObjectChangeList} from '../changes/buildChangeList'
 import {undoChange} from '../changes/undoChange'
 import {ChangeResolver} from './ChangeResolver'
 import {DocumentChangeContext} from './DocumentChangeContext'
+import {NoChanges} from './NoChanges'
 import styles from './ChangeList.css'
 
 interface Props {
@@ -20,6 +21,7 @@ export function ChangeList({diff, fields, schemaType}: Props): React.ReactElemen
   const {documentId} = React.useContext(DocumentChangeContext)
   const docOperations = useDocumentOperation(documentId, schemaType.name) as OperationsAPI
   const {path} = React.useContext(DiffContext)
+  const isRoot = path.length === 0
 
   if (schemaType.jsonType !== 'object') {
     throw new Error(`Only object schema types are allowed in ChangeList`)
@@ -41,7 +43,7 @@ export function ChangeList({diff, fields, schemaType}: Props): React.ReactElemen
   )
 
   if (changes.length === 0) {
-    return null
+    return isRoot ? <NoChanges /> : null
   }
 
   return (

packages/@sanity/desk-tool/src/panes/documentPane/changesPanel/content/empty.tsx → packages/@sanity/field/src/diff/components/NoChanges.tsx

@@ -1,8 +1,8 @@
 import React from 'react'
 
-import styles from './empty.css'
+import styles from './NoChanges.css'
 
-export function EmptyContent() {
+export function NoChanges() {
   return (
     <div className={styles.root}>
       <div className={styles.box}>

packages/@sanity/field/src/diff/components/index.ts

@@ -7,3 +7,4 @@ export * from './DiffTooltip'
 export * from './DocumentChangeContext'
 export * from './FromTo'
 export * from './MetaInfo'
+export * from './NoChanges'