[frontend] Refactor Note rendering code, add quotes

Iceshrimp.Frontend/Components/Note/Note.razor

@@ -0,0 +1,9 @@
+@using Iceshrimp.Shared.Schemas
+
+<NoteComponent Note="NoteResponse" Quote="NoteResponse.Quote" Indented="Indented"></NoteComponent>
+
+@code {
+    [Parameter][EditorRequired] public required NoteResponse NoteResponse { get; set; }
+    [Parameter]                 public          bool         Indented     { get; set; }
+
+}

Iceshrimp.Frontend/Components/Note/NoteBody.razor

@@ -37,9 +37,9 @@
 
 
 @code {
-    [Parameter] public required NoteBase NoteBase   { get; set; }
-    [Parameter] public required bool     OverLength { get; set; }
-    [Parameter] public          bool     Indented   { get; set; } = false;
+    [Parameter] public required Shared.Schemas.NoteBase NoteBase   { get; set; }
+    [Parameter] public required bool                    OverLength { get; set; }
+    [Parameter] public          bool                    Indented   { get; set; } = false;
 
     private static int  MaxHeight => 500;
     private        bool Truncate  { get; set; } = true;

Iceshrimp.Frontend/Components/Note/NoteComponent.razor

@@ -1,6 +1,7 @@
 @using Iceshrimp.Frontend.Core.Services
 @using Iceshrimp.Shared.Schemas
 @inject ApiService ApiService;
+@inject NavigationManager NavigationManager
 <CascadingValue Value="this">
     <div class="note-header">
         <NoteUserInfo
@@ -15,16 +16,32 @@
             CreatedAt="DateTime.Parse(Note.CreatedAt)"></NoteMetadata>
     </div>
     <NoteBody NoteBase="Note" OverLength="@CheckLen()" Indented="Indented"/>
-    <NoteFooter Reactions="Note.Reactions" Likes="Note.Likes" IsLiked="Note.Liked"/>
+    @if (Quote != null)
+    {
+        <div @onclick="OpenQuote" @onclick:stopPropagation="true" class="quote">
+            <NoteComponent Note="Quote" AsQuote="true"></NoteComponent>
+        </div>
+    }
+    @if (!AsQuote)
+    {
+        <NoteFooter Reactions="Note.Reactions" Likes="Note.Likes" IsLiked="Note.Liked"/>
+    }
 </CascadingValue>
 @code {
-    [Parameter][EditorRequired] public required NoteResponse Note     { get; set; }
-    [Parameter]                 public          bool         Indented { get; set; }
+    [Parameter][EditorRequired] public required NoteBase  Note     { get; set; }
+    [Parameter]                 public          bool      Indented { get; set; }
+    [Parameter]                 public          NoteBase? Quote    { get; set; }
+    [Parameter]                 public          bool      AsQuote  { get; set; }
     private bool CheckLen()
     {
         return Note.Text?.Length > 500;
     }
 
+    private void OpenQuote()
+    {
+        NavigationManager.NavigateTo($"/notes/{Quote!.Id}");
+    }
+
     public void React(string name, bool target)
     {
         var index = Note.Reactions.FindIndex(x => x.Name == name);

Iceshrimp.Frontend/Components/Note/NoteComponent.razor.css

@@ -13,3 +13,12 @@
     width: 3em;
     height: 3em;
 }
+
+.quote {
+    border-style: solid;
+    border-color: var(--highlight-color);
+    border-width: 0.2rem;
+    border-radius: 1.25rem;
+    padding: 1rem;
+    margin: 0.5rem;
+}

Iceshrimp.Frontend/Components/Note/NoteMetadata.razor.css

@@ -3,6 +3,7 @@
     flex-direction: column;
     align-items: end;
     font-size: 0.9em;
+    white-space: nowrap;
     margin-left: auto;
     .info {
         display: block;

Iceshrimp.Frontend/Components/RecursiveNote.razor

@@ -1,4 +1,5 @@
 @using Iceshrimp.Shared.Schemas
+@using Iceshrimp.Frontend.Components.Note
 @inject NavigationManager NavigationManager
 
 <div class="@(Depth > 0 ? "descendant" : "root-note")">
@@ -14,7 +15,7 @@
             </div>
         }
         <div class="note" @onclick="OpenNote">
-            <NoteComponent Indented="_indented" Note="Note"/>
+            <Note Indented="_indented" NoteResponse="Note"/>
         </div>
     </div>
     @if (Note.Descendants != null)

Iceshrimp.Frontend/Components/TimelineNote.razor

@@ -1,7 +1,8 @@
 @using Iceshrimp.Shared.Schemas
+@using Iceshrimp.Frontend.Components.Note
 @inject NavigationManager Navigation
 <div class="note-container" @onclick="OpenNote" id="@Note.Id">
-    <NoteComponent Note="Note"></NoteComponent>
+    <Note NoteResponse="Note"></Note>
 </div>
 @code {
     [Parameter][EditorRequired] public required NoteResponse Note { get; set; }

Iceshrimp.Frontend/Components/TimelineNote.razor.css

@@ -3,6 +3,9 @@
     min-width: 20rem;
     background-color: var(--foreground-color);
     padding: 1.5rem 1.5rem 1rem; /* top, left-right, bottom*/
+    @media (max-width: 700px) {
+        padding: 1.5rem 1rem 1rem;
+    }
     border-radius: 0.75rem;
     margin-top: 1rem;
     margin-right: 0.5rem;

Iceshrimp.Frontend/Pages/Note.razor

@@ -1,45 +0,0 @@
-@page "/Note/{id}"
-@using Iceshrimp.Frontend.Core.Miscellaneous
-@using Iceshrimp.Frontend.Core.Services
-@using Iceshrimp.Shared.Schemas
-@using Iceshrimp.Frontend.Components
-@inject ApiService Api
-<h3>Authenticated note preview</h3>
-
-@if (_note != null)
-{
-    <TimelineNote Note="_note" />
-}
-else if (_error != null)
-{
-    <p>Error!: @_error.Error</p>
-}
-else
-{
-    <p>Fetching note...</p>
-}
-
-@code {
-    [Parameter]
-    public string Id { get; set; } = null!;
-
-    private ErrorResponse? _error;
-    private NoteResponse?  _note;
-
-    protected override async Task OnInitializedAsync()
-    {
-        try
-        {
-            _note = await Api.Notes.GetNote(Id) ?? throw new ApiException(new ErrorResponse
-            {
-                StatusCode = 404,
-                Error      = "Note not found",
-                RequestId  = "-"
-            });
-        }
-        catch (ApiException e)
-        {
-            _error = e.Response;
-        }
-    }
-}

Iceshrimp.Frontend/Pages/SingleNote.razor

@@ -2,13 +2,14 @@
 @using Iceshrimp.Shared.Schemas
 @using Iceshrimp.Frontend.Components
 @using Iceshrimp.Frontend.Core.Services
+@using Iceshrimp.Frontend.Components.Note
 @inject ApiService ApiService
 
 @if (_init)
 {
     <div class="scroller">
         <div class="root-note">
-            <NoteComponent Note="RootNote"></NoteComponent>
+            <Note NoteResponse="RootNote"></Note>
         </div>
         @if (Descendants != null)
         {