[frontend] Automatically scroll Note into view on SingleNote page

Iceshrimp.Frontend/Pages/SingleNote.razor

@@ -3,7 +3,8 @@
 @using Iceshrimp.Frontend.Components
 @using Iceshrimp.Frontend.Core.Services
 @using Iceshrimp.Frontend.Components.Note
-@inject ApiService ApiService
+@inject ApiService            ApiService
+@inject IJSRuntime            Js
 
 @if (_init)
 {
@@ -19,7 +20,7 @@
                         }
                     </div>
                 }
-                <div class="root-note">
+                <div @ref="RootNoteRef" class="root-note">
                     <Note NoteResponse="RootNote"></Note>
                 </div>
                 @if (Descendants != null)
@@ -49,6 +50,8 @@ else
     public             NoteResponse?        RootNote    { get; set; }
     private            IList<NoteResponse>? Descendants { get; set; }
     private            IList<NoteResponse>? Ascendants  { get; set; }
+    private            IJSObjectReference?  Module      { get; set; }
+    private            ElementReference     RootNoteRef        { get; set; }
     private            bool                 _init  = false;
     private            bool                 _error = false;
 
@@ -77,4 +80,17 @@ else
         StateHasChanged();
     }
 
+    protected override async Task OnAfterRenderAsync(bool firstRender)
+    {
+        if (firstRender)
+        {
+            Module = await Js.InvokeAsync<IJSObjectReference>("import", "/Pages/SingleNote.razor.js");
+        }
+
+        if (_init)
+        {
+            await Module.InvokeVoidAsync("ScrollIntoView", RootNoteRef);
+        }
+    }
+
 }

Iceshrimp.Frontend/Pages/SingleNote.razor.css

@@ -1,6 +1,6 @@
 .root-note {
     max-width: 45rem;
-    /*min-width: 25rem;*/
+    min-width: 25rem;
     background-color: var(--foreground-color);
     width: 100%;
     padding-bottom: 1rem;
@@ -10,6 +10,9 @@
     height: 100vh;
     overflow-y: scroll;
     overflow-x: clip;
+    @media (max-width: 1000px) {
+        padding-bottom: 5rem;
+    }
 }
 .descendants {
     display: flex;
@@ -33,4 +36,4 @@
 
 }
 .ascendants {
-}
+}

Iceshrimp.Frontend/Pages/SingleNote.razor.js

@@ -0,0 +1,11 @@
+export function GetScrollTop(ref) {
+    return ref.scrollTop;
+}
+
+export function SetScrollTop(ref, number) {
+    ref.scrollTop = number;
+}
+
+export function ScrollIntoView(ref) {
+    ref.scrollIntoView(true)
+}