Moonlight/Moonlight/Shared/Components/FileManagerPartials/FileEditor.razor

@using BlazorMonaco
@using Moonlight.App.Services
@using Moonlight.App.Services.Interop
@using Moonlight.App.Services.Sessions
@using Moonlight.Shared.Components.Partials

@inject SmartTranslateService TranslationService
@inject KeyListenerService KeyListenerService
@inject IJSRuntime JsRuntime

@implements IDisposable

<div class="card bg-black rounded">
    <div class="card-body">
        <MonacoEditor CssClass="h-100" @ref="Editor" Id="vseditor" ConstructionOptions="(x) => EditorOptions"/>
    </div>
    
    @if (!HideControls)
    {
        <div class="card-footer">
            <div class="btn-group">
                <WButton 
                    Text="@(TranslationService.Translate("Save"))" 
                    WorkingText="@(TranslationService.Translate("Saving"))" 
                    OnClick="Submit"></WButton>
                <WButton 
                    CssClasses="btn-danger" 
                    Text="@(TranslationService.Translate("Cancel"))" 
                    WorkingText="@(TranslationService.Translate("Canceling"))" 
                    OnClick="Cancel"></WButton>
            </div>
        </div>
    }
</div>

@code
{
    [Parameter]
    public string InitialData { get; set; }
    
    [Parameter]
    public string Language { get; set; }

    [Parameter]
    public bool HideControls { get; set; } = false;
    
    // Events
    [Parameter]
    public Action<string> OnSubmit { get; set; }
    
    [Parameter]
    public Action OnCancel { get; set; }

    // Monaco Editor
    private MonacoEditor Editor;
    private StandaloneEditorConstructionOptions EditorOptions;

    protected override void OnInitialized()
    {
        EditorOptions = new()
        {
            AutomaticLayout = true,
            Language = "plaintext",
            Value = "Loading content",
            Theme = "moonlight-theme",
            Contextmenu = false,
            Minimap = new()
            {
                Enabled = false
            },
            AutoIndent = true
        };
        
        KeyListenerService.KeyPressed += KeyPressed;
    }

    private async void KeyPressed(object? sender, string e)
    {
        if (e == "saveShortcut")
        {
            await Submit();
        }
    }

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender)
        {
            await JsRuntime.InvokeVoidAsync("moonlight.loading.loadMonaco");
            
            Editor.OnDidInit = new EventCallback<MonacoEditorBase>(this, async () =>
            {
                EditorOptions.Language = Language;
        
                var model = await Editor.GetModel();
                await MonacoEditorBase.SetModelLanguage(model, EditorOptions.Language);
                await Editor.SetPosition(new Position()
                {
                    Column = 0,
                    LineNumber = 1
                });
        
                await Editor.SetValue(InitialData);
        
                await Editor.Layout(new Dimension()
                {
                    Height = 500,
                    Width = 1000
                }); 
            });
        }
    }

    private async Task Submit()
    {
        var data = await Editor.GetValue();
        await InvokeAsync(() => OnSubmit?.Invoke(data));
    }
    
    private async Task Cancel()
    {
        await InvokeAsync(() => OnCancel?.Invoke());
    }

    public async Task<string> GetData()
    {
        return await Editor.GetValue();
    }

    public void Dispose()
    {
        Editor.Dispose();
        KeyListenerService.KeyPressed -= KeyPressed;
    }
}