Merge pull request #27871 from overleaf/dp-pdf-preview-typescript-3

Convert pdf-preview metrics to typescript

GitOrigin-RevId: be8f9f97915e0681f9db4f047ed7af27afa080cf

services/web/frontend/js/features/pdf-preview/util/compiler.ts

@@ -9,7 +9,7 @@ import { signalWithTimeout } from '@/utils/abort-signal'
 import { Dispatch, SetStateAction } from 'react'
 import { OpenDocuments } from '@/features/ide-react/editor/open-documents'
 import { DocumentContainer } from '@/features/ide-react/editor/document-container'
-import { CompileResponseData } from '@ol-types/compile'
+import { CompileOptions, CompileResponseData } from '@ol-types/compile'
 import { DeliveryLatencies } from './types'
 
 const AUTO_COMPILE_MAX_WAIT = 5000
@@ -24,13 +24,6 @@ const PENDING_OP_MAX_WAIT = 10000
 
 const searchParams = new URLSearchParams(window.location.search)
 
-type CompileOptions = {
-  draft?: boolean
-  stopOnFirstError?: boolean
-  isAutoCompileOnLoad?: boolean
-  isAutoCompileOnChange?: boolean
-}
-
 export default class DocumentCompiler {
   compilingRef: React.MutableRefObject<boolean>
   projectId: string
@@ -154,7 +147,7 @@ export default class DocumentCompiler {
         editorId: EDITOR_SESSION_ID,
       }
 
-      const data = await postJSON(
+      const data: CompileResponseData = await postJSON(
         `/project/${this.projectId}/compile?${params}`,
         { body, signal: this.signal }
       )

services/web/frontend/js/features/pdf-preview/util/metrics.ts

@@ -2,6 +2,8 @@ import { v4 as uuid } from 'uuid'
 import { sendMB } from '../../../infrastructure/event-tracking'
 import { trackPdfDownloadEnabled } from './pdf-caching-flags'
 import { debugConsole } from '@/utils/debugging'
+import { DeliveryLatencies } from './types'
+import { CompileResponseData } from '@ol-types/compile'
 
 // VERSION should get incremented when making changes to caching behavior or
 //  adjusting metrics collection.
@@ -10,7 +12,11 @@ const VERSION = 9
 // editing session id
 export const EDITOR_SESSION_ID = uuid()
 
-const pdfCachingMetrics = {
+type PdfCachingMetrics = {
+  viewerId: string
+}
+
+const pdfCachingMetrics: PdfCachingMetrics = {
   viewerId: EDITOR_SESSION_ID,
 }
 
@@ -18,10 +24,21 @@ export function getPdfCachingMetrics() {
   return pdfCachingMetrics
 }
 
-export function trackPdfDownload(response, compileTimeClientE2E, t0) {
+export function trackPdfDownload(
+  response: CompileResponseData,
+  compileTimeClientE2E: number,
+  t0: number
+): {
+  deliveryLatencies: DeliveryLatencies
+  firstRenderDone: (args: {
+    latencyFetch: number
+    latencyRender: number | undefined
+    pdfCachingMetrics: typeof pdfCachingMetrics
+  }) => void
+} {
   const { timings, pdfCachingMinChunkSize } = response
 
-  const deliveryLatencies = {
+  const deliveryLatencies: DeliveryLatencies = {
     compileTimeClientE2E,
     compileTimeServerE2E: timings?.compileE2E,
   }
@@ -30,7 +47,15 @@ export function trackPdfDownload(response, compileTimeClientE2E, t0) {
   // E.g. two pdf detach tabs or pdf detacher plus pdf detach.
   // Let the pdfCachingMetrics round trip to account for pdf-detach.
   let isFirstRender = true
-  function firstRenderDone({ latencyFetch, latencyRender, pdfCachingMetrics }) {
+  function firstRenderDone({
+    latencyFetch,
+    latencyRender,
+    pdfCachingMetrics,
+  }: {
+    latencyFetch: number
+    latencyRender: number | undefined
+    pdfCachingMetrics: PdfCachingMetrics
+  }) {
     if (!isFirstRender) return
     isFirstRender = false
 
@@ -55,7 +80,10 @@ export function trackPdfDownload(response, compileTimeClientE2E, t0) {
   }
 }
 
-function submitCompileMetrics(metrics) {
+type Metrics = DeliveryLatencies &
+  PdfCachingMetrics & { pdfCachingMinChunkSize: number }
+
+function submitCompileMetrics(metrics: Metrics) {
   const leanMetrics = {
     version: VERSION,
     ...metrics,

services/web/frontend/js/features/pdf-preview/util/types.ts

@@ -52,4 +52,7 @@ export type HighlightData = {
 export type DeliveryLatencies = {
   compileTimeClientE2E?: number
   compileTimeServerE2E?: number
+  totalDeliveryTime?: number
+  latencyFetch?: number
+  latencyRender?: number
 }

services/web/types/compile.ts

@@ -32,6 +32,16 @@ export type CompileResponseData = {
   outputFilesArchive?: CompileOutputFile
 
   // assigned on response body by DocumentCompiler in frontend
-  rootDocId?: string
-  options: any
+  rootDocId?: string | null
+  options: CompileOptions
+}
+
+export type CompileOptions = {
+  draft?: boolean
+  stopOnFirstError?: boolean
+  isAutoCompileOnLoad?: boolean
+  isAutoCompileOnChange?: boolean
+  rootResourcePath?: string
+  imageName?: string
+  compiler?: string
 }