All files / modules/10-common/components/MonacoDiffEditor MonacoDiffEditor.tsx

23.53% Statements 4/17
0% Branches 0/48
0% Functions 0/4
23.53% Lines 4/17

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60              8x 8x                             8x                                                                     8x  
/*
 * Copyright 2021 Harness Inc. All rights reserved.
 * Use of this source code is governed by the PolyForm Shield 1.0.0 license
 * that can be found in the licenses directory at the root of this repository, also available at
 * https://polyformproject.org/wp-content/uploads/2020/06/PolyForm-Shield-1.0.0.txt.
 */
 
import React, { MutableRefObject } from 'react'
import { MonacoDiffEditor as ReactMonacoDiffEditor } from 'react-monaco-editor'
import type { MonacoDiffEditorProps, DiffEditorWillMount } from 'react-monaco-editor'
 
export type ReactMonacoEditorRef =
  | ((instance: ReactMonacoDiffEditor | null) => void)
  | MutableRefObject<ReactMonacoDiffEditor | null>
  | null
 
export interface ExtendedMonacoDiffEditorProps extends MonacoDiffEditorProps {
  name?: string
  'data-testid'?: string
}
 
export type Monaco = Parameters<DiffEditorWillMount>[0]
 
const MonacoDiffEditor = (props: ExtendedMonacoDiffEditorProps, ref: ReactMonacoEditorRef) => {
  const monacoRef = React.useRef<Monaco | null>(null)
 
  React.useEffect(() => {
    const remeasureFonts = () => {
      monacoRef?.current?.editor?.remeasureFonts()
    }
 
    // TODO: font name should be a global (for all)
    const loaded = (document as any).fonts?.check?.('1em Roboto Mono')
 
    if (loaded) {
      remeasureFonts()
    } else {
      ;(document as any).fonts?.ready?.then?.(remeasureFonts)
    }
  }, [])
 
  const editorWillMount: DiffEditorWillMount = monaco => {
    monacoRef.current = monaco
    monaco?.editor?.defineTheme('disable-theme', {
      base: 'vs',
      inherit: true,
      rules: [],
      colors: {
        'editor.background': '#f3f3fa'
      }
    })
  }
 
  const theme = props.options?.readOnly ? 'disable-theme' : 'vs'
 
  return <ReactMonacoDiffEditor {...props} ref={ref} theme={theme} editorWillMount={editorWillMount} />
}
 
export default React.forwardRef(MonacoDiffEditor)