[frontend/pages] Improve state management, use authorization and include alt text
This commit is contained in:
parent
f3fe34e051
commit
2f18a3e75c
1 changed files with 50 additions and 3 deletions
|
@ -1,20 +1,24 @@
|
||||||
@page "/drive"
|
@page "/drive"
|
||||||
@page "/drive/{Id}"
|
@page "/drive/{Id}"
|
||||||
|
@attribute [Authorize]
|
||||||
@using Iceshrimp.Frontend.Localization
|
@using Iceshrimp.Frontend.Localization
|
||||||
@using Microsoft.AspNetCore.Components.Sections
|
@using Microsoft.AspNetCore.Components.Sections
|
||||||
@using Microsoft.Extensions.Localization
|
@using Microsoft.Extensions.Localization
|
||||||
@using Iceshrimp.Assets.PhosphorIcons
|
@using Iceshrimp.Assets.PhosphorIcons
|
||||||
|
@using Iceshrimp.Frontend.Core.Miscellaneous
|
||||||
@using Iceshrimp.Frontend.Core.Services
|
@using Iceshrimp.Frontend.Core.Services
|
||||||
@using Iceshrimp.Shared.Schemas.Web
|
@using Iceshrimp.Shared.Schemas.Web
|
||||||
|
@using Microsoft.AspNetCore.Authorization
|
||||||
@inject ApiService Api;
|
@inject ApiService Api;
|
||||||
@inject IStringLocalizer<Localization> Loc;
|
@inject IStringLocalizer<Localization> Loc;
|
||||||
|
@inject ILogger<DrivePage> Logger;
|
||||||
|
|
||||||
<SectionContent SectionName="top-bar">
|
<SectionContent SectionName="top-bar">
|
||||||
<Icon Name="Icons.Cloud"></Icon>
|
<Icon Name="Icons.Cloud"></Icon>
|
||||||
@Loc["Drive"]
|
@Loc["Drive"]
|
||||||
</SectionContent>
|
</SectionContent>
|
||||||
|
|
||||||
@if (Folder != null)
|
@if (_state == State.Loaded && Folder != null)
|
||||||
{
|
{
|
||||||
<ol class="drive-files">
|
<ol class="drive-files">
|
||||||
@foreach (var el in Folder.Folders)
|
@foreach (var el in Folder.Folders)
|
||||||
|
@ -29,7 +33,7 @@
|
||||||
<li class="drive-entry">
|
<li class="drive-entry">
|
||||||
@if (el.ContentType.StartsWith("image"))
|
@if (el.ContentType.StartsWith("image"))
|
||||||
{
|
{
|
||||||
<img class="thumbnail" src="@el.ThumbnailUrl"/>
|
<img class="thumbnail" src="@el.ThumbnailUrl" alt="@el.Description"/>
|
||||||
}
|
}
|
||||||
else if (el.ContentType.StartsWith("audio"))
|
else if (el.ContentType.StartsWith("audio"))
|
||||||
{
|
{
|
||||||
|
@ -48,13 +52,56 @@
|
||||||
}
|
}
|
||||||
</ol>
|
</ol>
|
||||||
}
|
}
|
||||||
|
@if (_state == State.Loading)
|
||||||
|
{
|
||||||
|
<div>Loading</div>
|
||||||
|
}
|
||||||
|
@if (_state == State.NotFound)
|
||||||
|
{
|
||||||
|
<div>This folder does not exist</div>
|
||||||
|
}
|
||||||
|
@if (_state == State.Error)
|
||||||
|
{
|
||||||
|
<div>An error occured while loading the drive folder. Please inspect logs.</div>
|
||||||
|
}
|
||||||
|
|
||||||
@code {
|
@code {
|
||||||
[Parameter] public string? Id { get; set; }
|
[Parameter] public string? Id { get; set; }
|
||||||
private DriveFolderResponse? Folder { get; set; } = null;
|
private DriveFolderResponse? Folder { get; set; } = null;
|
||||||
|
private State _state { get; set; }
|
||||||
|
|
||||||
protected override async Task OnParametersSetAsync()
|
private async Task Load()
|
||||||
|
{
|
||||||
|
Logger.LogTrace($"Opening drive folder: {Id ?? "root"}");
|
||||||
|
_state = State.Loading;
|
||||||
|
|
||||||
|
try
|
||||||
{
|
{
|
||||||
Folder = await Api.Drive.GetFolderAsync(Id);
|
Folder = await Api.Drive.GetFolderAsync(Id);
|
||||||
}
|
}
|
||||||
|
catch (ApiException e)
|
||||||
|
{
|
||||||
|
Logger.LogWarning($"Failed to load folder '{Id ?? "root"}' due to API Exception: {e.Message}");
|
||||||
|
_state = State.Error;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (Folder == null)
|
||||||
|
{
|
||||||
|
_state = State.NotFound;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
_state = State.Loaded;
|
||||||
|
}
|
||||||
|
|
||||||
|
protected override async Task OnInitializedAsync()
|
||||||
|
{
|
||||||
|
await Load();
|
||||||
|
}
|
||||||
|
|
||||||
|
protected override async Task OnParametersSetAsync()
|
||||||
|
{
|
||||||
|
await Load();
|
||||||
|
}
|
||||||
}
|
}
|
Loading…
Add table
Reference in a new issue