diff --git a/BTCPayApp.UI/Components/AppItemsEditor.razor b/BTCPayApp.UI/Components/AppItemsEditor.razor index a68e7da..f5adb8e 100644 --- a/BTCPayApp.UI/Components/AppItemsEditor.razor +++ b/BTCPayApp.UI/Components/AppItemsEditor.razor @@ -1,6 +1,11 @@ +@using BTCPayApp.Core.Auth +@using BTCPayApp.Core.Contracts @using BTCPayApp.UI.Models +@using BTCPayApp.UI.Util @using Plk.Blazor.DragDrop @inject IJSRuntime JS +@inject IAccountManager AccountManager +@inject IDataDirectoryProvider DataDirectoryProvider
@@ -60,7 +65,7 @@
@if (SelectedItem != null) { - +
@@ -95,11 +100,28 @@ }
- -
- - - +
+
+
+ + @if (!string.IsNullOrEmpty(SelectedItem.ImageUrl)) + { + + } +
+ + +
+ + +
+
+ @if (!string.IsNullOrEmpty(SelectedItem.ImageUrl)) + { + @SelectedItem.Title + }
@@ -136,6 +158,8 @@
@code { + [Parameter, EditorRequired] + public string AppId { get; set; } = null!; [Parameter, EditorRequired] public string Currency { get; set; } = null!; @@ -148,18 +172,19 @@ } } - private List? _items; - [Parameter(CaptureUnmatchedValues = true)] public Dictionary? InputAttributes { get; set; } + private List? _items; + private Guid _inputFileId = Guid.NewGuid(); private ValidationEditContext? _validationEditContext; - private string? _successMessage; - private AppItemModel? SelectedItem { get; set; } + private string? _successMessage; + private string? _errorMessage; private async Task SelectItem(AppItemModel? item) { + _errorMessage = null; SelectedItem = item; await (SelectedItem != null ? ShowOffcanvas() : HideOffcanvas()); } @@ -193,5 +218,54 @@ if (string.IsNullOrEmpty(SelectedItem?.Id) && !string.IsNullOrEmpty(SelectedItem?.Title)) SelectedItem.Id = SelectedItem.Title; } + private async Task LoadImage(InputFileChangeEventArgs e) + { + try + { + var appData = await DataDirectoryProvider.GetAppDataDirectory(); + var fileName = e.File.Name; + var dirPath = Path.Combine(appData, "tmp"); + var filePath = Path.Combine(dirPath, fileName); + Directory.CreateDirectory(dirPath); + + await using FileStream fs = new(filePath, FileMode.Create); + await e.File.OpenReadStream().CopyToAsync(fs); + await fs.FlushAsync(); + SelectedItem!.ImagePath = filePath; + _errorMessage = null; + } + catch (Exception ex) + { + _errorMessage = $"Image could not be applied: {ex.Message}"; + } + } + + private async Task UploadImage() + { + if (string.IsNullOrEmpty(SelectedItem!.ImagePath)) return; + try + { + var path = SelectedItem.ImagePath; + var mimeType = FileHelper.GetContentType(path); + var upload = await AccountManager.GetClient().UploadAppItemImage(AppId, path, mimeType); + SelectedItem.ImageUrl = upload.Url; + // cleanup + File.Delete(path); + SelectedItem.ImagePath = null; + _inputFileId = Guid.NewGuid(); + } + catch (Exception ex) + { + _errorMessage = $"Image could not be uploaded: {ex.Message}"; + } + } + + private async Task UnsetImage() + { + SelectedItem!.ImageUrl = null; + SelectedItem.ImagePath = null; + _inputFileId = Guid.NewGuid(); + } + private string CssClass => $"editor {(InputAttributes?.ContainsKey("class") is true ? InputAttributes["class"] : "")}".Trim(); } diff --git a/BTCPayApp.UI/Components/AppItemsEditor.razor.css b/BTCPayApp.UI/Components/AppItemsEditor.razor.css index 96e9a2a..19f0c72 100644 --- a/BTCPayApp.UI/Components/AppItemsEditor.razor.css +++ b/BTCPayApp.UI/Components/AppItemsEditor.razor.css @@ -34,6 +34,12 @@ border-radius: var(--btcpay-border-radius); } +.editor .item-image { + height: 2.1rem; + width: 2.1rem; + object-fit: cover; +} + .editor fieldset .list-group-item { padding: var(--btcpay-space-m) 0 var(--btcpay-space-m); } diff --git a/BTCPayApp.UI/Models/AppItemModel.cs b/BTCPayApp.UI/Models/AppItemModel.cs index 8518fd0..aacc696 100644 --- a/BTCPayApp.UI/Models/AppItemModel.cs +++ b/BTCPayApp.UI/Models/AppItemModel.cs @@ -15,8 +15,11 @@ public class AppItemModel public string? Categories { get; set; } public int? Inventory { get; set; } public string? Description { get; set; } + [Url] [JsonPropertyName("image")] public string? ImageUrl { get; set; } + [JsonIgnore] + public string? ImagePath { get; set; } public string? BuyButtonText { get; set; } public bool Disabled { get; set; } [JsonIgnore] diff --git a/BTCPayApp.UI/Pages/Settings/PosPage.razor b/BTCPayApp.UI/Pages/Settings/PosPage.razor index 7ca3341..781919c 100644 --- a/BTCPayApp.UI/Pages/Settings/PosPage.razor +++ b/BTCPayApp.UI/Pages/Settings/PosPage.razor @@ -73,7 +73,7 @@ {

Products

- +
} diff --git a/submodules/btcpayserver b/submodules/btcpayserver index 9a49489..9665c5c 160000 --- a/submodules/btcpayserver +++ b/submodules/btcpayserver @@ -1 +1 @@ -Subproject commit 9a49489043e76f48a37b4f02d103b5b4cfa93f2a +Subproject commit 9665c5c67d63181026bd276f007e8a18155f8b00