export function CodeBlock()

in helper/src/components/common.js [25:74]
31 lines of code
6 McCabe index (conditional complexity)

export function CodeBlock({deploycmd, testId, lang, filename, error, hideSave}) {
    const [ copied, setCopied ] = useState(false)

    function copyIt() {
        //console.log("AI:- Button.Copy." + testId)
        appInsights.trackEvent({name: "Button.Copy."+ testId});
        navigator.clipboard.writeText(deploycmd)
        setCopied(true)
        setTimeout(() => setCopied(false), 1000)
    }

    function downloadIt(){
        //console.log("AI:- Button.Save." + testId)
        appInsights.trackEvent({name: "Button.Save."+ testId});
        function dataUrl(data) {return "data:x-application/text," + escape(deploycmd);}
        window.open(dataUrl());
    }

    const onCopyDeployHandler = () => {
        appInsights.trackEvent({name: "Copy."+ testId});
      };

    return [
        <div key="code-header" className="codeHeader" style={{...(error && {borderColor: 'darkred'})}}>
            <span className="language">{lang}</span>
            { error && <div  className="error">{error}</div> }
            { !hideSave &&
            <CommandBarButton
              disabled={error}
              className="action position-relative"
              iconProps={{ iconName: copied? 'Completed' : 'Save'}}
              //styles={{icon: {color: '#171717'}}}
              text={!error ? "Save" : ""}
              primaryActionButtonProps={{download: filename}}
              onClick={downloadIt}/>
            }
            <CommandBarButton
                    disabled={copied || error}
                    className="action position-relative"
                    iconProps={{ iconName: copied? 'Completed' : 'Copy'}}
                    styles={{icon: {color: '#171717'}}}
                    text={!error ? "Copy" : ""}
                    onClick={copyIt}/>
        </div>,

        <pre key="code-pre" className="has-inner-focus"  style={{...(error && {borderColor: 'darkred'})}}>
            <code onCopyCapture={onCopyDeployHandler} className={"lang-" + lang}><span data-lang={lang} data-testid={testId || 'none'} style={{...(error && {color: 'grey'})}}>{deploycmd}</span></code>
        </pre>
    ]
}