[frontend/components] Add drive file menu

This commit is contained in:
pancakes 2024-12-18 15:26:22 +10:00 committed by Laura Hausmann
parent d0477743e6
commit f8c36f1097
No known key found for this signature in database
GPG key ID: D044E84C5BE01605
2 changed files with 91 additions and 5 deletions

View file

@ -2,12 +2,15 @@
@using Iceshrimp.Shared.Schemas.Web @using Iceshrimp.Shared.Schemas.Web
@using Microsoft.Extensions.Localization @using Microsoft.Extensions.Localization
@using Iceshrimp.Assets.PhosphorIcons @using Iceshrimp.Assets.PhosphorIcons
@using Iceshrimp.Frontend.Core.Services
@inject ApiService Api;
@inject IJSRuntime Js;
@inject IStringLocalizer<Localization> Loc; @inject IStringLocalizer<Localization> Loc;
@inject NavigationManager Nav; @inject NavigationManager Nav;
@if (File != null && Folder == null) @if (File != null && Folder == null)
{ {
<div class="drive-entry" @onclick="SelectFile" @onclick:stopPropagation="true"> <div @ref="FileButton" class="drive-entry" @onclick="SelectFile" @onclick:stopPropagation="true">
<div class="labels"> <div class="labels">
@if (File.Description != null) @if (File.Description != null)
{ {
@ -39,6 +42,36 @@
<Icon Name="Icons.File" Size="5em"/> <Icon Name="Icons.File" Size="5em"/>
} }
<span>@File.Filename</span> <span>@File.Filename</span>
<Menu @ref="FileMenu">
<MenuElement Icon="Icons.CursorText" OnSelect="RenameFile">
<Text>@Loc["Rename"]</Text>
</MenuElement>
@if (File.Sensitive)
{
<MenuElement Icon="Icons.Eye" OnSelect="MarkFileNotSensitive">
<Text>@Loc["Mark as not sensitive"]</Text>
</MenuElement>
}
else
{
<MenuElement Icon="Icons.EyeSlash" OnSelect="MarkFileAsSensitive">
<Text>@Loc["Mark as sensitive"]</Text>
</MenuElement>
}
<MenuElement Icon="Icons.ClosedCaptioning" OnSelect="SetFileAltText">
<Text>@Loc["Set alt text"]</Text>
</MenuElement>
<MenuElement Icon="Icons.ArrowSquareOut" OnSelect="OpenFile">
<Text>@Loc["Open"]</Text>
</MenuElement>
<MenuElement Icon="Icons.Share" OnSelect="CopyFileLink">
<Text>@Loc["Copy link"]</Text>
</MenuElement>
<MenuElement Icon="Icons.Trash" OnSelect="DeleteFile">
<Text>@Loc["Delete"]</Text>
</MenuElement>
<ClosingBackdrop OnClose="FileMenu.Close"></ClosingBackdrop>
</Menu>
</div> </div>
} }
@if (Folder != null && File == null) @if (Folder != null && File == null)
@ -52,10 +85,60 @@
@code { @code {
[Parameter] public DriveFileResponse? File { get; set; } = null; [Parameter] public DriveFileResponse? File { get; set; } = null;
[Parameter] public DriveFolderResponse? Folder { get; set; } = null; [Parameter] public DriveFolderResponse? Folder { get; set; } = null;
private Menu FileMenu { get; set; } = null!;
private ElementReference FileButton { get; set; }
private void SelectFile() private void SelectFile() => FileMenu.Toggle(FileButton);
private async Task RenameFile()
{ {
var filename = await Js.InvokeAsync<string?>("prompt", "Rename file", File!.Filename);
if (string.IsNullOrWhiteSpace(filename)) return;
var res = await Api.Drive.UpdateFileAsync(File!.Id, new UpdateDriveFileRequest { Filename = filename.Trim() });
if (res != null)
{
File.Filename = res.Filename;
StateHasChanged();
}
}
private async Task MarkFileSensitive(bool sensitive)
{
var res = await Api.Drive.UpdateFileAsync(File!.Id, new UpdateDriveFileRequest { Sensitive = sensitive});
if (res != null)
{
File.Sensitive = res.Sensitive;
StateHasChanged();
}
}
private async Task MarkFileNotSensitive() => await MarkFileSensitive(false);
private async Task MarkFileAsSensitive() => await MarkFileSensitive(true);
private async Task SetFileAltText()
{
var alt = await Js.InvokeAsync<string?>("prompt", "Set alt text", File!.Description);
if (alt == null) return;
var res = await Api.Drive.UpdateFileAsync(File!.Id, new UpdateDriveFileRequest { Description = string.IsNullOrWhiteSpace(alt) ? null : alt.Trim() });
if (res != null)
{
File.Description = res.Description;
StateHasChanged();
}
}
private void OpenFile() => Js.InvokeVoidAsync("open", File!.Url, "_blank");
private void CopyFileLink() => Js.InvokeVoidAsync("navigator.clipboard.writeText", File!.Url);
private async Task DeleteFile()
{
await Api.Drive.DeleteFileAsync(File!.Id);
File = null;
StateHasChanged();
} }
private void SelectFolder() private void SelectFolder()

View file

@ -19,6 +19,9 @@ internal class DriveControllerModel(ApiClient api)
public Task<DriveFileResponse?> UpdateFileAsync(string id, UpdateDriveFileRequest request) => public Task<DriveFileResponse?> UpdateFileAsync(string id, UpdateDriveFileRequest request) =>
api.CallNullableAsync<DriveFileResponse>(HttpMethod.Patch, $"/drive/{id}", data: request); api.CallNullableAsync<DriveFileResponse>(HttpMethod.Patch, $"/drive/{id}", data: request);
public Task DeleteFileAsync(string id) =>
api.CallNullableAsync(HttpMethod.Delete, $"/drive/{id}");
public Task<DriveFolderResponse?> GetFolderAsync(string? id) => public Task<DriveFolderResponse?> GetFolderAsync(string? id) =>
api.CallNullableAsync<DriveFolderResponse>(HttpMethod.Get, "/drive/folder" + (id != null ? $"/{id}" : "")); api.CallNullableAsync<DriveFolderResponse>(HttpMethod.Get, "/drive/folder" + (id != null ? $"/{id}" : ""));
} }