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

[frontend] Note liking/unliking

Browse source
This commit is contained in:
Lilian 2024-04-20 05:41:23 +02:00
parent 46d9fef403
commit 1f1cb13def
No known key found for this signature in database
GPG key ID: 007CA12D692829E1
4 changed files with 89 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
Iceshrimp.Frontend/Components/NoteComponent.razor
View file

@ -14,7 +14,7 @@
CreatedAt="DateTime.Parse(Note.CreatedAt)"></NoteMetadata>
</div>
<NoteBody NoteBase="Note" OverLength="@CheckLen()"/>
<NoteFooter Reactions="Note.Reactions"/>
<NoteFooter Reactions="Note.Reactions" Likes="Note.Likes" IsLiked="Note.Liked"/>
</CascadingValue>
@code {
[Parameter][EditorRequired] public required NoteResponse Note { get; set; }
@ -47,4 +47,22 @@
break;
}
}
public void Like()
{
if (Note.Liked)
{
ApiService.Notes.UnlikeNote(Note.Id);
Note.Liked = false;
Note.Likes--;
StateHasChanged();
}
else
{
ApiService.Notes.LikeNote(Note.Id);
Note.Liked = true;
Note.Likes++;
StateHasChanged();
}
}
}

23
Iceshrimp.Frontend/Components/NoteFooter.razor
View file

@ -16,8 +16,17 @@
<button class="btn">
<Icon Name="Icons.ArrowsClockwise"/>
</button>
<button class="btn">
<Icon Name="Icons.Heart"/>
<button @onclick="Like" class="btn">
@if (IsLiked)
{
<Icon Name="Icons.Heart" Pack="IconStyle.Fill"/>
}else {
<Icon Name="Icons.Heart"/>
}
@if (Likes > 0)
{
<span class="like-count">@Likes</span>
}
</button>
<button class="btn">
<Icon Name="Icons.Smiley"/>
@ -27,6 +36,14 @@
</button>
</div>
@code {
[Parameter] [EditorRequired] public required List<NoteReactionSchema> Reactions { get; set; }
[Parameter] [EditorRequired] public required List<NoteReactionSchema> Reactions { get; set; }
[Parameter] [EditorRequired] public required int Likes { get; set; }
[Parameter] [EditorRequired] public required bool IsLiked { get; set; }
[CascadingParameter] NoteComponent NoteComponent { get; set; }
private void Like()
{
NoteComponent.Like();
}
}

12
Iceshrimp.Frontend/Components/NoteFooter.razor.css
View file

@ -2,9 +2,15 @@
margin-top: 0.5em;
}
.btn{
width: 2.5em;
display: inline-flex;
align-items: center;
min-width: 2.5em;
height: 2em;
padding: 0.5em;
margin-right: 0.5em;
padding: 0.75em;
/*margin-right: 0.5em;*/
background-color: var(--foreground-color);
width: fit-content;
}
.like-count{
margin-left: 0.3em;
}

47
Iceshrimp.Frontend/Components/TimelineComponent.razor
View file

@ -1,23 +1,58 @@
@using Iceshrimp.Frontend.Core.Miscellaneous
@using Iceshrimp.Frontend.Core.Services
@using Iceshrimp.Shared.Schemas
@using Ljbc1994.Blazor.IntersectionObserver.API
@using Ljbc1994.Blazor.IntersectionObserver.Components
@inject ApiService ApiService
@if (_init)
{
@foreach (var note in Timeline)
{
<TimelineNote Note="note" />
<LazyNote Note="note" />
}
<IntersectionObserve OnChange="entry => OnEnd(entry)">
<div @ref="context.Ref.Current" class="end">END!</div>
</IntersectionObserve>
}
else
{
<div>Loading</div>
}
@code {
private List<NoteResponse> Timeline { get; set; } = [];
private bool _init = false;
private List<NoteResponse> Timeline { get; set; } = [];
private bool _init = false;
private string? MaxId { get; set; }
private string? MinId { get; set; }
private bool LockFetch { get; set; }
public async Task Initialize()
private async Task Initialize()
{
var pq = new PaginationQuery() { Limit = 25 };
var res = await ApiService.Timelines.GetHomeTimeline(pq);
MaxId = res[0].Id;
MinId = res.Last().Id;
Timeline = res;
}
private async Task FetchOlder()
{
if (LockFetch) return;
LockFetch = true;
var pq = new PaginationQuery() { Limit = 5, MaxId = MinId };
var res = await ApiService.Timelines.GetHomeTimeline(pq);
if (res.Count > 0)
{
MinId = res.Last().Id;
Timeline.AddRange(res);
}
LockFetch = false;
}
private void OnEnd(IntersectionObserverEntry entry)
{
var res = await ApiService.Timelines.GetHomeTimeline(new PaginationQuery() { Limit = 50 });
Timeline = res;
FetchOlder();
}
protected override async Task OnInitializedAsync()