From e2d3a71d62021f86adbe486ac65bd048cff422b5 Mon Sep 17 00:00:00 2001
From: Snorre Eskeland Brekke <snorre.e.brekke@gmail.com>
Date: Sun, 20 Oct 2024 15:01:22 +0200
Subject: [PATCH] chore: adds sanity create telemetry

---
 .../create/__telemetry__/create.telemetry.ts  | 32 +++++++++++++
 .../create/components/CreateLinkedActions.tsx | 12 ++++-
 .../components/CreateUnlinkConfirmDialog.tsx  |  5 +-
 .../start-in-create/StartInCreateAction.tsx   | 15 ++++--
 .../start-in-create/StartInCreateDialog.tsx   |  6 ++-
 .../core/create/useSanityCreateTelemetry.ts   | 46 +++++++++++++++++++
 6 files changed, 108 insertions(+), 8 deletions(-)
 create mode 100644 packages/sanity/src/core/create/__telemetry__/create.telemetry.ts
 create mode 100644 packages/sanity/src/core/create/useSanityCreateTelemetry.ts

diff --git a/packages/sanity/src/core/create/__telemetry__/create.telemetry.ts b/packages/sanity/src/core/create/__telemetry__/create.telemetry.ts
new file mode 100644
index 000000000000..8d2473db31e4
--- /dev/null
+++ b/packages/sanity/src/core/create/__telemetry__/create.telemetry.ts
@@ -0,0 +1,32 @@
+import {defineEvent} from '@sanity/telemetry'
+
+export const StartInCreateClicked = defineEvent({
+  name: 'Start in Create clicked',
+  version: 1,
+  description: 'The "Start in Sanity Create" button is clicked.',
+})
+
+export const StartInCreateAccepted = defineEvent({
+  name: 'Start in Create accepted',
+  version: 1,
+  description:
+    'Continue in the "Start in Sanity Create" dialog was pressed, or auto-confirm was enabled.',
+})
+
+export const CreateUnlinkClicked = defineEvent({
+  name: 'Create Unlink clicked',
+  version: 1,
+  description: 'The Unlink action was clicked',
+})
+
+export const CreateUnlinkAccepted = defineEvent({
+  name: 'Create Unlink accepted',
+  version: 1,
+  description: 'User confirmed that they want the Studio document unlinked',
+})
+
+export const EditInCreateClicked = defineEvent({
+  name: 'Edit in Create clicked',
+  version: 1,
+  description: 'User clicked "Edit in Create"',
+})
diff --git a/packages/sanity/src/core/create/components/CreateLinkedActions.tsx b/packages/sanity/src/core/create/components/CreateLinkedActions.tsx
index 4f8b5836b6a9..323058dc7c2e 100644
--- a/packages/sanity/src/core/create/components/CreateLinkedActions.tsx
+++ b/packages/sanity/src/core/create/components/CreateLinkedActions.tsx
@@ -7,6 +7,7 @@ import {useTranslation} from '../../i18n'
 import {createLocaleNamespace} from '../i18n'
 import {type CreateLinkedActionsProps} from '../types'
 import {useCreateDocumentUrl} from '../useCreateDocumentUrl'
+import {useSanityCreateTelemetry} from '../useSanityCreateTelemetry'
 import {CreateUnlinkConfirmDialog} from './CreateUnlinkConfirmDialog'
 
 export function CreateLinkedActions(props: CreateLinkedActionsProps) {
@@ -14,9 +15,17 @@ export function CreateLinkedActions(props: CreateLinkedActionsProps) {
   const {t} = useTranslation(createLocaleNamespace)
   const href = useCreateDocumentUrl(metadata)
 
+  const telemetry = useSanityCreateTelemetry()
+
+  const onEditInCreateClicked = useCallback(() => telemetry.editInCreateClicked(), [telemetry])
+
   const [unlinkConfirm, setUnlinkConfirm] = useState(false)
 
-  const confirmUnlink = useCallback(() => setUnlinkConfirm(true), [])
+  const confirmUnlink = useCallback(() => {
+    setUnlinkConfirm(true)
+    telemetry.unlinkClicked()
+  }, [telemetry])
+
   const cancelUnlink = useCallback(() => setUnlinkConfirm(false), [])
   return (
     <Flex gap={2}>
@@ -27,6 +36,7 @@ export function CreateLinkedActions(props: CreateLinkedActionsProps) {
         mode="ghost"
         paddingY={3}
         href={href}
+        onClick={onEditInCreateClicked}
       />
       <Button text={t('unlink-from-create-button.text')} paddingY={3} onClick={confirmUnlink} />
       {unlinkConfirm && (
diff --git a/packages/sanity/src/core/create/components/CreateUnlinkConfirmDialog.tsx b/packages/sanity/src/core/create/components/CreateUnlinkConfirmDialog.tsx
index a9e12e6b89d0..9d44dc111cfb 100644
--- a/packages/sanity/src/core/create/components/CreateUnlinkConfirmDialog.tsx
+++ b/packages/sanity/src/core/create/components/CreateUnlinkConfirmDialog.tsx
@@ -5,6 +5,7 @@ import {Button, Dialog} from '../../../ui-components'
 import {PatchEvent, unset} from '../../form'
 import {Translate, useTranslation} from '../../i18n'
 import {createLocaleNamespace} from '../i18n'
+import {useSanityCreateTelemetry} from '../useSanityCreateTelemetry'
 
 export interface CreateUnlinkConfirmDialogProps {
   onClose: () => void
@@ -17,14 +18,16 @@ export function CreateUnlinkConfirmDialog(props: CreateUnlinkConfirmDialogProps)
   const id = useId()
   const [unlinking, setUnlinking] = useState(false)
   const {t} = useTranslation(createLocaleNamespace)
+  const telemetry = useSanityCreateTelemetry()
 
   const unlink = useCallback(() => {
     setUnlinking(true)
     onDocumentChange(PatchEvent.from(unset(['_create'])))
+    telemetry.unlinkAccepted()
     // on not calling onClose:
     // when this mutation propagates down the render tree again, this dialog will me unmounted;
     // the code-path leading here will no longer be rendered
-  }, [onDocumentChange])
+  }, [onDocumentChange, telemetry])
 
   return (
     <Dialog id={id} header={t('unlink-from-create-dialog.header')} onClose={onClose}>
diff --git a/packages/sanity/src/core/create/start-in-create/StartInCreateAction.tsx b/packages/sanity/src/core/create/start-in-create/StartInCreateAction.tsx
index d005f02d4719..aa901a22b1d6 100644
--- a/packages/sanity/src/core/create/start-in-create/StartInCreateAction.tsx
+++ b/packages/sanity/src/core/create/start-in-create/StartInCreateAction.tsx
@@ -5,14 +5,15 @@ import {
   type DocumentActionDescription,
   type DocumentActionProps,
 } from '../../config'
-import {useSchema} from '../../hooks'
 import {useTranslation} from '../../i18n'
+import {useSchemaType} from '../../scheduledPublishing/hooks/useSchemaType'
 import {isStartInCreateAutoConfirmed, setStartInCreateAutoConfirm} from '../createStorage'
 import {isSanityCreateExcludedType} from '../createUtils'
 import {createLocaleNamespace} from '../i18n'
 import {type AppIdCache} from '../studio-app/appIdCache'
 import {useStudioAppIdStore} from '../studio-app/useStudioAppIdStore'
 import {type CreateLinkedSanityDocument} from '../types'
+import {useSanityCreateTelemetry} from '../useSanityCreateTelemetry'
 import {CreateLinkingDialog} from './CreateLinkingDialog'
 import {StartInCreateDialog} from './StartInCreateDialog'
 
@@ -40,20 +41,21 @@ export function StartInCreateAction(
 
   const {appId} = useStudioAppIdStore(appIdCache)
   const {t} = useTranslation(createLocaleNamespace)
-  const schema = useSchema()
-  const schemaType = schema.get(type)
-  const isExcludedByOption = schemaType && isSanityCreateExcludedType(schemaType)
+  const schemaType = useSchemaType(type)
+  const telemetry = useSanityCreateTelemetry()
+
   const [isDialogOpen, setDialogOpen] = useState(false)
   const [isLinking, setLinking] = useState(false)
   const [autoConfirm, setAutoConfirm] = useState(() => isStartInCreateAutoConfirmed())
-
   const closeDialog = useCallback(() => setDialogOpen(false), [])
+
   const linkingStarted = useCallback((dontShowAgain: boolean) => {
     setStartInCreateAutoConfirm(dontShowAgain)
     setAutoConfirm(dontShowAgain)
     setLinking(true)
   }, [])
 
+  const isExcludedByOption = schemaType && isSanityCreateExcludedType(schemaType)
   const createLinkId = (draft?._id ?? published?._id ?? liveEdit) ? id : `drafts.${id}`
 
   //appId will always be undefined when start in create is disabled via config
@@ -85,6 +87,9 @@ export function StartInCreateAction(
           ),
         },
     onHandle: () => {
+      if (!isDialogOpen) {
+        telemetry.startInCreateClicked()
+      }
       setDialogOpen(true)
     },
   }
diff --git a/packages/sanity/src/core/create/start-in-create/StartInCreateDialog.tsx b/packages/sanity/src/core/create/start-in-create/StartInCreateDialog.tsx
index 8f535070b625..1d4625e5de5c 100644
--- a/packages/sanity/src/core/create/start-in-create/StartInCreateDialog.tsx
+++ b/packages/sanity/src/core/create/start-in-create/StartInCreateDialog.tsx
@@ -13,6 +13,7 @@ import {createLocaleNamespace} from '../i18n'
 import {type CreateLinkMetadata} from '../types'
 import {getCreateLinkUrl} from '../useCreateDocumentUrl'
 import {useGlobalUserId} from '../useGlobalUserId'
+import {useSanityCreateTelemetry} from '../useSanityCreateTelemetry'
 
 export const CREATE_LINK_TARGET = 'create'
 
@@ -31,6 +32,7 @@ export function StartInCreateDialog(props: StartInCreateDialogProps) {
   const checkboxId = useId()
   const [dontShowAgain, setDontShowAgain] = useState(false)
 
+  const telemetry = useSanityCreateTelemetry()
   const toggleDontShowAgain = useCallback(() => setDontShowAgain((current) => !current), [])
 
   const {patch} = useDocumentOperation(publicId, type)
@@ -56,8 +58,10 @@ export function StartInCreateDialog(props: StartInCreateDialogProps) {
       })
       return
     }
+
     window?.open(createUrl, CREATE_LINK_TARGET)?.focus()
     onLinkingStarted(autoConfirm || dontShowAgain)
+    telemetry.startInCreateAccepted()
 
     //@todo delete me
     setTimeout(() => {
@@ -76,7 +80,7 @@ export function StartInCreateDialog(props: StartInCreateDialogProps) {
         ]),
       )
     }, 10000)
-  }, [patch, createUrl, onLinkingStarted, pushToast, t, dontShowAgain, autoConfirm])
+  }, [patch, createUrl, onLinkingStarted, pushToast, t, dontShowAgain, autoConfirm, telemetry])
 
   useEffect(() => {
     if (autoConfirm && createUrl) {
diff --git a/packages/sanity/src/core/create/useSanityCreateTelemetry.ts b/packages/sanity/src/core/create/useSanityCreateTelemetry.ts
new file mode 100644
index 000000000000..a5670a75c8bf
--- /dev/null
+++ b/packages/sanity/src/core/create/useSanityCreateTelemetry.ts
@@ -0,0 +1,46 @@
+import {useTelemetry} from '@sanity/telemetry/react'
+import {useCallback, useMemo} from 'react'
+
+import {
+  CreateUnlinkAccepted,
+  CreateUnlinkClicked,
+  EditInCreateClicked,
+  StartInCreateAccepted,
+  StartInCreateClicked,
+} from './__telemetry__/create.telemetry'
+
+interface SanityCreateTelemetryHookValue {
+  startInCreateClicked: () => void
+  startInCreateAccepted: () => void
+  unlinkClicked: () => void
+  unlinkAccepted: () => void
+  editInCreateClicked: () => void
+}
+
+/** @internal */
+export function useSanityCreateTelemetry(): SanityCreateTelemetryHookValue {
+  const telemetry = useTelemetry()
+
+  const startInCreateClicked = useCallback(() => telemetry.log(StartInCreateClicked), [telemetry])
+  const startInCreateAccepted = useCallback(() => telemetry.log(StartInCreateAccepted), [telemetry])
+  const unlinkClicked = useCallback(() => telemetry.log(CreateUnlinkClicked), [telemetry])
+  const unlinkAccepted = useCallback(() => telemetry.log(CreateUnlinkAccepted), [telemetry])
+  const editInCreateClicked = useCallback(() => telemetry.log(EditInCreateClicked), [telemetry])
+
+  return useMemo(
+    (): SanityCreateTelemetryHookValue => ({
+      startInCreateClicked,
+      startInCreateAccepted,
+      unlinkClicked,
+      unlinkAccepted,
+      editInCreateClicked,
+    }),
+    [
+      startInCreateClicked,
+      startInCreateAccepted,
+      unlinkClicked,
+      unlinkAccepted,
+      editInCreateClicked,
+    ],
+  )
+}