Problems with setting up theme in react-monaco-editor

error message:

clipboard.png

Source code:

// Copyright 2017 The genesis-front Authors
// This file is part of the genesis-front library.
// 
// The genesis-front library is free software: you can redistribute it and/or modify
// it under the terms of the GNU Lesser General Public License as published by
// the Free Software Foundation, either version 3 of the License, or
// (at your option) any later version.
// 
// The genesis-front library is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU Lesser General Public License for more details.
// 
// You should have received a copy of the GNU Lesser General Public License
// along with the genesis-front library. If not, see <http://www.gnu.org/licenses/>.

/// <reference types="monaco-editor" />

import * as React from "react";
import styled from "styled-components";
import MonacoEditor from "react-monaco-editor";
import registerProtypo from "./protypo";
import registerSimvolio from "./simvolio";
import platform from "lib/platform";

const StyledEditor = styled.div`
    &.editor-flex {
        display: flex;
        flex-direction: column;
        flex: 1;

        > .react-monaco-editor-container {
            flex: 1;
        }
    }
`;

interface IEditorProps {
    language?: string;
    value?: string;
    width?: number;
    height?: number;
    theme?: string;
    options?: monaco.editor.IEditorOptions;
    onChange?: (code: string) => void;
}

export default class Editor extends React.Component<IEditorProps> {
    public editor: monaco.editor.ICodeEditor;

    editorWillMount(editor: typeof monaco) {
        registerProtypo(editor);
        registerSimvolio(editor);
    }

    render() {
        return (
            <StyledEditor className={this.props.height ? null : "editor-flex"}>
                <MonacoEditor
                    ref={l => this.editor = l && l.editor}
                    language={this.props.language}
                    value={this.props.value}
                    onChange={this.props.onChange && this.props.onChange.bind(this)}
                    editorWillMount={this.editorWillMount.bind(this)}
                    // 
                    theme="vs-dark"
                    options={{
                        automaticLayout: true,
                        contextmenu: false,
                        scrollBeyondLastLine: false,
                        ...this.props.options
                    }}
                    height={this.props.height}
                    requireConfig={{
                        url: platform.select({
                            desktop: "./vs/loader.js",
                            web: "/vs/loader.js"
                        }),
                        baseUrl: platform.select({
                            desktop: "./",
                            web: "/"
                        }),
                        paths: {
                            "vs": "./vs"
                        }
                    }}
                />
            </StyledEditor>
        );
    }
}
Mar.02,2021
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1eb5e89-48364.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1eb5e89-48364.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?