export function renderBrowserDownloadInstructions()

in editor/dialogs.tsx [64:109]
46 lines of code
4 McCabe index (conditional complexity)

export function renderBrowserDownloadInstructions(): JSX.Element {
    const boardName = pxt.appTarget.appTheme.boardName || lf("device");
    const boardDriveName = pxt.appTarget.appTheme.driveDisplayName || pxt.appTarget.compile.driveName || "???";
    return <div className="ui grid stackable upload">
        <div className="column sixteen wide instructions">
            <div className="ui grid">
                <div className="row">
                    <div className="column">
                        <div className="ui two column grid padded">
                            <div className="column">
                                <div className="ui">
                                    <div className="image">
                                        <img alt={lf("Comic connecting micro:bit to computer")} className="ui medium rounded image" src="./static/download/connect.png" />
                                    </div>
                                    <div className="content">
                                        <div className="description">
                                            <span className="ui purple circular label">1</span>
                                            <strong>{lf("Connect the {0} to your computer with a USB cable", boardName)}</strong>
                                            <br />
                                            <span className="ui small">{lf("Use the microUSB port on the top of the {0}", boardName)}</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div className="column">
                                <div className="ui">
                                    <div className="image">
                                        <img alt={lf("Comic moving hex file to micro:bit")} className="ui medium rounded image" src="./static/download/transfer.png" />
                                    </div>
                                    <div className="content">
                                        <div className="description">
                                            <span className="ui purple circular label">2</span>
                                            <strong>{lf("Move the .hex file to the {0}", boardName)}</strong>
                                            <br />
                                            <span className="ui small">{lf("Locate the downloaded .hex file and drag it to the {0} drive", boardDriveName)}</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>;
}