minor: DRY metadata hook

apps/web/src/app/(private)/evaluations/(evaluation)/[evaluationUuid]/editor/_components/EvaluationEditor/Editor/index.tsx

@@ -1,15 +1,15 @@
 'use client'
 
-import { Suspense, useCallback, useEffect, useMemo, useState } from 'react'
+import { Suspense, useCallback, useMemo, useState } from 'react'
 
-import { ConversationMetadata, readMetadata } from '@latitude-data/compiler'
 import { promptConfigSchema } from '@latitude-data/core/browser'
 import {
   Button,
   DocumentTextEditor,
   DocumentTextEditorFallback,
 } from '@latitude-data/web-ui'
 import EditorHeader from '$/components/EditorHeader'
+import { useMetadata } from '$/hooks/useMetadata'
 import useEvaluations from '$/stores/evaluations'
 import useProviderApiKeys from '$/stores/providerApiKeys'
 
@@ -30,11 +30,16 @@ export default function EvaluationEditor({
   )
   const { data: providers } = useProviderApiKeys()
   const [value, setValue] = useState(defaultPrompt)
-  const [metadata, setMetadata] = useState<ConversationMetadata>()
   const configSchema = useMemo(
     () => promptConfigSchema({ providers: providers ?? [] }),
     [providers],
   )
+  const { metadata } = useMetadata({
+    prompt: value,
+    withParameters: EVALUATION_PARAMETERS,
+    configSchema,
+  })
+
   const save = useCallback(
     (val: string) => {
       update({
@@ -52,14 +57,6 @@ export default function EvaluationEditor({
     [setValue],
   )
 
-  useEffect(() => {
-    readMetadata({
-      prompt: value,
-      withParameters: EVALUATION_PARAMETERS,
-      configSchema,
-    }).then(setMetadata)
-  }, [value, configSchema])
-
   if (!evaluation) return null
 
   return (

apps/web/src/app/(private)/projects/[projectId]/versions/[commitUuid]/documents/[documentUuid]/_components/DocumentEditor/Editor/index.tsx

@@ -1,20 +1,9 @@
 'use client'
 
 import path from 'path'
-import {
-  createContext,
-  Suspense,
-  useCallback,
-  useEffect,
-  useMemo,
-  useState,
-} from 'react'
+import { createContext, Suspense, useCallback, useMemo, useState } from 'react'
 
-import {
-  ConversationMetadata,
-  readMetadata,
-  Document as RefDocument,
-} from '@latitude-data/compiler'
+import { Document as RefDocument } from '@latitude-data/compiler'
 import {
   DocumentVersion,
   promptConfigSchema,
@@ -28,6 +17,7 @@ import {
 import { type AddMessagesActionFn } from '$/actions/sdk/addMessagesAction'
 import type { RunDocumentActionFn } from '$/actions/sdk/runDocumentAction'
 import EditorHeader from '$/components/EditorHeader'
+import { useMetadata } from '$/hooks/useMetadata'
 import useDocumentVersions from '$/stores/documentVersions'
 import useProviderApiKeys from '$/stores/providerApiKeys'
 import { useDebouncedCallback } from 'use-debounce'
@@ -68,11 +58,6 @@ export default function DocumentEditor({
   )
   const [value, setValue] = useState(document.content)
   const [isSaved, setIsSaved] = useState(true)
-  const [metadata, setMetadata] = useState<ConversationMetadata>()
-  const configSchema = useMemo(
-    () => promptConfigSchema({ providers }),
-    [providers],
-  )
 
   const debouncedSave = useDebouncedCallback(
     (val: string) => {
@@ -128,14 +113,17 @@ export default function DocumentEditor({
     [readDocumentContent, value],
   )
 
-  useEffect(() => {
-    readMetadata({
-      prompt: value,
-      fullPath: document.path,
-      referenceFn: readDocument,
-      configSchema,
-    }).then(setMetadata)
-  }, [readDocument, configSchema])
+  const configSchema = useMemo(
+    () => promptConfigSchema({ providers }),
+    [providers],
+  )
+
+  const { metadata } = useMetadata({
+    prompt: value,
+    fullPath: document.path,
+    referenceFn: readDocument,
+    configSchema,
+  })
 
   const isMerged = commit.mergedAt !== null
   return (

apps/web/src/app/(private)/projects/[projectId]/versions/[commitUuid]/documents/[documentUuid]/evaluations/[evaluationId]/create-batch/_components/CreateBatchEvaluationModal/index.tsx

@@ -1,10 +1,10 @@
 'use client'
 
-import { useCallback, useEffect, useState } from 'react'
+import { useCallback } from 'react'
 
-import { ConversationMetadata, readMetadata } from '@latitude-data/compiler'
 import { DocumentVersion, EvaluationDto } from '@latitude-data/core/browser'
 import { Button, CloseTrigger, Modal } from '@latitude-data/web-ui'
+import { useMetadata } from '$/hooks/useMetadata'
 import { useNavigate } from '$/hooks/useNavigate'
 import { ROUTES } from '$/services/routes'
 
@@ -42,13 +42,11 @@ export default function CreateBatchEvaluationModal({
       goToDetail()
     },
   })
-  const [metadata, setMetadata] = useState<ConversationMetadata>()
-  useEffect(() => {
-    readMetadata({
-      prompt: document.content ?? '',
-      fullPath: document.path,
-    }).then(setMetadata)
-  }, [document])
+
+  const { metadata } = useMetadata({
+    prompt: document.content ?? '',
+    fullPath: document.path,
+  })
 
   const form = useRunBatchForm({ documentMetadata: metadata })
   const onRunBatch = useCallback(() => {

apps/web/src/hooks/useMetadata.ts

@@ -0,0 +1,18 @@
+import { useEffect, useState } from 'react'
+
+import { ConversationMetadata, readMetadata } from '@latitude-data/compiler'
+
+type Props = Parameters<typeof readMetadata>[0]
+export function useMetadata(props: Props) {
+  const [isLoading, setIsLoading] = useState(true)
+  const [metadata, setMetadata] = useState<ConversationMetadata>()
+  useEffect(() => {
+    setIsLoading(true)
+    readMetadata(props).then((m) => {
+      setMetadata(m)
+      setIsLoading(false)
+    })
+  }, [props])
+
+  return { metadata, isLoading }
+}