@model ViewFilesViewModel
@{
    ViewData.SetActivePage(ServerNavPages.Files, "File Storage");
}

<div class="row">
    <div class="col">
        <div class="d-flex align-items-center justify-content-between mt-n1 mb-4">
            <h3 class="mb-0">@ViewData["Title"]</h3>
            <a asp-action="storage" asp-route-forceChoice="true" asp-route-returnurl="@ViewData["ReturnUrl"]" class="btn btn-secondary d-flex align-items-center">
                <vc:icon symbol="settings" />
                <span class="ms-1">Settings</span>
            </a>
        </div>

        @if (!Model.StorageConfigured)
        {
            <p>
                Before being able to upload you first need to
                <a asp-action="storage" asp-route-forceChoice="true" asp-route-returnurl="@ViewData["ReturnUrl"]">choose your file storage service provider</a>.
                <a href="https://docs.btcpayserver.org/FAQ/ServerSettings/#how-to-upload-files-to-btcpay" target="_blank" rel="noreferrer noopener" title="More information...">
                    <vc:icon symbol="info" />
                </a>
            </p>
        }
        else
        {
            <p>
                Change your <a asp-action="storage" asp-route-forceChoice="true" asp-route-returnurl="@ViewData["ReturnUrl"]">file storage service</a> provider.
                <a href="https://docs.btcpayserver.org/FAQ/ServerSettings/#how-to-upload-files-to-btcpay" target="_blank" rel="noreferrer noopener" title="More information...">
                    <vc:icon symbol="info" />
                </a>
            </p>

            @if (Model.StorageConfigured)
            {
                <form asp-action="CreateFiles" method="post" enctype="multipart/form-data">
                    <div class="d-flex">
                        <input multiple type="file" class="form-control mb-3" name="files" id="files" required>
                        <button class="btn btn-primary mb-3 ms-3" role="button">Upload</button>
                    </div>
                </form>
            }

            @if (Model.DirectUrlByFiles is { Count: > 0 })
            {
                foreach (var fileUrlPair in Model.DirectUrlByFiles)
                {
                    var fileId = fileUrlPair.Key;
                    var file = Model.Files.Single(storedFile => storedFile.Id.Equals(fileId, StringComparison.InvariantCultureIgnoreCase));
                    var url = Url.Action("GetFile", "UIStorage", new { fileId }, Context.Request.Scheme, Context.Request.Host.ToString());
                    <div class="border border-light rounded bg-tile mt-3">
                        <div class="row">
                            <div class="col-sm-12 col-md-4">
                                <div class="input-group">
                                    <div class="form-floating">
                                        <input id="@fileId-name" class="form-control-plaintext" readonly="readonly" value="@file.FileName">
                                        <label>File name</label>
                                    </div>
                                    <button type="button" class="btn btn-link" data-clipboard="@file.FileName">
                                        <vc:icon symbol="copy" />
                                    </button>
                                </div>
                            </div>
                            <div class="col-sm-12 col-md-4 ">
                                <div class="input-group  ">
                                    <div class="form-floating">
                                        <input id="@fileId" class="form-control-plaintext" readonly="readonly" value="@fileId">
                                        <label>File Id</label>
                                    </div>
                                    <button type="button" class="btn btn-link" data-clipboard="@fileId">
                                        <vc:icon symbol="copy" />
                                    </button>
                                </div>
                            </div>
                            <div class=" col-sm-12 col-md-4">
                                <div class="input-group">
                                    <div class="form-floating">
                                        <input id="@fileId-url" class="form-control-plaintext" readonly="readonly" value="@url">
                                        <label>Permanent Url</label>
                                    </div>
                                    <button type="button" class="btn btn-link" data-clipboard="@url">
                                        <vc:icon symbol="copy" />
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                }
            }

            @if (Model.Files.Any())
            {
                <div class="table-responsive">
                    <table class="table table-hover">
                        <thead>
                        <tr>
                            <th>Name</th>
                            <th>Timestamp</th>
                            <th>User</th>
                            <th class="text-end">Actions</th>
                        </tr>
                        </thead>
                        <tbody>
                        @foreach (var file in Model.Files)
                        {
                            <tr>
                                <td>
                                    <a asp-action="Files" asp-route-fileIds="@file.Id">@file.FileName</a>
                                </td>
                                <td>@file.Timestamp.ToBrowserDate()</td>
                                <td>@file.ApplicationUser.UserName</td>
                                <td class="text-end">
                                    <a href="@Url.Action("Files", "UIServer", new {fileIds = new [] { file.Id }})" class="text-nowrap">Get Link</a>
                                    - <a asp-action="DeleteFile" asp-route-fileId="@file.Id">Remove</a>
                                </td>
                            </tr>
                        }
                        </tbody>
                    </table>
                </div>
            }
            else
            {
                <p class="text-secondary mt-3">There are no files yet.</p>
            }
        }
    </div>
</div>