Added in the address directory

(except for actually rendering the list)
This commit is contained in:
Gordon Pedersen 2024-06-18 17:11:28 +10:00
parent f43e1a7bc1
commit d0ac64e1be
7 changed files with 84 additions and 4 deletions

View file

@ -10,6 +10,10 @@
<i class="emoji medium" data-emoji="👋">👋</i> <i class="emoji medium" data-emoji="👋">👋</i>
<span>Hey, @State.Name.</span> <span>Hey, @State.Name.</span>
</a> </a>
<a class="m s row" href="/directory">
<i class="fa-duotone fa-address-book"></i>
<span>Address Directory</span>
</a>
@foreach (AddressResponseData address in State.AddressList ?? new List<AddressResponseData>()) { @foreach (AddressResponseData address in State.AddressList ?? new List<AddressResponseData>()) {
<a class="row @(address == State.SelectedAddress ? "active" : "")" @onclick="() => changeAddress(address)"> <a class="row @(address == State.SelectedAddress ? "active" : "")" @onclick="() => changeAddress(address)">
<img class="tiny circle avatar" src="https://profiles.cache.lol/@address.Address/picture" alt="@address.Address" /> <img class="tiny circle avatar" src="https://profiles.cache.lol/@address.Address/picture" alt="@address.Address" />

View file

@ -14,3 +14,7 @@
<i class="square fa-duotone fa-seedling"></i> <i class="square fa-duotone fa-seedling"></i>
<div class="label">Now.garden</div> <div class="label">Now.garden</div>
</NavLink> </NavLink>
<NavLink class="l nav-link" href="/directory">
<i class="square fa-duotone fa-address-book"></i>
<div class="label">Address Directory</div>
</NavLink>

View file

@ -0,0 +1,44 @@
@page "/directory"
@implements IDisposable
@inject IJSRuntime JS
@inject State State
<RefreshButton></RefreshButton>
<PageHeading title="Address Directory" icon="fa-duotone fa-address-book">
<Description>Welcome to the <a href="https://home.omg.lol/directory">omg.lol member directory</a>! Everyone here is awesome. <i class="fa-solid fa-sparkles"></i></Description>
</PageHeading>
<div id="directory" class="responsive">
@if (addresses != null) {
@* TODO: Display avatar and address name, grouped by starting letter? *@
}
<LoadingCard id="address-loading" icon="fa-duotone fa-address-book"></LoadingCard>
</div>
@code {
private List<string>? addresses;
protected override async Task OnInitializedAsync() {
await base.OnInitializedAsync();
if (addresses == null || addresses.Count == 0) addresses = await State.GetDirectory();
State.PropertyChanged += StateChanged;
State.CanRefresh = true;
await InvokeAsync(StateHasChanged);
await JS.InvokeVoidAsync("removeElementById", "address-loading");
}
private async void StateChanged(object? sender, PropertyChangedEventArgs e) {
if (e.PropertyName == nameof(State.IsRefreshing) && State.IsRefreshing) {
addresses = await State.GetDirectory(true);
State.IsRefreshing = false;
}
}
public void Dispose() {
State.PropertyChanged -= StateChanged;
State.CanRefresh = false;
}
}

View file

@ -0,0 +1,13 @@
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
namespace Neighbourhood.omg.lol.Models {
public class DirectoryResponseData : IOmgLolResponseData {
public string Message { get; set; }
public string Url { get; set; }
public List<string> Directory { get; set; }
}
}

View file

@ -9,6 +9,7 @@ namespace Neighbourhood.omg.lol.Models {
public List<Pic>? Pics { get; set; } public List<Pic>? Pics { get; set; }
public List<NowData>? NowGarden { get; set; } public List<NowData>? NowGarden { get; set; }
public List<MarkupString>? EphemeralMessages { get; set; } public List<MarkupString>? EphemeralMessages { get; set; }
public List<string>? AddressDirectory { get; set; }
// Account data // Account data
public AccountResponseData? AccountInfo { get; set; } public AccountResponseData? AccountInfo { get; set; }
@ -143,6 +144,13 @@ namespace Neighbourhood.omg.lol.Models {
return this.EphemeralMessages; return this.EphemeralMessages;
} }
public async Task<List<string>?> GetDirectory(bool forceRefresh = false) {
if (forceRefresh || this.AddressDirectory == null || this.AddressDirectory.Count == 0) {
this.AddressDirectory = await api.Directory();
}
return this.AddressDirectory;
}
public async Task<List<Status>?> GetStatuses(bool forceRefresh = false) { public async Task<List<Status>?> GetStatuses(bool forceRefresh = false) {
if (forceRefresh || this.Statuses == null || this.Statuses.Count == 0) { if (forceRefresh || this.Statuses == null || this.Statuses.Count == 0) {
this.Statuses = await api.StatuslogLatest(); this.Statuses = await api.StatuslogLatest();

View file

@ -174,10 +174,12 @@ namespace Neighbourhood.omg.lol {
public async Task<PatchStatusResponseData?> PatchStatus(string address, string id, string content, string? emoji) => public async Task<PatchStatusResponseData?> PatchStatus(string address, string id, string content, string? emoji) =>
(await Patch<PatchStatusResponseData, PatchStatus>($"/address/{address}/statuses/", new PatchStatus { Id = id, Content = content, Emoji = emoji })); (await Patch<PatchStatusResponseData, PatchStatus>($"/address/{address}/statuses/", new PatchStatus { Id = id, Content = content, Emoji = emoji }));
public async Task<List<NowData>?> NowGarden() => public async Task<List<NowData>?> NowGarden() =>
(await Get<NowResponseData>($"/now/garden"))?.Garden ?? new List<NowData>(); (await Get<NowResponseData>($"/now/garden"))?.Garden ?? new List<NowData>();
public async Task<List<string>?> Directory() =>
(await Get<DirectoryResponseData>($"/directory"))?.Directory ?? new List<string>();
public async Task<List<MarkupString>> Ephemeral() { public async Task<List<MarkupString>> Ephemeral() {
List<string> notes = new List<string>(); List<string> notes = new List<string>();
Uri Uri = new Uri($"https://eph.emer.al/"); Uri Uri = new Uri($"https://eph.emer.al/");

View file

@ -218,10 +218,11 @@ dialog {
padding:0; padding:0;
} }
@media only screen and (max-width: 600px) { @media only screen and (max-width: 992px) {
.fab { .fab {
bottom: 7rem; bottom: 7rem;
} }
*:has(> main.responsive) { *:has(> main.responsive) {
/*flex-direction: row;*/ /*flex-direction: row;*/
max-block-size: calc(100vh - 5rem); max-block-size: calc(100vh - 5rem);
@ -378,12 +379,16 @@ a.row.indent {
/* s */ /* s */
@media only screen and (max-width: 600px) { @media only screen and (max-width: 600px) {
.m:not(.s), .l:not(.s), .m.l:not(.s) {
display: none !important;
}
} }
/* m */ /* m */
@media only screen and (min-width: 601px) and (max-width: 992px) { @media only screen and (min-width: 601px) and (max-width: 992px) {
.s:not(.m), .l:not(.m), .s.l:not(.m) {
display: none !important;
}
} }
/* l */ /* l */