[google-maps-input] Refactor to use @sanity/field dependency

sanity-io · Oct 6, 2020 · 8c7019a · 8c7019a
1 parent 01a36a1
commit 8c7019a
Show file tree

Hide file tree

Showing 6 changed files with 31 additions and 30 deletions.
diff --git a/packages/@sanity/google-maps-input/package.json b/packages/@sanity/google-maps-input/package.json
@@ -26,6 +26,7 @@
     "@sanity/check": "1.150.1",
     "@sanity/components": "1.150.3",
     "@sanity/diff": "1.150.1",
+    "@sanity/field": "1.150.1",
     "@types/googlemaps": "^3.39.11",
     "lodash": "^4.17.15",
     "rimraf": "^2.7.1"

diff --git a/packages/@sanity/google-maps-input/src/diff/GeopointArrayDiff.tsx b/packages/@sanity/google-maps-input/src/diff/GeopointArrayDiff.tsx
@@ -1,13 +1,13 @@
 import * as React from 'react'
-import {ArrayDiff} from '@sanity/diff'
-import {GeopointSchemaType, Geopoint, Annotation} from '../types'
+import {ArrayDiff, ObjectDiff, Diff} from '@sanity/field/diff'
+import {GeopointSchemaType, Geopoint} from '../types'
 import {GoogleMapsLoadProxy} from '../loader/GoogleMapsLoadProxy'
 import {GoogleMap} from '../map/Map'
 import {GeopointMove} from './GeopointMove'
 import styles from './GeopointFieldDiff.css'
 
 export interface DiffProps {
-  diff: ArrayDiff<Annotation, Geopoint>
+  diff: ArrayDiff<Geopoint>
   schemaType: GeopointSchemaType
 }
 
@@ -39,24 +39,31 @@ function GeopointDiff({api, diff}: DiffProps & {api: typeof window.google.maps})
     >
       {map => (
         <>
-          {diff.items
-            .filter(item => item.diff.action !== 'unchanged' && item.diff.type === 'object')
-            .map(({toIndex, diff: pointDiff}) => (
-              // @todo revisit diff type with holm
+          {diff.items.map(({toIndex, diff: pointDiff}) => {
+            if (!isChangeDiff(pointDiff)) {
+              return null
+            }
+
+            return (
               <GeopointMove
                 key={toIndex}
                 api={api}
                 map={map}
                 diff={pointDiff}
                 label={`${toIndex}`}
               />
-            ))}
+            )
+          })}
         </>
       )}
     </GoogleMap>
   )
 }
 
+function isChangeDiff(diff: Diff): diff is ObjectDiff<Geopoint> {
+  return diff.action !== 'unchanged' && diff.type === 'object'
+}
+
 function getBounds(
   fromValue: google.maps.LatLngLiteral[] | null | undefined,
   toValue: google.maps.LatLngLiteral[] | null | undefined,

diff --git a/packages/@sanity/google-maps-input/src/diff/GeopointFieldDiff.tsx b/packages/@sanity/google-maps-input/src/diff/GeopointFieldDiff.tsx
@@ -1,13 +1,13 @@
 import * as React from 'react'
-import {ObjectDiff} from '@sanity/diff'
-import {GeopointSchemaType, Geopoint, Annotation} from '../types'
+import {ObjectDiff} from '@sanity/field/diff'
+import {GeopointSchemaType, Geopoint} from '../types'
 import {GoogleMapsLoadProxy} from '../loader/GoogleMapsLoadProxy'
 import {GoogleMap} from '../map/Map'
 import {GeopointMove} from './GeopointMove'
 import styles from './GeopointFieldDiff.css'
 
 export interface DiffProps {
-  diff: ObjectDiff<Annotation, Geopoint>
+  diff: ObjectDiff<Geopoint>
   schemaType: GeopointSchemaType
 }
 

diff --git a/packages/@sanity/google-maps-input/src/diff/GeopointMove.tsx b/packages/@sanity/google-maps-input/src/diff/GeopointMove.tsx
@@ -1,22 +1,22 @@
 import * as React from 'react'
 import * as ReactDOM from 'react-dom'
-import {ObjectDiff} from '@sanity/diff'
-import {useUserColorManager} from '@sanity/base'
+import {ObjectDiff, Annotation} from '@sanity/field/diff'
+//import {useUserColorManager} from '@sanity/base'
 import {useUser} from '@sanity/react-hooks'
 import {UserAvatar} from '@sanity/components/presence'
 import {Marker} from '../map/Marker'
 import {Arrow} from '../map/Arrow'
-import {Geopoint, Annotation} from '../types'
+import {Geopoint} from '../types'
 
 interface Props {
   api: typeof window.google.maps
   map: google.maps.Map
-  diff: ObjectDiff<Annotation, Geopoint>
+  diff: ObjectDiff<Geopoint>
   label?: string
 }
 
 export function GeopointMove({diff, api, map, label}: Props) {
-  const userColorManager = useUserColorManager()
+  //const userColorManager = useUserColorManager()
   const {fromValue: from, toValue: to} = diff
   const annotation = diff.isChanged ? diff.annotation : undefined
   const fromRef = React.useRef<google.maps.Marker>()
@@ -61,7 +61,7 @@ export function GeopointMove({diff, api, map, label}: Props) {
           from={from}
           to={to}
           zIndex={1}
-          color={annotation ? userColorManager.get(annotation.author) : undefined}
+          //color={annotation ? userColorManager.get(annotation.author) : undefined}
         />
       )}
       {to && (
@@ -101,5 +101,5 @@ function UserItem(props: {userId: string}) {
 }
 
 function AnnotationInfo({annotation}: {annotation: Annotation}) {
-  return <UserItem userId={annotation.author} />
+  return annotation && <UserItem userId={annotation.author} />
 }
diff --git a/packages/@sanity/google-maps-input/src/diff/resolver.ts b/packages/@sanity/google-maps-input/src/diff/resolver.ts
@@ -1,4 +1,5 @@
-import {GeopointSchemaType, ArraySchemaType} from '../types'
+import {ArraySchemaType} from '@sanity/field/diff'
+import {GeopointSchemaType} from '../types'
 import {GeopointFieldDiff} from './GeopointFieldDiff'
 import {GeopointArrayDiff} from './GeopointArrayDiff'
 

diff --git a/packages/@sanity/google-maps-input/src/types.ts b/packages/@sanity/google-maps-input/src/types.ts
@@ -1,3 +1,5 @@
+import {ObjectSchemaType} from '@sanity/field/diff'
+
 export interface LatLng {
   lat: number
   lng: number
@@ -11,16 +13,6 @@ export interface Geopoint {
   alt?: number
 }
 
-export interface GeopointSchemaType {
+export interface GeopointSchemaType extends ObjectSchemaType {
   name: 'geopoint'
-  title?: string
-  description?: string
-}
-
-export interface ArraySchemaType {
-  name: 'array'
-  of: {name: string}[]
 }
-
-// @todo replace
-export type Annotation = {author: string}