notfire/Iceshrimp.NET
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

[frontend/pages] Let emoji search display in empty and error states

Browse source
This commit is contained in:
pancakes 2025-02-07 09:20:41 +10:00
parent 12b22bcf56
commit a16aca11d2
No known key found for this signature in database
GPG key ID: ED53D426432B861B
1 changed files with 21 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
Iceshrimp.Frontend/Pages/Moderation/CustomEmojis.razor
View file

@ -29,20 +29,25 @@
} }
</SectionContent> </SectionContent>
@if (State is State.Loaded)
{
<div class="body"> <div class="body">
@if (State is State.Empty or State.Error or State.Loaded)
{
<div class="emoji-search"> <div class="emoji-search">
<input @bind="EmojiFilter" @bind:event="oninput" @bind:after="FilterEmojis" class="search" type="text" placeholder="Search" aria-label="search"/> <input @bind="EmojiFilter" @bind:event="oninput" @bind:after="FilterEmojis" class="search" type="text"
placeholder="Search" aria-label="search"/>
@if (Source == "remote") @if (Source == "remote")
{ {
<input @bind="HostFilter" @bind:event="oninput" @bind:after="FilterEmojis" class="search" type="text" placeholder="Host" aria-label="host"/> <input @bind="HostFilter" @bind:event="oninput" @bind:after="FilterEmojis" class="search" type="text"
placeholder="Host" aria-label="host"/>
} }
<select class="search-from" @bind="Source" @bind:after="GetEmojis"> <select class="search-from" @bind="Source" @bind:after="GetEmojis">
<option value="local">@Loc["Local"]</option> <option value="local">@Loc["Local"]</option>
<option value="remote">@Loc["Remote"]</option> <option value="remote">@Loc["Remote"]</option>
</select> </select>
</div> </div>
}
@if (State is State.Loaded)
{
@foreach (var category in Categories) @foreach (var category in Categories)
{ {
<span class="category-name">@category.Key</span> <span class="category-name">@category.Key</span>
@ -53,27 +58,23 @@
} }
</div> </div>
} }
</div>
} }
@if (State is State.Empty) @if (State is State.Empty)
{ {
<div class="body">
<i>This instance has no emojis</i> <i>This instance has no emojis</i>
</div>
} }
@if (State is State.Loading) @if (State is State.Loading)
{ {
<div class="body">
<div class="loading"> <div class="loading">
<Icon Name="Icons.Spinner" Size="3rem"/> <Icon Name="Icons.Spinner" Size="3rem"/>
</div> </div>
</div>
} }
<div class="file-input"> <div class="file-input">
<InputFile @ref="UploadInput" OnChange="Upload" accept="image/*">Upload</InputFile> <InputFile @ref="UploadInput" OnChange="Upload" accept="image/*">Upload</InputFile>
<InputFile @ref="ImportInput" OnChange="Import" accept=".zip">Import</InputFile> <InputFile @ref="ImportInput" OnChange="Import" accept=".zip">Import</InputFile>
</div> </div>
</div>
@code { @code {
private List<EmojiResponse> Emojis { get; set; } = []; private List<EmojiResponse> Emojis { get; set; } = [];