Improve error message when local project is unavailable — radicle-explorer

👉 Preview
👉 Workflow runs
👉 Branch on GitHub

 <script lang="ts">
   import type {
     ResponseError,
     ResponseParseError,
   } from "@httpd-client/lib/fetcher";
   import type { ComponentProps } from "svelte";
   import type { ErrorParam } from "@app/lib/router/definitions";
   import { config } from "@app/lib/config";
   import Command from "./Command.svelte";

   export let title: string;
   export let description: string;
   export let error: Error | ResponseParseError | ResponseError | undefined =
     undefined;
   export let error: ErrorParam = undefined;
   export let icon: ComponentProps<Icon>["name"] = "alert";
 </script>

 import type { HomeRoute, HomeLoadedRoute } from "@app/views/home/router";
 import type {
   ResponseParseError,
   ResponseError,
   ResponseParseError,
 } from "@httpd-client/lib/fetcher";
 import type { HomeRoute, HomeLoadedRoute } from "@app/views/home/router";
 import type {
   ProjectLoadedRoute,
   ProjectRoute,

   };
 }
 export type ErrorParam = Error | ResponseParseError | ResponseError | undefined;
 export interface ErrorRoute {
   resource: "error";
   params: {
     title: string;
     description: string;
     error: Error | ResponseError | ResponseParseError;
     error: ErrorParam;
   };
 }

 <script lang="ts">
   import type { ComponentProps } from "svelte";
   import type { ErrorParam } from "@app/lib/router/definitions";
   import AppLayout from "@app/App/AppLayout.svelte";
   import ErrorMessage from "@app/components/ErrorMessage.svelte";
   export let title: string;
   export let description: string;
   export let error: ComponentProps<ErrorMessage>["error"];
   export let error: ErrorParam = undefined;
 </script>
 <style>

 import type { ErrorRoute, NotFoundRoute } from "@app/lib/router/definitions";
 import type { ProjectRoute } from "@app/views/projects/router";
 import { baseUrlToUrl } from "@app/lib/utils";
 import { baseUrlToUrl, isLocal } from "@app/lib/utils";
 import { ResponseParseError, ResponseError } from "@httpd-client/lib/fetcher";
 import { httpdStore } from "@app/lib/httpd";
 import { get } from "svelte/store";
 export function handleError(
   error: Error | ResponseParseError | ResponseError,

           "The response received from the seed does not match the expected schema, this is usually due to a version mismatch between the seed and the web interface.",
       },
     };
   } else if (
     error instanceof TypeError &&
     error.message === "Failed to fetch" &&
     isLocal(route.node.hostname) &&
     get(httpdStore).state === "stopped"
   ) {
     return {
       resource: "error",
       params: {
         title: "Could not load this project",
         description:
           "You're trying to access a project on your local node but the app is not connected to it. Click the Connect button in the top right corner to connect.",
         error: undefined,
       },
     };
   } else {
     return {
       resource: "error",