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

[frontend/components] Add state reconstruction to note search

Browse source
This commit is contained in:
Lilian 2024-09-11 03:20:13 +02:00
parent bc335b8f2c
commit b0bd41a4f0
No known key found for this signature in database
2 changed files with 55 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

56
Iceshrimp.Frontend/Components/SearchComponent.razor
View file

@ -6,9 +6,12 @@
@using Iceshrimp.Frontend.Localization @using Iceshrimp.Frontend.Localization
@using Iceshrimp.Shared.Schemas.Web @using Iceshrimp.Shared.Schemas.Web
@using Microsoft.Extensions.Localization @using Microsoft.Extensions.Localization
@using Iceshrimp.Frontend.Core.Services.StateServicePatterns
@inject IStringLocalizer<Localization> Loc; @inject IStringLocalizer<Localization> Loc;
@inject ApiService Api; @inject ApiService Api;
@inject NavigationManager Navigation; @inject NavigationManager Navigation;
@inject StateService StateService;
@inject IJSRuntime Js;
<div class="search"> <div class="search">
<input @bind="SearchString" class="input"/> <input @bind="SearchString" class="input"/>
@ -23,7 +26,7 @@
@if (_resultType == ResultType.Notes) @if (_resultType == ResultType.Notes)
{ {
<div class="note-results"> <div class="note-results" @ref="Scroller">
@if (NoteSearchInstance?.NoteResponses != null) @if (NoteSearchInstance?.NoteResponses != null)
{ {
foreach (var note in NoteSearchInstance?.NoteResponses!) foreach (var note in NoteSearchInstance?.NoteResponses!)
@ -61,11 +64,37 @@
} }
@code { @code {
private string SearchString { get; set; } = ""; private string SearchString { get; set; } = "";
private SearchTypeEnum SearchType { get; set; } = SearchTypeEnum.Note; private SearchTypeEnum SearchType { get; set; } = SearchTypeEnum.Note;
private NoteSearch? NoteSearchInstance { get; set; } private NoteSearch? NoteSearchInstance { get; set; }
private UserSearch? UserSearchInstance { get; set; } private UserSearch? UserSearchInstance { get; set; }
private ResultType _resultType; private IJSInProcessObjectReference Module { get; set; } = null!;
private ElementReference Scroller { get; set; }
private ResultType _resultType;
private bool _setScroll;
private float _scrollTop;
protected override async Task OnInitializedAsync()
{
Module = (IJSInProcessObjectReference)await Js.InvokeAsync<IJSObjectReference>("import", "/Components/SearchComponent.razor.js");
var state = StateService.Search.GetState();
if (state != null)
{
NoteSearchInstance = new NoteSearch(state.SearchString, Api, state.SearchResults);
_resultType = ResultType.Notes;
_scrollTop = state.ScrollTop;
_setScroll = true;
}
}
protected override void OnAfterRender(bool firstRender)
{
if (_setScroll)
{
SetScrollY(_scrollTop);
_setScroll = false;
}
}
private async Task Search() private async Task Search()
{ {
@ -118,6 +147,7 @@
private void OpenNote(string id) private void OpenNote(string id)
{ {
StateService.Search.SetState(new SearchState { SearchResults = NoteSearchInstance!.NoteResponses, ScrollTop = GetScrollY(), SearchString = NoteSearchInstance!.SearchString });
Navigation.NavigateTo($"/notes/{id}"); Navigation.NavigateTo($"/notes/{id}");
} }
@ -128,6 +158,16 @@
Navigation.NavigateTo($"/{username}"); Navigation.NavigateTo($"/{username}");
} }
private float GetScrollY()
{
return Module.Invoke<float>("GetScrollY");
}
private void SetScrollY(float scrollTop)
{
Module.InvokeVoid("SetScrollY", scrollTop);
}
private enum ResultType private enum ResultType
{ {
Default, Default,
@ -174,7 +214,7 @@
{ {
internal required string MinId = noteResponses.Last().Id; internal required string MinId = noteResponses.Last().Id;
internal required string MaxId = noteResponses.First().Id; internal required string MaxId = noteResponses.First().Id;
internal required string SearchString = searchString; public required string SearchString = searchString;
internal required ApiService Api = api; internal required ApiService Api = api;
public required List<NoteResponse> NoteResponses { get; init; } = noteResponses; public required List<NoteResponse> NoteResponses { get; init; } = noteResponses;
public bool SearchComplete = false; public bool SearchComplete = false;
@ -195,4 +235,4 @@
} }
} }
} }
} }

7
Iceshrimp.Frontend/Components/SearchComponent.razor.js Normal file
View file

@ -0,0 +1,7 @@
export function GetScrollY(){
return window.scrollY;
}
export function SetScrollY(number){
window.scroll(window.scrollX, number);
}