TrendTimelinePanel: improved error handling

src/timelines/TrendTimelinePanel.tsx

@@ -3,7 +3,6 @@ import {
   For,
   onCleanup,
   createSignal,
-  Show,
   untrack,
   Match,
   Switch as JsSwitch,
@@ -11,7 +10,7 @@ import {
   createSelector,
 } from "solid-js";
 import { type mastodon } from "masto";
-import { Button, LinearProgress } from "@suid/material";
+import { Button } from "@suid/material";
 import { createTimelineSnapshot } from "../masto/timelines.js";
 import { vibrate } from "../platform/hardware.js";
 import PullDownToRefresh from "./PullDownToRefresh.jsx";
@@ -40,7 +39,7 @@ const TrendTimelinePanel: Component<{
 
   const tlEndObserver = new IntersectionObserver(() => {
     if (untrack(() => props.prefetch) && !snapshot.loading)
-      refetchTimeline({ direction: "old" });
+      refetchTimeline();
   });
 
   onCleanup(() => tlEndObserver.disconnect());
@@ -143,26 +142,19 @@ const TrendTimelinePanel: Component<{
       </div>
 
       <div ref={(e) => tlEndObserver.observe(e)}></div>
-      <Show when={snapshot.loading}>
-        <div
-          class="loading-line"
-          style={{
-            width: "100%",
-          }}
-        >
-          <LinearProgress />
-        </div>
-      </Show>
       <div
         style={{
           display: "flex",
           padding: "20px 0 calc(20px + var(--safe-area-inset-bottom, 0px))",
           "align-items": "center",
           "justify-content": "center",
+          "flex-flow": "column",
+          gap: "20px"
         }}
       >
         <JsSwitch>
           <Match when={snapshot.error}>
+            <p>{`Oops: ${snapshot.error}`}</p>
             <Button
               variant="contained"
               onClick={[refetchTimeline, undefined]}
@@ -170,6 +162,7 @@ const TrendTimelinePanel: Component<{
             >
               Retry
             </Button>
+
           </Match>
           <Match when={true}>
             <Button