From 93b49f253308d1ef58ac6b22f53616ceeed65e1f Mon Sep 17 00:00:00 2001 From: Gordon Pedersen Date: Tue, 2 Jul 2024 12:55:07 +1000 Subject: [PATCH] Tidying up the feed feature --- Classes/FeatureFlags.cs | 2 +- Classes/State.cs | 6 +- Components/Layout/AvatarMenuLinks.razor | 16 +++-- Components/Layout/FollowingList.razor | 23 ------- Components/Layout/NavLinks.razor | 38 ++++++------ Components/Pages/Ephemeral.razor | 2 +- Components/Pages/Feed.razor | 80 ++++++++++++++++++++++--- Components/Pages/Person.razor | 4 +- Components/PicCard.razor | 59 +++++++++--------- wwwroot/css/style.css | 24 +++++++- 10 files changed, 159 insertions(+), 95 deletions(-) delete mode 100644 Components/Layout/FollowingList.razor diff --git a/Classes/FeatureFlags.cs b/Classes/FeatureFlags.cs index a0c24b5..779955d 100644 --- a/Classes/FeatureFlags.cs +++ b/Classes/FeatureFlags.cs @@ -1,5 +1,5 @@ namespace Neighbourhood.omg.lol { public static class FeatureFlags { - public static bool Following { get; } = false; + public static bool Following { get; } = true; } } diff --git a/Classes/State.cs b/Classes/State.cs index abae1f6..e8e85bf 100644 --- a/Classes/State.cs +++ b/Classes/State.cs @@ -198,16 +198,18 @@ namespace Neighbourhood.omg.lol { } public bool IsFollowing(string address) => Following?.Contains(address) ?? false; - public void Follow(string address) { + public async Task Follow(string address) { if (Following == null) Following = new List(); Following.Add(address); Preferences.Default.Set("following", JsonSerializer.Serialize(Following)); + await GetFeed(forceRefresh: true); } - public void Unfollow(string address) { + public async Task Unfollow(string address) { if (Following == null) Following = new List(); Following.Remove(address); Preferences.Default.Set("following", JsonSerializer.Serialize(Following)); + await GetFeed(forceRefresh: true); } public async Task GetBio(string address, bool forceRefresh = false) { diff --git a/Components/Layout/AvatarMenuLinks.razor b/Components/Layout/AvatarMenuLinks.razor index 19df29f..dc9f2c0 100644 --- a/Components/Layout/AvatarMenuLinks.razor +++ b/Components/Layout/AvatarMenuLinks.razor @@ -4,9 +4,13 @@ 👋 Hey, @(State.Name ?? "there"). - + + + Now.garden + + - Address Directory + Directory @foreach (AddressResponseData address in State.AddressList ?? new List()) { @@ -32,13 +36,7 @@ } } -@if (FeatureFlags.Following && State.IsAuthorized) { - - - Feed - - -} + @if (State.IsAuthorized) { diff --git a/Components/Layout/FollowingList.razor b/Components/Layout/FollowingList.razor deleted file mode 100644 index 1f37ecd..0000000 --- a/Components/Layout/FollowingList.razor +++ /dev/null @@ -1,23 +0,0 @@ -@inject State State - -@if (State.Following != null) { -
- - - - Following - - - @foreach (string address in State.Following) { - - - @address - - } -
-} - -@code { - [Parameter] - public string? @class { get; set; } -} \ No newline at end of file diff --git a/Components/Layout/NavLinks.razor b/Components/Layout/NavLinks.razor index 7361d7e..770612e 100644 --- a/Components/Layout/NavLinks.razor +++ b/Components/Layout/NavLinks.razor @@ -11,24 +11,26 @@
Eph.emer.al
- - -
Now.garden
- +@if (FeatureFlags.Following && State.IsAuthorized) { + + +
Timeline
+ + + +
Now.garden
+ +} +else { + + +
Now.garden
+ +} - + + -
Address Directory
- -@if (FeatureFlags.Following) { - - - - -
Feed
- - - - -} \ No newline at end of file +
Directory
+ \ No newline at end of file diff --git a/Components/Pages/Ephemeral.razor b/Components/Pages/Ephemeral.razor index 364c93d..d0d29e0 100644 --- a/Components/Pages/Ephemeral.razor +++ b/Components/Pages/Ephemeral.razor @@ -22,7 +22,7 @@ @if (messages != null) { foreach (MarkupString message in messages) { -
+
@message
} diff --git a/Components/Pages/Feed.razor b/Components/Pages/Feed.razor index 1e5f953..9386a44 100644 --- a/Components/Pages/Feed.razor +++ b/Components/Pages/Feed.razor @@ -2,29 +2,85 @@ @implements IDisposable @inject IJSRuntime JS @inject State State +@inject NavigationManager Nav - + A feed of all the statuses and pics of the people you follow. -@if (feed != null) foreach (StatusOrPic item in feed) { - if (item.IsStatus) { - - } - else if (item.IsPic) { - - } +@if(!(State.Following?.Any() ?? false)) { + + + It looks like you're not following anyone yet. + + +

Check out the Directory (or other parts of the app) to find awesome people to follow.

} +else { +
+
+ + + Timeline + + + + Following + +
+
- +
+
+ @if (feed != null){ + foreach (StatusOrPic item in feed) { + if (item.IsStatus) { + + } + else if (item.IsPic) { + + } + } + } + +
+ +
+
    + @foreach (string address in State.Following ?? new List()) { + string displayAddress = address; + string linkAddress = address; + @* if (group.Key == "😀") { + try { + linkAddress = idn.GetAscii(address); + displayAddress = $"{address} {linkAddress}"; + } + catch (Exception) { } + } *@ +
  • + +
    + @displayAddress +
    + +
    • + } +
+
+
+} @code { private IOrderedEnumerable? feed; protected override async Task OnInitializedAsync() { await base.OnInitializedAsync(); + string fragment = new Uri(Nav.Uri).Fragment; + await JS.InvokeVoidAsync("ui", fragment); if (feed == null || feed.Count() == 0) feed = await State.GetFeed(); State.PropertyChanged += StateChanged; State.CanRefresh = true; @@ -41,6 +97,12 @@ } } + public async Task UnfollowClick(string address) { + await State.Unfollow(address); + feed = await State.GetFeed(forceRefresh: true); + await InvokeAsync(StateHasChanged); + } + public void Dispose() { State.PropertyChanged -= StateChanged; State.CanRefresh = false; diff --git a/Components/Pages/Person.razor b/Components/Pages/Person.razor index 3506f14..c95494e 100644 --- a/Components/Pages/Person.razor +++ b/Components/Pages/Person.razor @@ -14,12 +14,12 @@ @if (FeatureFlags.Following) {
@if (State.IsFollowing(Address)) { - } else { - } diff --git a/Components/PicCard.razor b/Components/PicCard.razor index 5b5c3ba..9bb69b3 100644 --- a/Components/PicCard.razor +++ b/Components/PicCard.razor @@ -1,35 +1,38 @@ @inject IJSRuntime JS -
+
-
- - @if(!string.IsNullOrWhiteSpace(Pic.Description)){ -

@((MarkupString)Pic.DescriptionHtml)

- } - else { -
- - This picture needs a description in order to be shared. -
- } - + else { +
+ + This picture needs a description in order to be shared. +
+ } + +
diff --git a/wwwroot/css/style.css b/wwwroot/css/style.css index b665c00..64c5dd6 100644 --- a/wwwroot/css/style.css +++ b/wwwroot/css/style.css @@ -18,6 +18,7 @@ --background: var(--gray-8); --shadow: var(--black); --button-shadow: var(--gray-7); + --max-article-size: 75rem; } body.dark { @@ -83,7 +84,7 @@ img { margin: 0 auto; } -.status .emoji { +:is(.status,.pic) .emoji { margin-bottom: auto; inline-size: 5.5rem; block-size: 5.5rem; @@ -92,7 +93,7 @@ img { text-indent: -10px; } -.status .emoji, #status-emoji, #new-status-emoji { +:is(.status,.pic) .emoji, #status-emoji, #new-status-emoji { margin-bottom: auto; inline-size: 3.5rem; block-size: 3.5rem; @@ -101,6 +102,10 @@ img { text-indent: -6px; } +:not(#feed)>.pic .emoji{ + display:none; +} + :is(h1, h2, h3, h4, h5, h6) :is(i.fa-at, i:only-child){ margin-right: 0; inline-size: auto; @@ -296,6 +301,10 @@ article.ephemeral { text-align: center; } +#now-garden{ + gap:1rem; +} + #now-garden > :not(.now) { position: absolute; } @@ -475,4 +484,15 @@ menu > details .row, menu > li > details .row { menu > details > a:is(:hover,:focus,.active), menu > details > summary:is(:hover,:focus,.active) { background-color: var(--active); +} + +article { + width: 100%; + max-width: var(--max-article-size); + margin-inline: auto; +} + +article.now { + margin: 0; + width:auto; } \ No newline at end of file