Modal Service does not show a modal window

[hunterlan]

Hi there! I have a problem with showing a modal window.

Here's my page where I want to show it:

@code {
    [SupplyParameterFromForm]
    private LoginUser? LoginUser { get; set; }

    protected override void OnInitialized() => LoginUser ??= new LoginUser();
    [Inject] ModalService ModalService { get; set; } = default!;
    private async Task Submit()
    {
        var serialized = JsonSerializer.Serialize(LoginUser);
        var stringContent = new StringContent(serialized, System.Text.Encoding.UTF8, "application/json");

        var result = await HttpClient.PostAsync($"api/User/Login", stringContent).ConfigureAwait(true);
        if (result.IsSuccessStatusCode)
        {
            var jsonTokenString = await result.Content.ReadAsStringAsync();
            var token = JsonSerializer.Deserialize<TokenDto>(jsonTokenString, new JsonSerializerOptions{PropertyNamingPolicy = JsonNamingPolicy.CamelCase});
            await ProtectedSessionStore.SetAsync("token", token!.Token);
            await ShowSuccess("Now, you can edit information on website!");
        }
        else
        {
            if (result.StatusCode == HttpStatusCode.Unauthorized)
            {
                await ShowError("Email or/and password are incorrect!");

            }
            else
            {
                await ShowError("Something went wrong");
            }
        }
    }

    private async Task ShowError(string message)
    {
        var modalOption = new ModalOption
        {
            Title = "Error",
            Message = message,
            Type = ModalType.Danger,
            Size = ModalSize.Regular
        };

        await ModalService.ShowAsync(modalOption);
    }
    
    private async Task ShowSuccess(string message)
    {
        var modalOption = new ModalOption
        {
            Title = "Success",
            Message = message,
            Type = ModalType.Success,
            Size = ModalSize.Regular
        };

        await ModalService.ShowAsync(modalOption);
    }

}

Here's my MainLayout.razor:

@inherits LayoutComponentBase

<div class="page">
    <div class="sidebar">
        <NavMenu/>
    </div>

    <main>

        <article class="content px-4">
            @Body
        </article>
    </main>
</div>

<div id="blazor-error-ui">
    An unhandled error has occurred.
    <a href="" class="reload">Reload</a>
    <a class="dismiss">🗙</a>
</div>

<Preload LoadingText="Loading..." />
<Modal IsServiceModal="true" />

What am I doing wrong? The page which I mentioned is interactive and rendered on server-side.